Открыть меню
Платформа Эра. Документация
Toggle preferences menu
Открыть персональное меню
Вы не представились системе
Your IP address will be publicly visible if you make any edits.

MediaWiki:Citizen.css: различия между версиями

Страница интерфейса MediaWiki
Фирменный стиль: цвета и знак «Эры» в шапке, как на era-platform.ru
Уведомление о cookie: компактная плашка вместо окна
 
(не показаны 2 промежуточные версии этого же участника)
Строка 66: Строка 66:
@media (prefers-color-scheme: dark) {
@media (prefers-color-scheme: dark) {
   :root.skin-theme-clientpref-os img.mw-logo-icon { filter: brightness(0) invert(1); }
   :root.skin-theme-clientpref-os img.mw-logo-icon { filter: brightness(0) invert(1); }
}
/* Шапка главной: знак «Эры» + название текстом */
.era-hero {
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 8px 0 28px;
}
.era-hero img {
  width: 104px;
  height: auto;
  flex: none;
}
.era-hero__title {
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 1.1;
  color: var(--color-emphasized);
}
@media (max-width: 640px) {
  .era-hero { gap: 14px; }
  .era-hero img { width: 72px; }
  .era-hero__title { font-size: 1.75rem; }
}
:root.skin-theme-clientpref-night .era-hero img { filter: brightness(0) invert(1); }
@media (prefers-color-scheme: dark) {
  :root.skin-theme-clientpref-os .era-hero img { filter: brightness(0) invert(1); }
}
/* ===== Уведомление о файлах cookie (логика — в MediaWiki:Common.js) ===== */
/* Окно расширения CookieConsent не показываем: оно принимается автоматически */
.oo-ui-windowManager:has( > .cookie-consent-simple-dialog ) {
  display: none !important;
}
body:has( .cookie-consent-simple-dialog ) {
  overflow: auto !important;
}
/* Ссылка «Настройки cookie» в подвале не нужна */
li:has( > #manage-cookie-preferences ),
#manage-cookie-preferences {
  display: none !important;
}
.era-cookie-bar {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 1000;
  max-width: 760px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 16px 14px 20px;
  background: var( --color-surface-1, #fff );
  color: var( --color-base, #202122 );
  border: 1px solid var( --border-color-base, rgba( 0, 0, 0, 0.12 ) );
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba( 0, 0, 0, 0.16 );
  font-size: 0.875rem;
  line-height: 1.5;
}
.era-cookie-bar p {
  margin: 0;
  flex: 1;
}
.era-cookie-bar button {
  flex: none;
  padding: 8px 20px;
  border: 0;
  border-radius: 8px;
  background: var( --color-progressive, #e6372d );
  color: #fff;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}
.era-cookie-bar button:hover {
  background: var( --color-progressive--hover, #ec5249 );
}
@media ( max-width: 600px ) {
  .era-cookie-bar {
    left: 8px;
    right: 8px;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
}
}

Текущая версия от 22:13, 27 октября 2026

/* Размещённый здесь CSS-код будет загружаться для пользователей, использующих тему оформления Citizen */

/* Без увеличения картинок при наведении */
.mw-parser-output a.mw-file-description img,
.mw-parser-output a.image img {
  transform: none !important;
  transition: none !important;
  cursor: zoom-in;
}

/* Просмотр картинки по клику (см. MediaWiki:Common.js) */
.era-lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(0, 0, 0, .85);
  cursor: zoom-out;
}
.era-lightbox img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  border-radius: 4px;
  box-shadow: 0 8px 40px rgba(0, 0, 0, .5);
}
/* ===== Фирменный стиль (как на era-platform.ru) ===== */
/* Акцент — фирменный красный #E6372D. Ссылки — фирменный тёмно-синий,
   чтобы их не путали с «красными ссылками» MediaWiki на несуществующие страницы. */
:root {
  --color-progressive: #e6372d;
  --color-progressive--hover: #ec5249;
  --color-progressive--active: #c9281f;
  --color-progressive--focus: #e6372d;
  --background-color-progressive-subtle: #fdebea;
  --color-link: #23397b;
}
:root.skin-theme-clientpref-night {
  --color-progressive: #f0574e;
  --color-progressive--hover: #f37068;
  --color-progressive--active: #e6372d;
  --color-progressive--focus: #f0574e;
  --background-color-progressive-subtle: #3a1c1b;
  --color-link: #9db1ea;
}
@media (prefers-color-scheme: dark) {
  :root.skin-theme-clientpref-os {
    --color-progressive: #f0574e;
    --color-progressive--hover: #f37068;
    --color-progressive--active: #e6372d;
    --color-progressive--focus: #f0574e;
    --background-color-progressive-subtle: #3a1c1b;
    --color-link: #9db1ea;
  }
}

/* Логотип в шапке и меню — знак «Эры» */
img.mw-logo-icon {
  object-position: -99999px 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4.25 -13.72 44 44'%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11.6922 15.3927C13.1497 15.3927 18.5171 9.83404 18.5171 9.83404L18.5169 9.83385C20.0887 11.5304 21.7367 13.0637 22.7506 13.9642C22.768 13.9797 22.7853 13.995 22.8025 14.0103C23.7844 14.8828 24.3583 15.3927 25.6974 15.3927H34.1893C35.0765 15.3927 35.501 14.4461 35.501 13.9642L35.4885 4.80326C35.5518 2.81579 33.8725 1.16993 31.7812 1.16993H26.9479C25.8706 1.16994 24.8419 2.16365 24.5567 2.38103C24.2716 2.59841 23.1942 3.53003 23.1942 3.53003C23.1942 3.53003 22.7823 3.09528 22.3387 2.59842C21.8951 2.10156 20.6277 1.16993 18.9483 1.16993H2.82007C1.20407 1.16993 0 2.19471 0 3.93375V12.4426C0 14.6474 1.07733 15.3927 2.82007 15.3927H11.6922ZM10.5832 2.94001C11.9774 2.66052 12.8963 3.93375 12.8963 3.93375L17.4591 8.68962L13.2131 12.4426C13.2131 12.4426 11.7872 13.762 10.5832 13.4053C9.37909 13.0485 8.98643 12.2563 8.95474 11.5731C8.92305 10.8899 8.77705 6.16964 8.77705 5.39329C8.77705 4.61694 9.18898 3.2195 10.5832 2.94001ZM31.7812 2.72263C32.9536 2.72263 33.8408 3.77847 33.8408 5.1138V12.3184C33.8408 12.5047 33.9042 13.5295 33.0169 13.4674C31.8762 13.4363 28.9611 10.2688 28.9611 10.2688L24.1131 4.67904C24.1131 4.67904 24.9053 3.90268 25.444 3.53003C25.9826 3.15739 26.3142 2.72263 26.9479 2.72263C27.5816 2.72263 28.908 2.70694 29.6899 2.72263C30.3116 2.7351 30.6088 2.72263 31.7812 2.72263Z' fill='%230E212C'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M18.9329 1.16992H2.80469L8.76168 5.39328C8.76168 4.61693 9.1736 3.21949 10.5678 2.94C11.962 2.66052 12.8809 3.93374 12.8809 3.93374L17.4437 8.68962C17.4437 8.68962 17.8743 9.15674 18.5016 9.83385C20.0733 11.5304 21.7213 13.0637 22.7353 13.9642L22.7871 14.0103C23.769 14.8828 24.3429 15.3927 25.6821 15.3927H34.174C35.0612 15.3927 35.4857 14.4461 35.4857 13.9642L33.8254 12.3184C33.8254 12.3281 33.8256 12.34 33.8258 12.354C33.8294 12.6085 33.8426 13.5262 33.0016 13.4674C31.8609 13.4363 28.9457 10.2688 28.9457 10.2688L24.0978 4.67903L23.1789 3.53003C23.1789 3.53003 22.7669 3.09527 22.3233 2.59841C21.8797 2.10156 20.6123 1.16992 18.9329 1.16992ZM35.4731 4.80326C35.4215 6.42279 35.4623 11.1659 35.4792 13.1274C35.4829 13.5491 35.4854 13.8422 35.4856 13.9481L35.4731 4.80326Z' fill='%230E212C'/%3E %3C/svg%3E ") center / contain no-repeat;
}
:root.skin-theme-clientpref-night img.mw-logo-icon { filter: brightness(0) invert(1); }
@media (prefers-color-scheme: dark) {
  :root.skin-theme-clientpref-os img.mw-logo-icon { filter: brightness(0) invert(1); }
}

/* Шапка главной: знак «Эры» + название текстом */
.era-hero {
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 8px 0 28px;
}
.era-hero img {
  width: 104px;
  height: auto;
  flex: none;
}
.era-hero__title {
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 1.1;
  color: var(--color-emphasized);
}
@media (max-width: 640px) {
  .era-hero { gap: 14px; }
  .era-hero img { width: 72px; }
  .era-hero__title { font-size: 1.75rem; }
}
:root.skin-theme-clientpref-night .era-hero img { filter: brightness(0) invert(1); }
@media (prefers-color-scheme: dark) {
  :root.skin-theme-clientpref-os .era-hero img { filter: brightness(0) invert(1); }
}

/* ===== Уведомление о файлах cookie (логика — в MediaWiki:Common.js) ===== */
/* Окно расширения CookieConsent не показываем: оно принимается автоматически */
.oo-ui-windowManager:has( > .cookie-consent-simple-dialog ) {
  display: none !important;
}
body:has( .cookie-consent-simple-dialog ) {
  overflow: auto !important;
}
/* Ссылка «Настройки cookie» в подвале не нужна */
li:has( > #manage-cookie-preferences ),
#manage-cookie-preferences {
  display: none !important;
}
.era-cookie-bar {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 1000;
  max-width: 760px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 16px 14px 20px;
  background: var( --color-surface-1, #fff );
  color: var( --color-base, #202122 );
  border: 1px solid var( --border-color-base, rgba( 0, 0, 0, 0.12 ) );
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba( 0, 0, 0, 0.16 );
  font-size: 0.875rem;
  line-height: 1.5;
}
.era-cookie-bar p {
  margin: 0;
  flex: 1;
}
.era-cookie-bar button {
  flex: none;
  padding: 8px 20px;
  border: 0;
  border-radius: 8px;
  background: var( --color-progressive, #e6372d );
  color: #fff;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}
.era-cookie-bar button:hover {
  background: var( --color-progressive--hover, #ec5249 );
}
@media ( max-width: 600px ) {
  .era-cookie-bar {
    left: 8px;
    right: 8px;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
}