MediaWiki:Vector.css: Difference between revisions
Content added Content deleted
(new top nav implementation, uses JS to create the nav instead of hacky CSS) |
(print styles) |
||
| Line 2: | Line 2: | ||
body { |
body { |
||
background: #000 url('https://static.miraheze.org/ricochetwiki/2/22/Stars_background.jpg'); |
background: #000 url('https://static.miraheze.org/ricochetwiki/2/22/Stars_background.jpg'); |
||
} |
|||
@media print { |
|||
body { |
|||
background: none; |
|||
} |
|||
} |
} |
||
| Line 26: | Line 32: | ||
#footer li { |
#footer li { |
||
color: #fff; |
color: #fff; |
||
} |
|||
@media print { |
|||
#footer, |
|||
#footer li { |
|||
color: #000; |
|||
} |
|||
} |
} |
||
| Line 68: | Line 81: | ||
/* top nav */ |
/* top nav */ |
||
.client-js #mw-page-base { |
.client-js #mw-page-base { |
||
height: calc(5em + 56px); |
|||
} |
} |
||
.client-js .mw-page-container-inner { |
.client-js .mw-page-container-inner { |
||
padding-top: 56px; |
|||
} |
} |
||
| Line 78: | Line 91: | ||
.client-js #mw-panel, |
.client-js #mw-panel, |
||
.client-js .ve-ui-toolbar-floating > .oo-ui-toolbar-bar { |
.client-js .ve-ui-toolbar-floating > .oo-ui-toolbar-bar { |
||
top: 56px; |
|||
} |
} |
||
#ricochet-top-nav { |
#ricochet-top-nav { |
||
position: absolute; |
|||
top: 0; |
|||
left: 0; |
|||
width: 100%; |
|||
padding: 0.5rem 1rem; |
|||
background: #343a40; |
|||
box-sizing: border-box; |
|||
font-family: Verdana, Arial, Helvetica, sans-serif; |
|||
font-size: 1rem; |
|||
font-weight: 400; |
|||
line-height: 1.5; |
|||
text-align: left; |
|||
z-index: 101; |
|||
} |
} |
||
#ricochet-top-nav-list { |
#ricochet-top-nav-list { |
||
list-style: none; |
|||
margin: 0; |
|||
padding: 0; |
|||
display: flex; |
|||
flex-direction: row; |
|||
} |
} |
||
#ricochet-top-nav-list a { |
#ricochet-top-nav-list a { |
||
display: block; |
|||
padding: 0.5rem 0.5rem; |
|||
color: rgba(255, 255, 255, 0.5); |
|||
text-decoration: none; |
|||
} |
} |
||
#ricochet-top-nav-list a:hover, |
#ricochet-top-nav-list a:hover, |
||
#ricochet-top-nav-list a:focus { |
#ricochet-top-nav-list a:focus { |
||
color: rgba(255, 255, 255, 0.75); |
|||
text-decoration: none; |
|||
} |
} |
||
#ricochet-top-nav-list svg { |
#ricochet-top-nav-list svg { |
||
width: 20px; |
|||
height: 20px; |
|||
fill: hsla(0, 0%, 100%, 0.5); |
|||
vertical-align: middle; |
|||
} |
} |
||
#ricochet-top-nav-list a[href="https://wiki.ricochetuniverse.com"] |
#ricochet-top-nav-list a[href="https://wiki.ricochetuniverse.com"] |
||
{ |
{ |
||
color: #fff; /* active */ |
|||
} |
} |
||
#ricochet-top-nav-list a[href$='/discord']:hover > svg, |
#ricochet-top-nav-list a[href$='/discord']:hover > svg, |
||
#ricochet-top-nav-list a[href$='/discord']:focus > svg { |
#ricochet-top-nav-list a[href$='/discord']:focus > svg { |
||
fill: #5865f2; |
|||
} |
|||
@media print { |
|||
#ricochet-top-nav { |
|||
display: none; |
|||
} |
|||
} |
} |
||