MediaWiki:Common.css - Історія редагувань

Admin: Картки: повна консолідація (заголовки→ink, тіні→shadow-токени, CTA/meta/лінки→токени)

2026-08-02T23:21:43Z

Картки: повна консолідація (заголовки→ink, тіні→shadow-токени, CTA/meta/лінки→токени)

← Попередня версія		Версія за 02:21, 3 серпня 2026
Рядок 19:		Рядок 19:
	border-radius: var(--k-radius-md);		border-radius: var(--k-radius-md);
	overflow: hidden;		overflow: hidden;
	box-shadow: ~~0 1px 2px rgba~~(~~0,0,0,.03), 0 1px 8px rgba(0,0,0,.04~~);		box-shadow: var(--k-shadow-1);
	transition: transform .15s ease, box-shadow .15s ease;		transition: transform .15s ease, box-shadow .15s ease;
	}		}
	.place-card:hover {		.place-card:hover {
	transform: translateY(-2px);		transform: translateY(-2px);
	box-shadow: ~~0 2px 4px rgba~~(~~0,0,0,.04), 0 6px 18px rgba(0,0,0,.08~~);		box-shadow: var(--k-shadow-2);
	}		}
	.place-card__img {		.place-card__img {
Рядок 40:		Рядок 40:
	.place-card__body { padding: 14px 18px 18px; }		.place-card__body { padding: 14px 18px 18px; }
	.place-card__title { font-size: 17px; font-weight: 700; margin: 0 0 8px; line-height: 1.25; }		.place-card__title { font-size: 17px; font-weight: 700; margin: 0 0 8px; line-height: 1.25; }
	.place-card__title a { color: ~~#111827~~; text-decoration: none; }		.place-card__title a { color: var(--k-ink); text-decoration: none; }
	.place-card__title a:hover { color: var(--k-accent); }		.place-card__title a:hover { color: var(--k-accent); }
	.place-card__meta { font-size: 13px; color: var(--k-text-muted); margin: 0 0 10px; line-height: 1.5; }		.place-card__meta { font-size: 13px; color: var(--k-text-muted); margin: 0 0 10px; line-height: 1.5; }
Рядок 561:		Рядок 561:
	border-radius: var(--k-radius-md);		border-radius: var(--k-radius-md);
	overflow: hidden;		overflow: hidden;
	box-shadow: ~~0 1px 2px rgba~~(~~0,0,0,.03), 0 1px 8px rgba(0,0,0,.04~~);		box-shadow: var(--k-shadow-1);
	transition: transform .15s ease, box-shadow .15s ease;		transition: transform .15s ease, box-shadow .15s ease;
	}		}
	.service-card:hover {		.service-card:hover {
	transform: translateY(-2px);		transform: translateY(-2px);
	box-shadow: ~~0 2px 4px rgba~~(~~0,0,0,.04), 0 6px 18px rgba(0,0,0,.08~~);		box-shadow: var(--k-shadow-2);
	}		}
	.service-card__body { padding: 16px 20px 18px; }		.service-card__body { padding: 16px 20px 18px; }
Рядок 575:		Рядок 575:
	line-height: 1.25;		line-height: 1.25;
	}		}
	.service-card__title a { color: ~~#111827~~; text-decoration: none; }		.service-card__title a { color: var(--k-ink); text-decoration: none; }
	.service-card__title a:hover { color: var(--k-accent); }		.service-card__title a:hover { color: var(--k-accent); }
	.service-card__members {		.service-card__members {
Рядок 597:		Рядок 597:
	gap: 4px;		gap: 4px;
	font-size: 13px;		font-size: 13px;
	color: ~~#4b5563~~;		color: var(--k-text-secondary);
	border-top: 1px solid #f3f4f6;		border-top: 1px solid #f3f4f6;
	padding-top: 10px;		padding-top: 10px;
Рядок 608:		Рядок 608:
	background-size: 14px 14px;		background-size: 14px 14px;
	}		}
	.service-card__row a { color: var(--k-accent); text-decoration: none; }		.service-card__row a { color: var(--k-accent) !important; text-decoration: none; }
	.service-card__row a:hover { text-decoration: underline; }		.service-card__row a:hover { text-decoration: underline; }

	/* SVG-іконки (Heroicons solid, fill ~~#4b5563~~, URL-encoded) */		/* SVG-іконки (Heroicons solid, fill var(--k-text-secondary), URL-encoded) */
	.service-card__row--phone {		.service-card__row--phone {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27%234b5563%27%3E%3Cpath%20fill-rule%3D%27evenodd%27%20d%3D%27M1.5%204.5a3%203%200%200%201%203-3h1.372c.86%200%201.61.586%201.819%201.42l1.105%204.423a1.875%201.875%200%200%201-.694%201.955l-1.293.97c-.135.101-.164.249-.126.352a11.285%2011.285%200%200%200%206.197%206.197c.103.038.25.009.352-.126l.97-1.293a1.875%201.875%200%200%201%201.955-.694l4.423%201.105c.834.209%201.42.959%201.42%201.82V19.5a3%203%200%200%201-3%203h-2.25C8.552%2022.5%201.5%2015.448%201.5%206.75V4.5z%27%20clip-rule%3D%27evenodd%27%2F%3E%3C%2Fsvg%3E");		background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27%234b5563%27%3E%3Cpath%20fill-rule%3D%27evenodd%27%20d%3D%27M1.5%204.5a3%203%200%200%201%203-3h1.372c.86%200%201.61.586%201.819%201.42l1.105%204.423a1.875%201.875%200%200%201-.694%201.955l-1.293.97c-.135.101-.164.249-.126.352a11.285%2011.285%200%200%200%206.197%206.197c.103.038.25.009.352-.126l.97-1.293a1.875%201.875%200%200%201%201.955-.694l4.423%201.105c.834.209%201.42.959%201.42%201.82V19.5a3%203%200%200%201-3%203h-2.25C8.552%2022.5%201.5%2015.448%201.5%206.75V4.5z%27%20clip-rule%3D%27evenodd%27%2F%3E%3C%2Fsvg%3E");
Рядок 630:		Рядок 630:
	justify-content: center;		justify-content: center;
	text-align: center;		text-align: center;
	background: ~~#f8fafc~~;		background: var(--k-bg-subtle);
	border: 2px dashed ~~#cbd5e1~~;		border: 2px dashed var(--k-border-strong);
	box-shadow: none;		box-shadow: none;
	color: ~~#4b5563~~;		color: var(--k-text-secondary);
	text-decoration: none;		text-decoration: none;
	padding: 16px 20px 18px;		padding: 16px 20px 18px;

Admin: Картки: .service-card/.place-card на токени (точні збіги, вигляд не змінюється)

2026-08-02T23:17:11Z

Картки: .service-card/.place-card на токени (точні збіги, вигляд не змінюється)

← Попередня версія		Версія за 02:17, 3 серпня 2026
Рядок 15:		Рядок 15:
	display: flex;		display: flex;
	flex-direction: column;		flex-direction: column;
	background: ~~#fff~~;		background: var(--k-bg);
	border: 1px solid ~~#eef1f6~~;		border: 1px solid var(--k-border);
	border-radius: ~~14px~~;		border-radius: var(--k-radius-md);
	overflow: hidden;		overflow: hidden;
	box-shadow: 0 1px 2px rgba(0,0,0,.03), 0 1px 8px rgba(0,0,0,.04);		box-shadow: 0 1px 2px rgba(0,0,0,.03), 0 1px 8px rgba(0,0,0,.04);
Рядок 41:		Рядок 41:
	.place-card__title { font-size: 17px; font-weight: 700; margin: 0 0 8px; line-height: 1.25; }		.place-card__title { font-size: 17px; font-weight: 700; margin: 0 0 8px; line-height: 1.25; }
	.place-card__title a { color: #111827; text-decoration: none; }		.place-card__title a { color: #111827; text-decoration: none; }
	.place-card__title a:hover { color: ~~#2a6df4~~; }		.place-card__title a:hover { color: var(--k-accent); }
	.place-card__meta { font-size: 13px; color: ~~#6b7280~~; margin: 0 0 10px; line-height: 1.5; }		.place-card__meta { font-size: 13px; color: var(--k-text-muted); margin: 0 0 10px; line-height: 1.5; }
	.place-card__desc { font-size: 14px; line-height: 1.5; color: ~~#374151~~; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }		.place-card__desc { font-size: 14px; line-height: 1.5; color: var(--k-text-secondary); display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
	/* Whole card clickable (stretched link) */		/* Whole card clickable (stretched link) */
	.place-card { position: relative; cursor: pointer; }		.place-card { position: relative; cursor: pointer; }
Рядок 52:		Рядок 52:
	.place-detail { max-width: 760px; }		.place-detail { max-width: 760px; }
	.place-detail__img img { display:block; max-width:100%; height:auto; border-radius:14px; margin:4px 0 16px; }		.place-detail__img img { display:block; max-width:100%; height:auto; border-radius:14px; margin:4px 0 16px; }
	.place-detail__meta { font-size:14px; color:~~#6b7280~~; line-height:1.7; margin:0 0 14px; }		.place-detail__meta { font-size:14px; color:var(--k-text-muted); line-height:1.7; margin:0 0 14px; }
	.place-detail__desc { font-size:16px; line-height:1.65; color:~~#374151~~; }		.place-detail__desc { font-size:16px; line-height:1.65; color:var(--k-text-secondary); }
	.place-detail__desc--empty { color:~~#9ca3af~~; font-style:italic; }		.place-detail__desc--empty { color:var(--k-text-hint); font-style:italic; }

	/* Grid: 2 columns desktop, 1 column mobile */		/* Grid: 2 columns desktop, 1 column mobile */
Рядок 557:		Рядок 557:
	display: flex;		display: flex;
	flex-direction: column;		flex-direction: column;
	background: ~~#fff~~;		background: var(--k-bg);
	border: 1px solid ~~#eef1f6~~;		border: 1px solid var(--k-border);
	border-radius: ~~14px~~;		border-radius: var(--k-radius-md);
	overflow: hidden;		overflow: hidden;
	box-shadow: 0 1px 2px rgba(0,0,0,.03), 0 1px 8px rgba(0,0,0,.04);		box-shadow: 0 1px 2px rgba(0,0,0,.03), 0 1px 8px rgba(0,0,0,.04);
Рядок 576:		Рядок 576:
	}		}
	.service-card__title a { color: #111827; text-decoration: none; }		.service-card__title a { color: #111827; text-decoration: none; }
	.service-card__title a:hover { color: ~~#2a6df4~~; }		.service-card__title a:hover { color: var(--k-accent); }
	.service-card__members {		.service-card__members {
	display: inline-block;		display: inline-block;
Рядок 582:		Рядок 582:
	font-size: 12px;		font-size: 12px;
	font-weight: 500;		font-weight: 500;
	color: ~~#6b7280~~;		color: var(--k-text-muted);
	white-space: nowrap;		white-space: nowrap;
	vertical-align: middle;		vertical-align: middle;
Рядок 589:		Рядок 589:
	font-size: 14px;		font-size: 14px;
	line-height: 1.5;		line-height: 1.5;
	color: ~~#374151~~;		color: var(--k-text-secondary);
	margin-bottom: 12px;		margin-bottom: 12px;
	}		}
Рядок 608:		Рядок 608:
	background-size: 14px 14px;		background-size: 14px 14px;
	}		}
	.service-card__row a { color: ~~#2a6df4~~; text-decoration: none; }		.service-card__row a { color: var(--k-accent); text-decoration: none; }
	.service-card__row a:hover { text-decoration: underline; }		.service-card__row a:hover { text-decoration: underline; }

Рядок 639:		Рядок 639:
	}		}
	.service-card--cta:hover {		.service-card--cta:hover {
	border-color: ~~#2a6df4~~;		border-color: var(--k-accent);
	background: #f0f6ff;		background: #f0f6ff;
	color: ~~#2a6df4~~;		color: var(--k-accent);
	transform: translateY(-2px);		transform: translateY(-2px);
	box-shadow: none;		box-shadow: none;
Рядок 650:		Рядок 650:
	height: 36px;		height: 36px;
	border-radius: 50%;		border-radius: 50%;
	background: ~~#fff~~;		background: var(--k-bg);
	border: 1.5px solid currentColor;		border: 1.5px solid currentColor;
	display: flex;		display: flex;
Рядок 668:		Рядок 668:
	display: block;		display: block;
	font-size: 12px;		font-size: 12px;
	color: ~~#6b7280~~;		color: var(--k-text-muted);
	margin-top: 4px;		margin-top: 4px;
	}		}

Admin: UI Kit: компонент картки .k-card__* + .k-badge (ціль для .place-card/.service-card)

2026-08-02T21:15:34Z

UI Kit: компонент картки .k-card__* + .k-badge (ціль для .place-card/.service-card)

@@ Рядок 2128: / Рядок 2128: @@
 .k-label{font:var(--k-fw-medium) var(--k-fs-sm)/var(--k-lh-base) var(--k-font-sans);color:var(--k-text-secondary)}
 .k-label span{font-weight:var(--k-fw-normal);color:var(--k-text-hint)}
 /* === /krai-uikit === */

Admin: попап: ховати порожній .krai-fb-msg (прибрати зайвий відступ під кнопками)

2026-08-02T18:01:11Z

попап: ховати порожній .krai-fb-msg (прибрати зайвий відступ під кнопками)

← Попередня версія		Версія за 21:01, 2 серпня 2026
Рядок 2143:		Рядок 2143:
	.krai-fb-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0}		.krai-fb-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0}
	.krai-fb-actions{display:flex;justify-content:flex-end;gap:10px}		.krai-fb-actions{display:flex;justify-content:flex-end;gap:10px}
	.krai-fb-msg{font-size:13px~~;min~~-~~height~~:~~1em~~}		.krai-fb-msg{font-size:13px}
			.krai-fb-msg:empty{display:none}
	.krai-fb-msg.is-ok{color:var(--k-success)}		.krai-fb-msg.is-ok{color:var(--k-success)}
	.krai-fb-msg.is-err{color:var(--k-danger)}		.krai-fb-msg.is-err{color:var(--k-danger)}
	/* === /krai-feedback === */		/* === /krai-feedback === */

Admin: .k-field: геп лейбл→інпут 12px

2026-08-02T17:20:03Z

.k-field: геп лейбл→інпут 12px

← Попередня версія		Версія за 20:20, 2 серпня 2026
Рядок 2125:		Рядок 2125:

	.k-form{display:flex;flex-direction:column;gap:var(--k-space-5)} /* геп між полями — регулюється тут */		.k-form{display:flex;flex-direction:column;gap:var(--k-space-5)} /* геп між полями — регулюється тут */
	.k-field{display:flex;flex-direction:column;gap:var(--k-space-2)} /* геп лейбл → інпут */		.k-field{display:flex;flex-direction:column;gap:var(--k-space-3)} /* геп лейбл → інпут (12px) */
	.k-label{font:var(--k-fw-medium) var(--k-fs-sm)/var(--k-lh-base) var(--k-font-sans);color:var(--k-text-secondary)}		.k-label{font:var(--k-fw-medium) var(--k-fs-sm)/var(--k-lh-base) var(--k-font-sans);color:var(--k-text-secondary)}
	.k-label span{font-weight:var(--k-fw-normal);color:var(--k-text-hint)}		.k-label span{font-weight:var(--k-fw-normal);color:var(--k-text-hint)}

Admin: UI Kit: компонент .k-field/.k-form (лейбл+інпут, регульований геп); попап правок на них

2026-08-02T16:59:54Z

UI Kit: компонент .k-field/.k-form (лейбл+інпут, регульований геп); попап правок на них

← Попередня версія		Версія за 19:59, 2 серпня 2026
Рядок 2123:		Рядок 2123:
	.k-pill--yellow{background:rgba(248,176,32,.16);color:#9a6a00}		.k-pill--yellow{background:rgba(248,176,32,.16);color:#9a6a00}
	.k-pill--teal{background:rgba(0,184,152,.14);color:#067a64}		.k-pill--teal{background:rgba(0,184,152,.14);color:#067a64}

			.k-form{display:flex;flex-direction:column;gap:var(--k-space-5)} /* геп між полями — регулюється тут */
			.k-field{display:flex;flex-direction:column;gap:var(--k-space-2)} /* геп лейбл → інпут */
			.k-label{font:var(--k-fw-medium) var(--k-fs-sm)/var(--k-lh-base) var(--k-font-sans);color:var(--k-text-secondary)}
			.k-label span{font-weight:var(--k-fw-normal);color:var(--k-text-hint)}
	/* === /krai-uikit === */		/* === /krai-uikit === */

Рядок 2136:		Рядок 2141:
	.krai-fb-title{margin:0 0 4px;font-size:20px;color:var(--k-ink);border:none;padding:0}		.krai-fb-title{margin:0 0 4px;font-size:20px;color:var(--k-ink);border:none;padding:0}
	.krai-fb-sub{margin:0 0 14px;font-size:13px;color:var(--k-text-muted)}		.krai-fb-sub{margin:0 0 14px;font-size:13px;color:var(--k-text-muted)}
	~~.krai-fb-form label.krai-fb-label{display:block;font-size:13px;font-weight:600;margin:12px 0 4px;color:var(--k-text-secondary)}~~
	~~.krai-fb-label span{font-weight:400;color:var(--k-text-hint)}~~
	.krai-fb-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0}		.krai-fb-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0}
	.krai-fb-actions{display:flex;justify-content:flex-end;gap:10px~~;margin-top:16px~~}		.krai-fb-actions{display:flex;justify-content:flex-end;gap:10px}
	.krai-fb-msg{~~margin-top:10px;~~font-size:13px;min-height:1em}		.krai-fb-msg{font-size:13px;min-height:1em}
	.krai-fb-msg.is-ok{color:var(--k-success)}		.krai-fb-msg.is-ok{color:var(--k-success)}
	.krai-fb-msg.is-err{color:var(--k-danger)}		.krai-fb-msg.is-err{color:var(--k-danger)}
	/* === /krai-feedback === */		/* === /krai-feedback === */

Admin: feedback-віджет: біла кнопка override

2026-08-02T16:47:23Z

feedback-віджет: біла кнопка override

← Попередня версія		Версія за 19:47, 2 серпня 2026
Рядок 2127:		Рядок 2127:
	/* === Країнопедія: віджет «Повідомити про правку» (krai-feedback) — на UI Kit === */		/* === Країнопедія: віджет «Повідомити про правку» (krai-feedback) — на UI Kit === */
	/* Кольори/радіуси/тіні — з токенів --k-. Тут лише layout/позиціонування. /		/* Кольори/радіуси/тіні — з токенів --k-. Тут лише layout/позиціонування. /
	.krai-fb-btn{position:fixed;right:16px;bottom:16px;z-index:1000;box-shadow:var(--k-shadow-2)}		.krai-fb-btn{position:fixed;right:16px;bottom:16px;z-index:var(--k-z-fixed,1000);background:var(--k-bg);color:var(--k-ink);box-shadow:var(--k-shadow-2)}
	@media(max-width:640px){.krai-fb-btn{right:10px;bottom:10px}}		@media(max-width:640px){.krai-fb-btn{right:10px;bottom:10px}}
	.krai-fb-tip{position:absolute;z-index:1002;padding:6px 12px;font-size:13px;box-shadow:var(--k-shadow-2);white-space:nowrap}		.krai-fb-tip{position:absolute;z-index:var(--k-z-tip,1002);padding:6px 12px;font-size:13px;background:var(--k-bg);color:var(--k-ink);box-shadow:var(--k-shadow-2);white-space:nowrap}
	.krai-fb-overlay{display:none;position:fixed;inset:0;z-index:1001;background:rgba(26,34,64,.5);align-items:center;justify-content:center;padding:16px}		.krai-fb-overlay{display:none;position:fixed;inset:0;z-index:1001;background:rgba(26,34,64,.5);align-items:center;justify-content:center;padding:16px}
	.krai-fb-overlay.is-open{display:flex}		.krai-fb-overlay.is-open{display:flex}

Admin: UI Kit: розширені токени (spacing/radii/shadow/typography/z)

2026-08-02T16:05:32Z

UI Kit: розширені токени (spacing/radii/shadow/typography/z)

← Попередня версія		Версія за 19:05, 2 серпня 2026
Рядок 2058:		Рядок 2058:
	.service-card__row--cnas {		.service-card__row--cnas {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27%234b5563%27%3E%3Cpath%20fill-rule%3D%27evenodd%27%20d%3D%27M12.516%202.17a.75.75%200%2000-1.032%200%2011.209%2011.209%200%2001-7.877%203.08.75.75%200%2000-.722.515A12.74%2012.74%200%20002.25%209.75c0%205.942%204.064%2010.933%209.563%2012.348a.749.749%200%2000.374%200C17.686%2020.683%2021.75%2015.692%2021.75%209.75c0-1.44-.24-2.83-.678-4.128a.75.75%200%2000-.722-.515%2011.209%2011.209%200%2001-7.834-3.08zM15.53%209.53a.75.75%200%2000-1.06-1.06l-3.97%203.97-1.47-1.47a.75.75%200%2000-1.06%201.06l2%202a.75.75%200%20001.06%200l4.5-4.5z%27%20clip-rule%3D%27evenodd%27%2F%3E%3C%2Fsvg%3E");		background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27%234b5563%27%3E%3Cpath%20fill-rule%3D%27evenodd%27%20d%3D%27M12.516%202.17a.75.75%200%2000-1.032%200%2011.209%2011.209%200%2001-7.877%203.08.75.75%200%2000-.722.515A12.74%2012.74%200%20002.25%209.75c0%205.942%204.064%2010.933%209.563%2012.348a.749.749%200%2000.374%200C17.686%2020.683%2021.75%2015.692%2021.75%209.75c0-1.44-.24-2.83-.678-4.128a.75.75%200%2000-.722-.515%2011.209%2011.209%200%2001-7.834-3.08zM15.53%209.53a.75.75%200%2000-1.06-1.06l-3.97%203.97-1.47-1.47a.75.75%200%2000-1.06%201.06l2%202a.75.75%200%20001.06%200l4.5-4.5z%27%20clip-rule%3D%27evenodd%27%2F%3E%3C%2Fsvg%3E");
	}/* Країнопедія — дизайн-токени + house-компоненти (~~ПРОПОЗИЦІЯ, ще не залито~~).		}/* === Країнопедія UI Kit: дизайн-токени + house-компоненти === */
	~~Джерело правди для кольору~~/~~радіусів~~/~~тіней~~. ~~Мета: 43 hex~~ → ~~~14 токенів~~, ~~8 радіусів → 3~~. */		/* ЄДИНЕ ДЖЕРЕЛО ПРАВДИ. Живе в MediaWiki:Common.css (сайт) і віддзеркалюється
			на сторінці https://nomadica.uno/uikit/ (вона вантажить цей же Common.css живим).
			Правиш тут → міняється і сайт, і кіт. */
	:root{		:root{
	/* — Бренд-мотив (чотири кольори смугастих банерів) — */		/* — Бренд-мотив (чотири кольори смугастих банерів) — */
	--k-brand-blue:#1070b0;		--k-brand-blue:#1070b0; --k-brand-red:#f84840; --k-brand-yellow:#f8b020; --k-brand-teal:#00b898;
	--k-brand-red:#f84840;
	--k-brand-yellow:#f8b020;
	--k-brand-teal:#00b898;

	/* — Дієві / семантичні — */		/* — Дієві / семантичні — */
	--k-accent:#2a6df4; ~~/* лінки, первинні кнопки, фокус */~~		--k-accent:#2a6df4; --k-accent-hover:#1b57cc;
	--k-accent-hover:#1b57cc;		--k-danger:#f84840; --k-success:#00b898; --k-warning:#f8b020;
	--k-danger:#f84840; ~~/* = brand-red; поглинає #e63a32 #d92c1c */~~
	--k-success:#00b898;
	--k-warning:#f8b020;

	/* — Чорнило / текст — */		/* — Чорнило / текст — */
	--k-ink:#1a2240; ~~/* заголовки, hero */~~		--k-ink:#1a2240; --k-text:#202122; --k-text-secondary:#374151; --k-text-muted:#6b7280; --k-text-hint:#9ca3af;
	--k-text:#202122; ~~/* основний текст */~~
	--k-text-secondary:#374151; ~~/* лейбли форм */~~
	--k-text-muted:#6b7280; ~~/* підзаголовки, описи */~~
	--k-text-hint:#9ca3af; ~~/* плейсхолдери, дрібні підказки */~~

	/* — Поверхні / межі — */		/* — Поверхні / межі — */
	--k-bg:#ffffff;		--k-bg:#ffffff; --k-bg-subtle:#fafbfd; --k-border:#eef1f6; --k-border-strong:#e3e7ef;
	--k-bg-subtle:#fafbfd; ~~/* фон інпутів/карток; поглинає #f8fafc #f9fafc #f5f7fb… */~~
	--k-border:#eef1f6; ~~/* поглинає #eef1f7 #eef0f4 #e8eef7 */~~
	--k-border-strong:#e3e7ef;

	~~/* — Радіуси — */~~
	~~--k-radius-sm:8px; /* інпути, кнопки */~~
	~~--k-radius-md:14px; /* картки, діалоги */~~
	~~--k-radius-pill:999px; /* пігулки, теги */~~

			/* — Скруглення — */
			--k-radius-xs:6px; --k-radius-sm:8px; --k-radius-md:14px; --k-radius-lg:20px; --k-radius-pill:999px;
	/* — Тіні — */		/* — Тіні — */
	--k-shadow-1:0 1px 3px rgba(26,34,64,.08); ~~/* картки */~~		--k-shadow-1:0 1px 3px rgba(26,34,64,.08);
	--k-shadow-2:0 8px 30px rgba(26,34,64,.16); ~~/* діалоги/оверлеї */~~		--k-shadow-2:0 8px 30px rgba(26,34,64,.16);
			--k-shadow-3:0 16px 50px rgba(26,34,64,.22);
	/* — ~~Крок відступів~~ — */		/* — Відступи / гепи (крок 4px) — */
	--k-space-1:4px; --k-space-2:8px; --k-space-3:12px; --k-space-4:16px; --k-space-6:24px;		--k-space-0:0; --k-space-1:4px; --k-space-2:8px; --k-space-3:12px; --k-space-4:16px;
			--k-space-5:20px; --k-space-6:24px; --k-space-8:32px; --k-space-10:40px; --k-space-12:48px;
			/* — Типографіка — */
			--k-font-sans:-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
			--k-fs-xs:12px; --k-fs-sm:13px; --k-fs-base:14px; --k-fs-md:16px; --k-fs-lg:20px; --k-fs-xl:24px; --k-fs-2xl:30px;
			--k-fw-normal:400; --k-fw-medium:600; --k-fw-bold:700;
			--k-lh-tight:1.2; --k-lh-base:1.5; --k-lh-relaxed:1.7;
			/* — Шари (z-index) — */
			--k-z-fixed:1000; --k-z-overlay:1001; --k-z-tip:1002;
	}		}

	/* ——— Компоненти ——— */		/* ——— Компоненти (розширюємо під приклад Александра) ——— */
	.k-btn{display:inline-flex;align-items:center;justify-content:center;gap:~~6px~~;		.k-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--k-space-2);
	font:~~600 14px~~/~~1.2 inherit~~;padding:~~8px 16px~~;border-radius:var(--k-radius-pill);		font:var(--k-fw-medium) var(--k-fs-base)/var(--k-lh-tight) var(--k-font-sans);padding:var(--k-space-2) var(--k-space-4);
	border:1px solid transparent;cursor:pointer;transition:background .15s,border-color .15s,box-shadow .15s}		border-radius:var(--k-radius-pill);border:1px solid transparent;cursor:pointer;
			transition:background .15s,border-color .15s,box-shadow .15s}
	.k-btn--primary{background:var(--k-accent);color:#fff}		.k-btn--primary{background:var(--k-accent);color:#fff}
	.k-btn--primary:hover{background:var(--k-accent-hover)}		.k-btn--primary:hover{background:var(--k-accent-hover)}
Рядок 2113:		Рядок 2105:
	.k-input,.k-textarea{width:100%;box-sizing:border-box;background:var(--k-bg-subtle);		.k-input,.k-textarea{width:100%;box-sizing:border-box;background:var(--k-bg-subtle);
	border:1px solid var(--k-border);border-radius:var(--k-radius-sm);padding:9px 11px;		border:1px solid var(--k-border);border-radius:var(--k-radius-sm);padding:9px 11px;
	font:~~14px~~/~~1.4 inherit~~;color:var(--k-text);transition:border-color .15s,background .15s,box-shadow .15s}		font:var(--k-fs-base)/var(--k-lh-base) var(--k-font-sans);color:var(--k-text);
			transition:border-color .15s,background .15s,box-shadow .15s}
	.k-input::placeholder,.k-textarea::placeholder{color:var(--k-text-hint)}		.k-input::placeholder,.k-textarea::placeholder{color:var(--k-text-hint)}
	.k-input:focus,.k-textarea:focus{outline:none;background:var(--k-bg);		.k-input:focus,.k-textarea:focus{outline:none;background:var(--k-bg);
Рядок 2122:		Рядок 2115:
	.k-card:hover{transform:translateY(-2px);box-shadow:var(--k-shadow-2)}		.k-card:hover{transform:translateY(-2px);box-shadow:var(--k-shadow-2)}

	.k-dialog{background:var(--k-bg);border-radius:var(--k-radius-md);box-shadow:var(--k-shadow-2);		.k-dialog{background:var(--k-bg);border-radius:var(--k-radius-md);box-shadow:var(--k-shadow-2);padding:20px 22px}
	padding:20px 22px}

	.k-pill{display:inline-flex;align-items:center;gap:~~6px~~;padding:~~4px 10px~~;		.k-pill{display:inline-flex;align-items:center;gap:var(--k-space-1);padding:var(--k-space-1) var(--k-space-3);
	border-radius:var(--k-radius-pill);font:~~600 12px~~/~~1.2 inherit~~}		border-radius:var(--k-radius-pill);font:var(--k-fw-medium) var(--k-fs-xs)/var(--k-lh-tight) var(--k-font-sans)}
	.k-pill--blue{background:rgba(16,112,176,.12);color:var(--k-brand-blue)}		.k-pill--blue{background:rgba(16,112,176,.12);color:var(--k-brand-blue)}
	.k-pill--red{background:rgba(248,72,64,.12);color:var(--k-danger)}		.k-pill--red{background:rgba(248,72,64,.12);color:var(--k-danger)}
	.k-pill--yellow{background:rgba(248,176,32,.16);color:#9a6a00}		.k-pill--yellow{background:rgba(248,176,32,.16);color:#9a6a00}
	.k-pill--teal{background:rgba(0,184,152,.14);color:#067a64}		.k-pill--teal{background:rgba(0,184,152,.14);color:#067a64}
			/* === /krai-uikit === */

	/* === Країнопедія: віджет «Повідомити про правку» (krai-feedback) — на UI Kit === */		/* === Країнопедія: віджет «Повідомити про правку» (krai-feedback) — на UI Kit === */

Admin: UI Kit шар (токени + .k-компоненти) + віджет feedback мігровано на кіт

2026-08-02T15:03:15Z

UI Kit шар (токени + .k-компоненти) + віджет feedback мігровано на кіт

Показати зміни

Admin: krai-feedback: інпути в стилі сайту

2026-08-02T08:57:36Z

krai-feedback: інпути в стилі сайту

← Попередня версія		Версія за 11:57, 2 серпня 2026
Рядок 2071:		Рядок 2071:
	.krai-fb-title{margin:0 0 4px;font-size:20px;border:none;padding:0}		.krai-fb-title{margin:0 0 4px;font-size:20px;border:none;padding:0}
	.krai-fb-sub{margin:0 0 14px;font-size:13px;color:#54595d}		.krai-fb-sub{margin:0 0 14px;font-size:13px;color:#54595d}
	.krai-fb-form label.krai-fb-label{display:block;font-size:13px;font-weight:600;margin:~~10px~~ 0 0;color:#~~202122~~}		.krai-fb-form label.krai-fb-label{display:block;font-size:13px;font-weight:600;margin:12px 0 0;color:#374151}
	.krai-fb-label span{font-weight:400;color:#~~72777d~~}		.krai-fb-label span{font-weight:400;color:#9ca3af}
	.krai-fb-form textarea,.krai-fb-form input[type=text]{width:100%;box-sizing:border-box;margin-top:~~4px~~;padding:~~8px~~;border:1px solid #~~a2a9b1~~;border-radius:~~6px~~;font-size:14px;font-family:inherit}		.krai-fb-form textarea,.krai-fb-form input[type=text]{width:100%;box-sizing:border-box;margin-top:5px;padding:9px 11px;background:#fafbfd;border:1px solid #eef1f6;border-radius:8px;font-size:14px;font-family:inherit;color:#202122;transition:border-color .15s,background .15s,box-shadow .15s}
	.krai-fb-~~kind~~{~~display~~:~~flex~~;~~gap~~:~~16px~~;~~margin~~-~~bottom~~:~~4px~~;~~font~~-~~size~~:~~14px;font-weight:600~~}		.krai-fb-form textarea:focus,.krai-fb-form input[type=text]:focus{outline:none;background:#fff;border-color:#2a6df4;box-shadow:0 0 0 3px rgba(42,109,244,.12)}
	.krai-fb-~~kind label~~{~~font-weight~~:~~600;cursor:pointer~~}		.krai-fb-form ::placeholder{color:#9ca3af}
	.krai-fb-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0}		.krai-fb-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0}
	.krai-fb-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}		.krai-fb-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}