Want to contribute? Join the Discord and ask for the editor role.
Template:Navplate/styles.css: Difference between revisions
Template page
No edit summary |
No edit summary |
||
Line 99: | Line 99: | ||
} | } | ||
html.skin-citizen-dark .navplate-header-label, | |||
html.skin-citizen-dark .navplate-content-header, | |||
html.skin-citizen-dark .navplate-content-item-label { | |||
color: #a0a1a5; | color: #a0a1a5; | ||
} | } | ||
html.skin-citizen-dark .navplate-content { | |||
background: #1d2129; | background: #1d2129; | ||
} | } | ||
html.skin-citizen-dark .navplate-content-header { | |||
border-color: rgba(255,255,255,0.02); | border-color: rgba(255,255,255,0.02); | ||
background-color: rgba(255,255,255,0.04); | background-color: rgba(255,255,255,0.04); | ||
} | } | ||
html.skin-citizen-dark .navplate-content-item { | |||
border-color: rgba(255,255,255,0.05); | border-color: rgba(255,255,255,0.05); | ||
} | } | ||
html.skin-citizen-dark .navplate-content-item-label { | |||
background-color: rgba(255,255,255,0.02); | background-color: rgba(255,255,255,0.02); | ||
} | } | ||
html.skin-citizen-dark .navplate .mw-collapsible-text { | |||
border-color: rgba(255,255,255,0.04); | border-color: rgba(255,255,255,0.04); | ||
color: #a0a1a5; | color: #a0a1a5; | ||
Line 128: | Line 128: | ||
} | } | ||
html.skin-citizen-dark .navplate .mw-collapsible-text:hover { | |||
background: rgba(255,255,255,0.05); | background: rgba(255,255,255,0.05); | ||
} | } | ||
html.skin-citizen-dark .navplate .mw-collapsible-text:active { | |||
background: rgba(255,255,255,0.02); | background: rgba(255,255,255,0.02); | ||
} | } |
Revision as of 00:46, 5 May 2021
.navplate {
margin-top: 1.6rem;
clear: both;
}
.navplate p {
margin: 0;
}
.navplate-header {
line-height: 1.2;
}
.navplate-header-label,
.navplate-content-header,
.navplate-content-item-label {
color: #72777d;
letter-spacing: .75px;
}
.navplate-header-label {
font-size: 0.8125rem;
}
.navplate-header-title {
margin-top: 2px;
font-size: 1.2rem;
font-weight: bold;
}
.navplate-content {
margin: 10px -20px 0;
border-radius: 12px;
background: #f8f9fa;
font-size: 14px;
overflow: hidden;
}
.navplate-content-header {
padding: 5px 20px;
border-bottom: 1px solid rgba(0,0,0,0.02);
background-color: rgba(0,0,0,0.04);
}
.navplate-content-item {
display: grid;
border-bottom: 1px solid rgba(0,0,0,0.04);
}
.navplate-content-item-label {
padding: 10px 20px;
display: flex;
background-color: rgba(0,0,0,0.02);
}
.navplate-content-item-label-icon {
margin-right: 8px;
}
.navplate-content-item-list {
padding: 10px 14px;
}
.navplate-content-item-list a {
padding: 0px 6px;
display: inline-block;
}
.navplate .mw-collapsible-toggle {
position: absolute;
float: unset;
right: 0;
margin-top: -47px;
}
.navplate .mw-collapsible-toggle-default:before,
.navplate .mw-collapsible-toggle-default:after {
content: none;
}
.navplate .mw-collapsible-text {
position: relative;
right: 0;
padding: 4px 12px;
display: block;
border: 1px solid rgba(0,0,0,0.02);
border-radius: 12px;
color: #72777d;
background: rgba(0,0,0,0.02);
}
.navplate .mw-collapsible-text:hover {
background: rgba(0,0,0,0.03);
}
.navplate .mw-collapsible-text:active {
background: rgba(0,0,0,0.05);
}
html.skin-citizen-dark .navplate-header-label,
html.skin-citizen-dark .navplate-content-header,
html.skin-citizen-dark .navplate-content-item-label {
color: #a0a1a5;
}
html.skin-citizen-dark .navplate-content {
background: #1d2129;
}
html.skin-citizen-dark .navplate-content-header {
border-color: rgba(255,255,255,0.02);
background-color: rgba(255,255,255,0.04);
}
html.skin-citizen-dark .navplate-content-item {
border-color: rgba(255,255,255,0.05);
}
html.skin-citizen-dark .navplate-content-item-label {
background-color: rgba(255,255,255,0.02);
}
html.skin-citizen-dark .navplate .mw-collapsible-text {
border-color: rgba(255,255,255,0.04);
color: #a0a1a5;
background: rgba(255,255,255,0.04);
}
html.skin-citizen-dark .navplate .mw-collapsible-text:hover {
background: rgba(255,255,255,0.05);
}
html.skin-citizen-dark .navplate .mw-collapsible-text:active {
background: rgba(255,255,255,0.02);
}
@media only screen and (min-width: 720px) {
.navplate-content {
margin-left: 0;
margin-right: 0;
}
.navplate-content-item {
grid-template-columns: 180px auto;
}
.navplate-content-item-label {
padding-right: 10px;
}
.navplate-content-item-list {
padding-left: 6px;
}
}