Открыть меню
Переключить меню настроек
Открыть персональное меню
Вы не представились системе
Ваш IP-адрес будет виден всем, если вы внесёте какие-либо изменения.

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

Страница интерфейса MediaWiki
Нет описания правки
Метка: отменено
Нет описания правки
 
(не показано 12 промежуточных версий этого же участника)
Строка 1: Строка 1:
/* Размещённый здесь CSS будет применяться ко всем темам оформления */
/* Размещённый здесь CSS будет применяться ко всем темам оформления */
/* Бар */
/* Поиск */
.home-card__label {
.home-header__search {
color: var( --color-subtle );
--gradient: #87bfdb, #77abC8, #6797b5, #577f9d, #476684, #43668a, #3e668f, #304a66, #212e3d, #304a66, #3e668f, #43668a, #476684, #577f9d, #6797b5, #77abC8, #87bfdb;
--gradient-blur: 4px;
padding: var( --space-md );
margin-top: var( --space-xl );
margin-left: auto;
margin-right: auto;
max-width: 600px;
border: var( --border-base );
border-radius: var( --border-radius-pill );
background-color: var( --color-surface-1 );
cursor: pointer;
font-size: var( --font-size-small );
font-size: var( --font-size-small );
letter-spacing: 0.05em;
font-weight: var( --font-weight-medium );
text-align: center;
}
}


.home-card__badge {
.home-header__search .desktoponly {
padding: var( --space-xxs ) var( --space-xs );
margin-left: var( --space-xs );
border-radius: var( --border-radius-base );
background: var( --color-surface-2 );
}
}


.home-card__header {
.home-header__search:hover {
color: var( --color-emphasized );
--gradient:  #120d0e, #321d13, #512d19, #713d1e, #90571d, #b0701b, #cf8a1a, #de9822, #eeA529, #fdb331, #eeA529, #de9822, #cf8a1a, #b0701b, #90571d, #713d1e, #512d19, #321d13, #120d0e;
font-size: 1rem;
--gradient-blur: 8px;
    font-weight: var( --font-weight-semi-bold );
background: var( --color-surface-0 );
    line-height: var( --line-height-xxx-small );
}
}


.home-card__header a {
.home-header__searchIcon img {
display: flex;
margin-right: var( --space-md );
    opacity: var( --opacity-icon-base );
}
 
/* Fix vertical alignment problem */
.home-header__search .keyboard-key {
display: inline;
padding-top: 0.1em;
padding-bottom: 0.1em;
}
 
.home-header:before,
.home-header__searchIcon img {
filter: var( --filter-invert );
}
 
@media ( hover: none ) {
.home-header__search .desktoponly {
display: none;
}
}
 
/* Бар */
.home-card__header {
color: var( --color-emphasized );
font-size: 1rem;
    font-weight: var( --font-weight-semi-bold );
    line-height: var( --line-height-xxx-small );
}
 
.home-card__header a {
display: flex;
align-items: center;
align-items: center;
justify-content: space-between;
justify-content: space-between;
Строка 30: Строка 69:
font-size: var( --font-size-small );
font-size: var( --font-size-small );
}
}
.home-card__foreground {
 
.home-card__background {
position: absolute;
inset: 0;
}
 
.home-card__background:after {
position: absolute;
    pointer-events: none;
inset: 0;
    display: block;
    background: linear-gradient(to right,#000,transparent);
    content: "";
    transition: transform 250ms ease;
}
 
.home-card__background picture,
.home-card__background img {
width: 100%;
height: 100%;
}
 
.home-card__background img {
object-fit: cover;
object-position: center;
}
 
.home-card__foreground {
position: absolute;
position: absolute;
top: 0;
top: 0;
Строка 66: Строка 132:
font-size: var( --font-size-small );
font-size: var( --font-size-small );
}
}
.home-card__background {
 
position: absolute;
.home-card2.home-card--button {
inset: 0;
overflow: hidden;
padding: 0;
border: 0;
}
}


.home-card__background:after {
.home-card--button a {
position: absolute;
display: flex;
    pointer-events: none;
height: 100%;
inset: 0;
justify-content: center;
    display: block;
align-items: center;
    background: linear-gradient(to right,#000,transparent);
padding: 0 var( --space-md );
    content: "";
background: transparent;
    transition: transform 250ms ease;
color: #fff;
font-weight: var( --font-weight-medium );
}
}


.home-card__background picture,
.home-card--button .home-card__background a {
.home-card__background img {
padding: 0;
width: 100%;
height: 100%;
}
}


.home-card__background img {
.home-card--button img {
object-fit: cover;
transition: transform 250ms ease;
object-position: center;
}
}
.template-badge {
 
padding: var( --space-xxs ) var( --space-xs );
.home-card--button:hover img {
border-radius: var( --border-radius-base );
transform: scale( 1.1 );
background-color: var( --color-surface-2 );
color: var( --color-emphasized );
font-size: var( --font-size-small );
font-weight: var( --font-weight-medium );
line-height: 1;
letter-spacing: 0.025em;
}
}
.home-event {
.home-card2 {
position: relative;
padding: var( --space-md );
border: 1px solid var( --border-color-base );
border: 1px solid var( --border-color-base );
background: var( --color-surface-1 );
border-radius: var( --border-radius-medium );
border-radius: var( --border-radius-medium );
background: var( --color-surface-1 );
font-size: var( --font-size-small );
}
 
.home-event {
border: 1px solid var( --border-color-base );
border-radius: var( --border-radius-medium );
background: var( --color-surface-1 );
}
}


Строка 140: Строка 209:
}
}


