Участник:Torgovec/citizen.css: различия между версиями

/* Импорт шрифтов */
/* Шрифт нечитаемых палочек */
@import url('https://fonts.googleapis.com/css2?family=Flow+Circular&display=swap');
/* Пиксельный шрифт */
@import url('https://fonts.googleapis.com/css2?family=Tiny5:ital,wght@0,100..900;1,100..900&display=swap');
/* Тонкий шрифт */
@import url('https://fonts.googleapis.com/css2?family=Poiret+One&display=swap');
/* Шрифт Kelly Slab*/
@import url('https://fonts.googleapis.com/css2?family=Kelly+Slab&display=swap');

/* Если на html есть класс отключения, сбрасываем переменные к дефолтным значениям Википедии */
html.disable-custom-styles {
	--font-family-monospace: var(--font-family-citizen-monospace), var(--font-family-language-monospace), 'Menlo', 'Consolas', 'Liberation Mono', 'Fira Code', 'Courier New', monospace;
}

:root:not(.disable-custom-styles) {
	/* Меняем основной оттенок с синего (~215) на зелёный (140) */
	--color-primary__h: 140;
	--color-primary__s: 65%;
	--color-primary__l: 40%;
	
	/* шрифты */
	--font-family-citizen-base: 'Tiny5', 'Roboto-fallback';
    --font-family-citizen-serif: 'Poiret One';
    --font-family-citizen-monospace: 'Roboto Mono';
	
	--font-family-base: var(--font-family-citizen-base), var(--font-family-language-base), system-ui, -apple-system, sans-serif;
    --font-family-serif: var(--font-family-citizen-serif), var(--font-family-language-serif), 'Linux Libertine', 'Georgia', 'Times', 'Source Serif Pro', serif;
    --font-family-monospace: var(--font-family-citizen-monospace), var(--font-family-language-monospace), 'Menlo', 'Consolas', 'Liberation Mono', 'Fira Code', 'Courier New', monospace;

	/*--backdrop-filter-blur: blur(2px);*/
    /*--backdrop-filter-frosted-glass: blur(16px) saturate(140%);*/
    --backdrop-filter-frosted-glass-menu: blur(8px) saturate(110%);

}

/* Отдельная настройка яркости для тёмной темы, чтобы зелёный хорошо читался */
html.skin-citizen-dark:not(.disable-custom-styles),
html.skin-theme-clientpref-night:not(.disable-custom-styles) {
	--color-primary__h: 140;
	--color-primary__s: 60%;
	--color-primary__l: 55%;
	
	--color-progressive: #33FDDDAA;
	
	--color-surface-0: #33883333;
	--color-surface-1: #225522BB;
	--color-surface-2: #406F4FBF;
	--color-surface-3: #22885588;
	--color-surface-4: #36383F88;

}

html:not(.disable-custom-styles) .options,
html:not(.disable-custom-styles) .mwe-popups,
html:not(.disable-custom-styles) .ui-dialog.ui-widget-content{
	backdrop-filter: var(--backdrop-filter-frosted-glass-menu);
}