MediaWiki:Common.css: различия между версиями
Страница интерфейса MediaWiki
DeRecnad (обсуждение | вклад) мНет описания правки Метка: ручная отмена |
DeRecnad (обсуждение | вклад) мНет описания правки |
||
(не показано 10 промежуточных версий этого же участника) | |||
Строка 11: | Строка 11: | ||
} | } | ||
body.page-Заглавная_страница h1.firstHeading | body.page-Заглавная_страница h1.firstHeading | ||
body.page-Заглавная_страница #siteSub, | body.page-Заглавная_страница #siteSub, | ||
body.page-Заглавная_страница #contentSub | body.page-Заглавная_страница #contentSub | ||
{display:none !important} | {display:none !important} | ||
#firstHeading { | |||
display: none; | |||
} | |||
.home-header { | .home-header { | ||
Строка 100: | Строка 103: | ||
display: none; | display: none; | ||
} | } | ||
} | |||
.home-grid { | |||
display: grid; | |||
grid: auto-flow dense/repeat( auto-fit, minmax( 9.375rem, 1fr ) ); | |||
grid-auto-rows: minmax( 3rem, auto ); | |||
grid-gap: calc(0.5 * 1rem); | |||
} | |||
.home-grid--col2 { | |||
grid-template-columns: 1fr 1fr; | |||
} | |||
.home-grid a.external { | |||
background-image: none; | |||
} | |||
/* Размещённый здесь CSS будет применяться ко всем темам оформления */ | |||
html { | |||
--header-size: 3.5rem; | |||
--header-card-maxheight: 70vh; | |||
--width-layout: 1080px; | |||
--width-layout--extended: calc(var(--width-layout) * 1.5); | |||
--width-toc: 240px; | |||
--line-height: 1.6; | |||
--line-height-xs: 1.25; | |||
--line-height-sm: 1.375; | |||
--space-unit: 1rem; | |||
--space-xxs: calc(0.25 * var(--space-unit)); | |||
--space-xs: calc(0.5 * var(--space-unit)); | |||
--space-sm: calc(0.75 * var(--space-unit)); | |||
--space-md: var(--space-unit); | |||
--space-lg: calc(1.25 * var(--space-unit)); | |||
--space-xl: calc(1.5 * var(--space-unit)); | |||
--space-xxl: calc(2 * var(--space-unit)); | |||
--margin-layout: calc((100vw - var(--width-layout)) / 2); | |||
--padding-page: 16px; | |||
} | |||
@media screen { | |||
:root.skin-citizen-dark { | |||
--color-primary__l: 60%; | |||
--color-surface-0: hsl(205,20%,10%); | |||
--color-surface-1: hsl(205,25%,12%); | |||
--color-surface-2: hsl(205,25%,15%); | |||
--color-surface-3: hsl(205,15%,20%); | |||
--color-surface-4: hsl(205,15%,25%); | |||
--color-base--emphasized: hsl(205,80%,95%); | |||
--color-base: hsl(205,25%,80%); | |||
--color-base--subtle: hsl(205,25%,65%); | |||
--background-color-primary--hover: hsl(205,60%,15%); | |||
--background-color-primary--active: hsl(205,60%,20%); | |||
--background-color-overlay: hsla(205,20%,10%,0.95); | |||
--background-color-overlay--lighter: hsla(205,20%,10%,0.6); | |||
--color-surface-2--hover: hsl(205,30%,19%); | |||
--color-surface-2--active: hsl(205,30%,11%); | |||
--surface-shadow: 205,50%,3%; | |||
--shadow-strength: 0.8; | |||
--filter-invert: invert(1) hue-rotate(180deg); | |||
--font-grade: -25; | |||
} | |||
} | |||
@media screen and (min-width: 851px) { | |||
.mobile { | |||
display:none !important; | |||
} | |||
.desktoponly { | |||
} | |||
} | |||
@media screen and (max-width: 850px) { | |||
.nomobile { | |||
display:none !important; | |||
} | |||
.mobileonly{ | |||
} | |||
.mobilefont { | |||
font-size: 80% | |||
} | |||
} | |||
/*@media screen and (min-width: 640px) {*/ | |||
/* .mobile {*/ | |||
/* display: none !important;*/ | |||
/* }*/ | |||
/*}*/ | |||
/*@media screen and (max-width: 640px) {*/ | |||
/* .nomobile {*/ | |||
/* display: none !important;*/ | |||
/* }*/ | |||
/*}*/ | |||
.home-link__button a { | |||
color: #fff !important; | |||
} | |||
.wikitable-2 { | |||
margin: var(--space-md) 0; | |||
border: 0.5px solid var(--border-color-base); | |||
border-radius: var(--border-radius--medium); | |||
border-spacing: 0; | |||
font-size: var(--font-size-small); | |||
} | |||
img { | |||
image-rendering: pixelated; | |||
} | } |
Текущая версия от 09:26, 5 сентября 2024
/* Размещённый здесь CSS будет применяться ко всем темам оформления */
@import url('node_modules/@wikimedia/codex/mixins/css-icon.less');
/* Пример стилей для иконок */
.cdx-icon {
display: inline-block;
width: 1em;
height: 1em;
fill: currentColor;
vertical-align: middle;
}
body.page-Заглавная_страница h1.firstHeading
body.page-Заглавная_страница #siteSub,
body.page-Заглавная_страница #contentSub
{display:none !important}
#firstHeading {
display: none;
}
.home-header {
position: relative;
margin-top: -1rem;
margin-bottom: 2rem;
padding-top: 1rem;
line-height: 1.375;
}
.home-header:before {
content: "";
position: absolute;
top: 1rem;
bottom: 4.75rem;
left: 0;
right: 0;
opacity: 0.1;
/*background-image: url(https://starcitizen.tools/resources/assets/sitelogo.svg); */
background-repeat: no-repeat;
background-position: right;
}
.home-header__pretitle {
margin-bottom: calc(0.5 * 1rem);
color: hsl(220,25%,65%);
font-size: 0.875rem;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.home-header__title {
margin: 0;
font-size: 3rem;
text-transform: uppercase;
letter-spacing: 0.025em;
line-height: 1;
}
.home-header__subtitle {
margin-top: calc(0.5 * 1rem);
font-size: 0.875rem;
}
.home-header__search {
padding: 1rem;
margin-top: calc(1.25 * 1rem);
margin-bottom: 1rem;
margin-left: auto;
margin-right: auto;
border: 1px solid;
border-color: rgba(255,255,255,0.08);
border-radius: 9999px;
cursor: pointer;
font-size: 0.875rem;
font-weight: 500;
text-align: center;
}
.home-header__search:hover {
background-color: rgba(255,255,255,0.07000000000000001);
}
.home-header__searchIcon img {
margin-right: 1rem;
opacity: 0.4;
}
/* Fix vertical alignment problem */
.home-header__search .keyboard-key {
display: inline;
padding-top: 0.1em;
padding-bottom: 0.1em;
}
html.skin-citizen-dark .home-header:before,
html.skin-citizen-dark .home-header__searchIcon img {
filter: invert( 1 );
}
@media ( hover: none ) {
.desktoponly {
display: none;
}
}
.home-grid {
display: grid;
grid: auto-flow dense/repeat( auto-fit, minmax( 9.375rem, 1fr ) );
grid-auto-rows: minmax( 3rem, auto );
grid-gap: calc(0.5 * 1rem);
}
.home-grid--col2 {
grid-template-columns: 1fr 1fr;
}
.home-grid a.external {
background-image: none;
}
/* Размещённый здесь CSS будет применяться ко всем темам оформления */
html {
--header-size: 3.5rem;
--header-card-maxheight: 70vh;
--width-layout: 1080px;
--width-layout--extended: calc(var(--width-layout) * 1.5);
--width-toc: 240px;
--line-height: 1.6;
--line-height-xs: 1.25;
--line-height-sm: 1.375;
--space-unit: 1rem;
--space-xxs: calc(0.25 * var(--space-unit));
--space-xs: calc(0.5 * var(--space-unit));
--space-sm: calc(0.75 * var(--space-unit));
--space-md: var(--space-unit);
--space-lg: calc(1.25 * var(--space-unit));
--space-xl: calc(1.5 * var(--space-unit));
--space-xxl: calc(2 * var(--space-unit));
--margin-layout: calc((100vw - var(--width-layout)) / 2);
--padding-page: 16px;
}
@media screen {
:root.skin-citizen-dark {
--color-primary__l: 60%;
--color-surface-0: hsl(205,20%,10%);
--color-surface-1: hsl(205,25%,12%);
--color-surface-2: hsl(205,25%,15%);
--color-surface-3: hsl(205,15%,20%);
--color-surface-4: hsl(205,15%,25%);
--color-base--emphasized: hsl(205,80%,95%);
--color-base: hsl(205,25%,80%);
--color-base--subtle: hsl(205,25%,65%);
--background-color-primary--hover: hsl(205,60%,15%);
--background-color-primary--active: hsl(205,60%,20%);
--background-color-overlay: hsla(205,20%,10%,0.95);
--background-color-overlay--lighter: hsla(205,20%,10%,0.6);
--color-surface-2--hover: hsl(205,30%,19%);
--color-surface-2--active: hsl(205,30%,11%);
--surface-shadow: 205,50%,3%;
--shadow-strength: 0.8;
--filter-invert: invert(1) hue-rotate(180deg);
--font-grade: -25;
}
}
@media screen and (min-width: 851px) {
.mobile {
display:none !important;
}
.desktoponly {
}
}
@media screen and (max-width: 850px) {
.nomobile {
display:none !important;
}
.mobileonly{
}
.mobilefont {
font-size: 80%
}
}
/*@media screen and (min-width: 640px) {*/
/* .mobile {*/
/* display: none !important;*/
/* }*/
/*}*/
/*@media screen and (max-width: 640px) {*/
/* .nomobile {*/
/* display: none !important;*/
/* }*/
/*}*/
.home-link__button a {
color: #fff !important;
}
.wikitable-2 {
margin: var(--space-md) 0;
border: 0.5px solid var(--border-color-base);
border-radius: var(--border-radius--medium);
border-spacing: 0;
font-size: var(--font-size-small);
}
img {
image-rendering: pixelated;
}