mediawiki-skins-Citizen/resources/skins.citizen.styles/Footer.less
alistair3149 aaad2bb92a
feat(core): move footer info into body footer
They are related to the article/page instead of the whole site
2022-10-01 17:25:20 -04:00

121 lines
1.9 KiB
Plaintext

.citizen-footer {
padding-top: var( --space-xl );
padding-bottom: var( --space-xl );
// Reserve space for header
margin-bottom: var( --header-size );
background-color: var( --color-surface-2 );
clear: both;
color: var( --color-base--subtle );
direction: ltr;
font-size: 0.875rem;
&__container {
max-width: var( --width-layout--extended );
margin-right: auto;
margin-left: auto;
}
&__content,
&__bottom {
display: flex;
flex-wrap: wrap;
padding: var( --space-md ) 0;
gap: var( --space-md );
}
&__bottom {
align-items: center;
justify-content: space-between;
border-top: 1px solid var( --border-color-base );
margin-right: auto;
margin-left: auto;
}
&__siteinfo {
display: flex;
max-width: 90ch;
flex-direction: column;
gap: var( --space-sm );
p {
margin: 0;
line-height: var( --line-height );
}
}
a {
color: var( --color-base--emphasized );
font-weight: 500;
}
ul {
display: flex;
flex-wrap: wrap;
margin: 0;
}
li {
list-style: none;
}
}
#footer {
&-sitetitle {
color: var( --color-base--emphasized );
font-size: 2.5rem;
img.mw-logo-wordmark {
width: auto;
height: 54px;
filter: invert( 1 ) hue-rotate( 180deg );
}
}
&-places {
ul {
flex-direction: column;
}
a {
display: block;
padding: var( --space-sm ) var( --space-md );
border-radius: var( --border-radius--small );
&:hover {
background-color: var( --background-color-quiet--hover );
}
&:active {
background-color: var( --background-color-quiet--active );
}
}
}
&-tagline {
padding: @margin-side / 2 0;
}
&-icons {
display: flex;
ul {
gap: var( --space-sm );
}
li {
display: flex; // Horizontally aligned with there are two icons in the same li
}
a {
display: flex;
align-items: center;
}
}
}
@media ( min-width: @width-breakpoint-desktop ) {
.citizen-footer {
margin-bottom: 0;
}
}