Открыть поиск
Открыть меню
1.1K
4.6K
12
16.9K
Eso-Wiki.ru
Переключить меню настроек
Открыть персональное меню
Вы не представились системе
Ваш IP-адрес будет виден всем, если вы внесёте какие-либо изменения.

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

Страница интерфейса MediaWiki
Дополнительные действия
← Предыдущая правкаСледующая правка →
Нет описания правки
Нет описания правки
(не показано 86 промежуточных версий этого же участника)
Строка 1: Строка 1:
/* Размещённый здесь CSS будет применяться ко всем темам оформления */
/* Размещённый здесь CSS будет применяться ко всем темам оформления */
/* Основной цвет фона */
.crownstore-announ img {
    max-width:100%;
    height:auto;
}
.citizen-overflow-content > .motif {
  height: 600px;
  overflow: auto;
}
body {
background-color: var(--background-color-base, #fff);
}
.nav__link.active {
.nav__link.active {
   opacity: 0.3;
   opacity: 0.3;
}
}
.textbox {
.textbox {
  background-color: var(--background-color-neutral-subtle, #f8f9fa);
    overflow: auto;
  color: var(--color-emphasized, #101418);
    border-radius: var(--border-radius-large);
  border: 1px solid var(--border-color-muted, #dadde3);
    font-family: var(--font-family-monospace);
    font-size: var(--font-size-small);
    color: var(--color-emphasized);
    background-color: var(--color-surface-2);
    border: var(--border-width-base) solid var(--border-color-base);
}
}
.admin-only {
.admin-only {
Строка 46: Строка 63:
         border: 1px solid #ddd;
         border: 1px solid #ddd;
}
}
/* Стили для таблиц */
.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), .jquery-tablesorter th.headerSort {
.wikitable {
    background-image: url(/resources/src/jquery.tablesorter.styles/images/sort_both.svg?0e440);
background-color: rgba(var(--color-base-rgb), 0.03);
    cursor: pointer;
}
    background-repeat: no-repeat;
.wikitable > tr > th,.wikitable > tr > td,.wikitable > * > tr > th,.wikitable > * > tr > td {
    background-position: center right;
border: 1px solid rgba(var(--color-base-rgb),0.1);
    padding-right: 21px;
padding: 0.5em 1em;
}
}
.RadiantApexRewards {
.RadiantApexRewards {
background-color:#FF6F50;
    padding: 10px !important;
    margin-top: 2rem !important;
    color: #FF6F50 !important;
    border-bottom: 1px solid #FF6F50 !important;
    min-width: 150px;
}
}
.ApexRewards {
.ApexRewards {
background-color:#E58B27;
    padding: 10px !important;
    margin-top: 2rem !important;
    color: #E58B27 !important;
    border-bottom: 1px solid #E58B27 !important;
    min-width: 150px;
}
.LegendaryRewards {
    padding: 10px !important;
    margin-top: 2rem !important;
    color: #CCAA1A !important;
    border-bottom: 1px solid #CCAA1A !important;
    min-width: 150px;
}
.EpicRewards {
    padding: 10px !important;
    margin-top: 2rem !important;
    color: #A02EF7 !important;
    border-bottom: 1px solid #A02EF7 !important;
    min-width: 150px;
}
}
.SuperiorRewards {
.SuperiorRewards {
background-color:#3A92FF;
    padding: 10px !important;
    margin-top: 2rem !important;
    color: #3A92FF !important;
    border-bottom: 1px solid #3A92FF !important;
    min-width: 150px;
}
}
.LegendaryRewards {
.FineRewards {
background-color:#CCAA1A;
    padding: 10px !important;
    margin-top: 2rem !important;
    color: #2DC50E !important;
    border-bottom: 1px solid #2DC50E !important;
    min-width: 150px;
}
}
.FineRewards {
.CommonRewards {
background-color:#2DC50E;
    padding: 10px !important;
    margin-top: 2rem !important;
    color: #888888 !important;
    border-bottom: 1px solid #888888 !important;
    min-width: 150px;
}
}
.Drops {
.Drops {
background-color:#a0d7a5;
    padding: 10px !important;
    margin-top: 2rem !important;
    color: var(--color-progressive) !important;
    border-bottom: 1px solid var(--color-progressive) !important;
    min-width: 150px;
}
.Datamine {
    padding: 10px !important;
    margin-top: 2rem !important;
    color: var(--background-color-error) !important;
    border-bottom: 1px solid var(--background-color-error) !important;
    min-width: 150px;
}
}
.PS {
.PS {
background-color:#0ba889;
    padding: 10px !important;
}
    margin-top: 2rem !important;
.Drops {
    color: var(--color-progressive) !important;
background-color:#1a8dec;
    border-bottom: 1px solid var(--color-progressive) !important;
    min-width: 150px;
}
}
.Applied {
.Applied {
background-color:#0feedd;
    padding: 10px !important;
    margin-top: 2rem !important;
    color: var(--color-progressive) !important;
    border-bottom: 1px solid var(--color-progressive) !important;
    min-width: 150px;
}
}
.Craft {
.Craft {
background-color:#dadf17;
    padding: 10px !important;
    margin-top: 2rem !important;
    color: var(--color-progressive) !important;
    border-bottom: 1px solid var(--color-progressive) !important;
    min-width: 150px;
}
}
#skin-client-pref-skin-theme-value-os { display:none!important; }
#skin-client-pref-skin-theme-value-os { display:none!important; }
#ca-talk { display:none!important; }
#ca-talk { display:none!important; }
body {
    background-color: #ffffff
}


.mw-body h1,.mw-body-content h1,.mw-body-content h2 {
.mw-body h1,.mw-body-content h1,.mw-body-content h2 {
Строка 160: Строка 229:
.smw-highlighter {
.smw-highlighter {
     cursor: help;
     cursor: help;
    border-bottom: 1px dotted black
}
}


Строка 301: Строка 369:


table.jquery-tablesorter th.headerSort {
table.jquery-tablesorter th.headerSort {
     background-color: #b0c4de;
     background-image: url(/resources/src/jquery.tablesorter.styles/images/sort_both.svg?0e440);
     position: sticky;
     position: sticky;
    top: 10px;
     z-index: 1
     z-index: 1
}
}
Строка 399: Строка 466:
}
}


.menu_cont-cards {
    display:flex;
    flex-wrap: wrap;
    justify-content: center;
}
.menu_cont {
.menu_cont {
     display:flex;
     display:flex;
Строка 685: Строка 757:
.last-update {
.last-update {
     width: 300px;
     width: 300px;
     float: left
     background: rgba(var(--color-base-rgb),0.02);
    border: 1px solid rgba(var(--color-base-rgb),0.1);
    margin-bottom: 2rem
}
}


.last-update-header {
.last-update-header {
     background-color: #b0c4de;
     background-color: var(--color-surface-2);
     padding: 10px;
    border: 1px solid var(--border-color-base);
     font-weight: 600
    border-radius: 10px 10px 0px 0px;
     padding: 1rem;
     font-weight: 600;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}
}


.last-update-body {
.last-update-body {
     border: 1px solid #e7e8ec;
     border: 1px solid var(--border-color-base);
    border-radius: 0px 0px 10px 10px;
     border-top: 0px;
     border-top: 0px;
     padding: 5px 10px;
    height: 220px;
     height: 220px
     padding: 0 1rem 1rem 1rem;
    box-sizing: border-box;
     overflow: hidden
}
}


Строка 1168: Строка 1250:
.showcase2 {
.showcase2 {
     position: absolute;
     position: absolute;
     top: 120px;
     top: 110px;
     color: gold;
     color: gold;
    font-family: var(--font-family-monospace);
    font-size: var(--font-size-small);
    border-radius: 0px 20px 20px 0px;
    padding: 0.2em;
     left: 0px;
     left: 0px;
     background-color: rgb(16 18 19 / 80%);
     background-color: rgb(16 18 19 / 80%);
Строка 1175: Строка 1261:
.showcase3 {
.showcase3 {
     position: absolute;
     position: absolute;
     top: 120px;
     top: 110px;
     color: red;
     color: red;
    padding: 0.2em;
    border-radius: 0px 20px 20px 0px;
    font-family: var(--font-family-monospace);
    font-size: var(--font-size-small);
    left: 0px;
    background-color: rgb(16 18 19 / 80%);
}
.showcase4 {
    position: absolute;
    top: 100px;
    padding: 0.2em;
    border-radius: 0px 20px 20px 0px;
    font-family: var(--font-family-monospace);
    font-size: var(--font-size-small);
     left: 0px;
     left: 0px;
     background-color: rgb(16 18 19 / 80%);
     background-color: rgb(16 18 19 / 80%);
Строка 1182: Строка 1282:


.card1 {
.card1 {
  position: relative;
    position: relative;
  top: 0;
    top: 0;
  left: 0;
    left: 0;
    z-index: 1;
}
}


.card2 {
.card2 {
  position: absolute;
    position: absolute;
  top: 0;
    top: 0;
  left: 0;
    left: 0;
    z-index: 2;
}
}
 
.card3 {
    position: absolute;
    top: 165px;
    left: 0px;
    right:0px;
    color: #ffffff;
    text-align:center;
    z-index: 3;
    text-shadow: 2px 2px 1px #000;
}
    .card4 {
    position: absolute;
    top: 185px;
    left: 0px;
    right:0px;
    color: #ffffff;
    text-align:center;
    z-index: 4;
    text-shadow: 2px 2px 1px #000;
}
 
crateico {
crateico {
   position: absolute;
   position: absolute;
Строка 1872: Строка 1994:
/* Темная тема */
/* Темная тема */
@media screen {
@media screen {
html.skin-theme-clientpref-night .last-update-header {
html.skin-theme-clientpref-night client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), .jquery-tablesorter th.headerSort {
background-color: #171619;
background-image: url(/w/resources/src/jquery.tablesorter.styles/images/sort_both_inverted.svg?d764d);
        background-image: url(/resources/css/grunge.png);
        border: 1px solid #162f4d;
padding: 10px;
font-weight: 600;
}
html.skin-theme-clientpref-night .last-update-body {
border: 1px solid #162f4d;
border-top: 0px;
padding: 5px 10px;
height: 220px;
}
}
html.skin-theme-clientpref-night table.overview {
html.skin-theme-clientpref-night table.overview {
Строка 1933: Строка 2045:
padding-left: 55px;
padding-left: 55px;
min-height: 40px;
min-height: 40px;
}
html.skin-theme-clientpref-night body {
background-color: #1C1D21;
}
    html.skin-theme-clientpref-night {
        color-scheme: light dark;
        --color-base: #eaecf0;
        --color-base--hover: #f8f9fa;
        --color-emphasized: #f8f9fa;
        --color-subtle: #a2a9b1;
        --color-inverted: #101418;
        --color-progressive: #88a3e8;
        --color-progressive--hover: #b0c1f0;
        --color-progressive--active: #cbd6f6;
        --color-destructive: #fd7865;
        --color-destructive--hover: #fea898;
        --color-destructive--active: #ffc8bd;
        --color-visited: #a799cd;
        --color-destructive--visited: #c99391;
        --color-error: #fd7865;
        --color-warning: #fecc44;
        --color-success: #2cb491;
        --color-notice: #f8f9fa;
        --color-content-added: #80cdb3;
        --color-content-removed: #fd7865;
        --color-base--subtle: #a2a9b1;
        --box-shadow-color-base: #fff;
        --box-shadow-color-progressive--focus: #6b8edf;
        --box-shadow-color-destructive--focus: #6b8edf;
        --box-shadow-color-inverted: #000;
        --background-color-base: #1C1D21;
        --background-color-neutral: #27292d;
        --background-color-neutral-subtle: #202122;
        --background-color-interactive: #27292d;
        --background-color-interactive-subtle: #202122;
        --background-color-disabled: #54595d;
        --background-color-disabled-subtle: #404244;
        --background-color-inverted: #f8f9fa;
        --background-color-progressive--focus: #6b8edf;
        --background-color-progressive-subtle: #233566;
        --background-color-destructive--focus: #6b8edf;
        --background-color-destructive-subtle: #612419;
        --background-color-error: #fc493b;
        --background-color-error--hover: #fd7865;
        --background-color-error--active: #fea898;
        --background-color-error-subtle: #612419;
        --background-color-warning-subtle: #453217;
        --background-color-success-subtle: #153d31;
        --background-color-notice-subtle: #27292d;
        --background-color-content-added: #233566;
        --background-color-content-removed: #453217;
        --background-color-backdrop-light: rgba(0, 0, 0, 0.65);
        --background-color-backdrop-dark: rgba(255, 255, 255, 0.65);
        --border-color-base: #72777d;
        --border-color-subtle: #54595d;
        --border-color-muted: #404244;
        --border-color-interactive: #a2a9b1;
        --border-color-disabled: #54595d;
        --border-color-inverted: #101418;
        --border-color-progressive--focus: #6b8edf;
        --border-color-destructive--focus: #6b8edf;
        --border-color-error: #fc493b;
        --border-color-error--hover: #fd7865;
        --border-color-warning: #fecc44;
        --border-color-success: #2cb491;
        --border-color-notice: #c8ccd1;
        --border-color-content-added: #233566;
        --border-color-content-removed: #987027;
    }
html.skin-theme-clientpref-night .RadiantApexRewards {
background-color:#ab4d39;
}
html.skin-theme-clientpref-night .ApexRewards {
background-color:#9d5f1a;
}
html.skin-theme-clientpref-night .SuperiorRewards {
background-color:#245693;
}
html.skin-theme-clientpref-night .LegendaryRewards {
background-color:#998017;
}
html.skin-theme-clientpref-night .FineRewards {
background-color:#228e0c;
}
}
html.skin-theme-clientpref-night .Drops {
html.skin-theme-clientpref-night .Drops {
background-color:#5f8863;
    padding: 10px !important;
    margin-top: 2rem !important;
    color: var(--color-progressive) !important;
    border-bottom: 1px solid var(--color-progressive) !important;
    min-width: 150px;
}
}
html.skin-theme-clientpref-night .Applied {
html.skin-theme-clientpref-night .Applied {
Строка 2056: Строка 2089:
/* Автоматический режим */  
/* Автоматический режим */  
@media screen and (prefers-color-scheme: dark) {
@media screen and (prefers-color-scheme: dark) {
html.skin-theme-clientpref-os .last-update-header {
background-color: #171619;
        background-image: url(/resources/css/grunge.png);
        border: 1px solid #162f4d;
padding: 10px;
font-weight: 600;
}
html.skin-theme-clientpref-os .last-update-body {
border: 1px solid #162f4d;
border-top: 0px;
padding: 5px 10px;
height: 220px;
}
html.skin-theme-clientpref-os table.overview {
html.skin-theme-clientpref-os table.overview {
background-color: #1C1D21;
background-color: #1C1D21;
Строка 2078: Строка 2098:
           background: transparent;
           background: transparent;
}
}
html.skin-theme-clientpref-os .mw-parser-output .note-Storm-Atronach-Crate {
 
background-color: #3d425a;
html.skin-theme-clientpref-os .Drops {
color: #ffffff;
    padding: 10px !important;
background-image: url("/images/7/74/ON-icon-store-Storm_Atronach_Crown_Crate.png");
    margin-top: 2rem !important;
background-size: 40px;
    color: var(--color-progressive) !important;
font-size: 15px;
    border-bottom: 1px solid var(--color-progressive) !important;
border-color: #162f4d;
    min-width: 150px;
padding-left: 55px;
}
min-height: 40px;
html.skin-theme-clientpref-os .Applied {
background-color:#13b4a7;
}
html.skin-theme-clientpref-os .Applied {
background-color:#1b71b7;
}
}
html.skin-theme-clientpref-os .mw-parser-output .note-RageboundCrate {
html.skin-theme-clientpref-os .Video {
background-color: #3d425a;
background-color:#1b71b7;
color: #ffffff;
background-image: url("/images/9/9f/ON-icon-store-Ragebound_Crate.png");
background-size: 40px;
font-size: 15px;
border-color: #162f4d;
padding-left: 55px;
min-height: 40px;
}
}
html.skin-theme-clientpref-os .mw-parser-output .note-CarnavalCrate {
html.skin-theme-clientpref-os .Craft {
background-color: #3d425a;
background-color:#a3a634;
color: #ffffff;
background-image: url("/images/f/fd/ON-icon-store-Carnaval_Crate.png");
background-size: 40px;
font-size: 15px;
border-color: #162f4d;
padding-left: 55px;
min-height: 40px;
}
html.skin-theme-clientpref-os .mw-parser-output .note-WildHuntCrate {
background-color: #3d425a;
color: #ffffff;
background-image: url("/images/6/6a/ON-icon-store-Wild_Hunt_Crown_Crate.png");
background-size: 40px;
font-size: 15px;
border-color: #162f4d;
padding-left: 55px;
min-height: 40px;
}
html.skin-theme-clientpref-os body {
background-color: #1C1D21;
}
    html.skin-theme-clientpref-os {
        color-scheme: light dark;
        --color-base: #eaecf0;
        --color-base--hover: #f8f9fa;
        --color-emphasized: #f8f9fa;
        --color-subtle: #a2a9b1;
        --color-inverted: #101418;
        --color-progressive: #88a3e8;
        --color-progressive--hover: #b0c1f0;
        --color-progressive--active: #cbd6f6;
        --color-destructive: #fd7865;
        --color-destructive--hover: #fea898;
        --color-destructive--active: #ffc8bd;
        --color-visited: #a799cd;
        --color-destructive--visited: #c99391;
        --color-error: #fd7865;
        --color-warning: #fecc44;
        --color-success: #2cb491;
        --color-notice: #f8f9fa;
        --color-content-added: #80cdb3;
        --color-content-removed: #fd7865;
        --color-base--subtle: #a2a9b1;
        --box-shadow-color-base: #fff;
        --box-shadow-color-progressive--focus: #6b8edf;
        --box-shadow-color-destructive--focus: #6b8edf;
        --box-shadow-color-inverted: #000;
        --background-color-base: #1C1D21;
        --background-color-neutral: #27292d;
        --background-color-neutral-subtle: #202122;
        --background-color-interactive: #27292d;
        --background-color-interactive-subtle: #202122;
        --background-color-disabled: #54595d;
        --background-color-disabled-subtle: #404244;
        --background-color-inverted: #f8f9fa;
        --background-color-progressive--focus: #6b8edf;
        --background-color-progressive-subtle: #233566;
        --background-color-destructive--focus: #6b8edf;
        --background-color-destructive-subtle: #612419;
        --background-color-error: #fc493b;
        --background-color-error--hover: #fd7865;
        --background-color-error--active: #fea898;
        --background-color-error-subtle: #612419;
        --background-color-warning-subtle: #453217;
        --background-color-success-subtle: #153d31;
        --background-color-notice-subtle: #27292d;
        --background-color-content-added: #233566;
        --background-color-content-removed: #453217;
        --background-color-backdrop-light: rgba(0, 0, 0, 0.65);
        --background-color-backdrop-dark: rgba(255, 255, 255, 0.65);
        --border-color-base: #72777d;
        --border-color-subtle: #54595d;
        --border-color-muted: #404244;
        --border-color-interactive: #a2a9b1;
        --border-color-disabled: #54595d;
        --border-color-inverted: #101418;
        --border-color-progressive--focus: #6b8edf;
        --border-color-destructive--focus: #6b8edf;
        --border-color-error: #fc493b;
        --border-color-error--hover: #fd7865;
        --border-color-warning: #fecc44;
        --border-color-success: #2cb491;
        --border-color-notice: #c8ccd1;
        --border-color-content-added: #233566;
        --border-color-content-removed: #987027;
    }
html.skin-theme-clientpref-os .RadiantApexRewards {
background-color:#ab4d39;
}
html.skin-theme-clientpref-os .ApexRewards {
background-color:#9d5f1a;
}
html.skin-theme-clientpref-os .SuperiorRewards {
background-color:#245693;
}
html.skin-theme-clientpref-os .LegendaryRewards {
background-color:#998017;
}
html.skin-theme-clientpref-os .FineRewards {
background-color:#228e0c;
}
html.skin-theme-clientpref-os .Drops {
background-color:#5f8863;
}
html.skin-theme-clientpref-os .Applied {
background-color:#13b4a7;
}
html.skin-theme-clientpref-os .Applied {
background-color:#1b71b7;
}
html.skin-theme-clientpref-os .Video {
background-color:#1b71b7;
}
html.skin-theme-clientpref-os .Craft {
background-color:#a3a634;
}
}
html.skin-theme-clientpref-os .itemepic a {
html.skin-theme-clientpref-os .itemepic a {
Строка 2238: Строка 2140:
     padding: 0.5em;
     padding: 0.5em;
}
}
}
/* Стили для инфобокса */
.infobox {
    width: 100%;
    max-width: 350px;
    box-sizing: border-box;
    background: var(--color-surface-2);
    border-color: transparent;
    border-radius: var(--border-radius-base);
    padding: 1.5rem;
    height: fit-content;
    float: right;
    margin: 0 0 2rem 2rem;
}
.infobox-overview {
    width: 100%;
    max-width: 350px;
    box-sizing: border-box;
    background: #eaecf0;
    border: 1px solid #ECE6E7;
    padding: 1.5rem;
    height: fit-content;
    float: right;
    margin: 0 0 2rem 2rem;
}
.infobox-section {
margin-bottom: 1.5rem;
}
.infobox-section:last-child {
margin-bottom: 0;
}
.infobox-row {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 5px;
position: relative;
padding: 0.5rem 0;
}
.infobox-row-overview {
display: block;
align-items: flex-start;
justify-content: space-between;
gap: 5px;
position: relative;
padding: 0.5rem 0;
}
.infobox-row::after  {
content: '';
display: block;
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 1px;
background-color: var(--color-progressive);
opacity: 0.1;
}
.infobox-row-overview::after  {
content: '';
display: block;
position: absolute;
bottom: 0;
left: 0;
right: 60%;
height: 1px;
background-color: var(--color-progressive);
opacity: 0.1;
}
.infobox-row:last-child::after {
display: none;
}
.infobox-row-nested {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 5px;
position: relative;
padding: 0.2rem 0;
}
.infobox-row--no-flex {
display: block;
}
.infobox-row--overflow-x {
overflow-x: auto;
}
.infobox-row--wrap {
flex-wrap: wrap;
}
.infobox-title {
display: flex;
align-items: center;
position: relative;
font-size: 1.2em;
font-weight: 600;
justify-content: left;
color: var(--color-progressive);
}
.infobox-title::after  {
opacity: 0.3;
}
.infobox-title--icon {
font-size: 0.875em;
}
.infobox-overview-title {
display: block;
align-items: center;
position: relative;
font-size: 0.9em;
font-weight: 600;
justify-content: left;
color: var(--color-progressive);
}
.infobox-label {
color: var(--color-subtle);
}
.infobox-label.smw-highlighter {
border-bottom: 1px dotted var(--color-subtle);
}
.infobox-value {
color: var(--color-base);
text-align: right;
}
.infobox-quest--list--chapter {
overflow-x: auto;
white-space: nowrap;
}
.overview_box {
justify-content: space-between;
gap: 10px 20px;
align-items: start;
}
.overview_block {
display: grid;
    grid-template-columns: 96px auto;
    grid-template-rows: auto auto;
    align-content: start;
    grid-column: 1 / 2;
grid-row: auto;
}
.overview_icon {
flex: 0 0 96px;
height: 96px;
}
.overview_info {
grid-template-columns: min-content auto;
height: min-content;
flex: 1 1 auto;
}
@media screen and (max-width:450px){
.infobox {
max-width: 100%;
margin: 0 0 2rem 0;
}
}
/* Цвета кнопок */
/* Оформление кнопок */
.mw-parser-output .home-card--row4 {
    grid-row: span 4;
}
.mw-parser-output .home-card--col2 {
    grid-column: span 2;
}
.mw-parser-output .home-card {
    position: relative;
    padding: var(--space-md);
    border: 1px solid var(--border-color-base);
    background: var(--color-surface-1);
    border-radius: var(--border-radius-medium);
    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 {
    display: grid;
    margin-top: var(--space-xs);
    font-size: var(--font-size-small);
    font-weight: var(--font-weight-medium);
    grid-gap: var(--space-xs);
    text-align: center;
}
.mw-parser-output .home-link__button {
    display: flex;
}
.mw-parser-output .home-link__button a {
    flex-grow: 1;
    padding: var(--space-xs);
    border: 1px solid var(--border-color-base);
    background: var(--color-surface-2);
    border-radius: var(--border-radius-medium);
    color: var(--color-emphasized)!important;
    line-height: var(--line-height-xxx-small);
    text-decoration: none!important;
}
.mw-parser-output .home-link__button a:hover {
    background: var(--color-surface-2--hover)
}
.mw-parser-output .home-link__button a:active {
    background: var(--color-surface-2--active)
}
}
Источник — https://eso-wiki.ru/index.php?title=MediaWiki:Common.css