.home-event .home-card {
.home-event .home-card2 {
height: 5rem;
height: 5rem;
border-top-left-radius: 0;
border-top-left-radius: 0;
Строка 2584: Строка 2653:
     border-radius: var(--border-radius-medium);
     border-radius: var(--border-radius-medium);
     font-size: var(--font-size-small);
     font-size: var(--font-size-small);
}
.mw-parser-output .home-card__badge, .mw-parser-output .home-card__label {
    color: var(--color-subtle);
    font-size: var(--font-size-small);
    letter-spacing: 0.05em;
}
}
.mw-parser-output .home-link {
.mw-parser-output .home-link {
Строка 2616: Строка 2680:
.mw-parser-output .home-link__button a:active {
.mw-parser-output .home-link__button a:active {
     background: var(--color-surface-2--active)
     background: var(--color-surface-2--active)
}
/* Таймлайн таблица */
table.timeline {
box-shadow: none;
font-size: var( --font-size-small );
}
table.timeline, table.timeline tbody {
    display: block;
}
table.timeline tr {
position: relative;
margin-left: 8px;
padding: var( --space-xs ) var( --space-xs ) var( --space-xs ) 20px;
    display: flex;
    flex-direction: column;
    border-top-right-radius: var( --border-radius-small );
    border-bottom-right-radius: var( --border-radius-small );
}
table.timeline tr:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: -1px;
    display: block;
    width: 2px;
    background-color: var( --border-color-base );
}
table.timeline tr td:first-child {
    font-size: var( --font-size-medium );
    font-weight: var( --font-weight-semi-bold );
    color: var( --color-emphasized );
}
table.timeline tr td:first-child:before {
content: "";
    width: 8px;
    height: 8px;
    display: block;
    background-color: var( --color-subtle );
    border-radius: 100%;
    position: absolute;
    left: -4px;
    margin-top: 8px;
}
table.timeline tr td {
padding: 0;
border: 0 !important;
}
.iconbadger {
padding: var( --space-xxs ) var( --space-xs );
border-radius: var( --border-radius-base );
background-color: var( --color-surface-2 );
color: var( --color-emphasized );
font-size: var( --font-size-small );
font-weight: var( --font-weight-medium );
line-height: 1;
letter-spacing: 0.025em;
}
}