mirror of
https://github.com/StarCitizenTools/mediawiki-skins-Citizen.git
synced 2024-11-25 14:57:31 +00:00
5d3ecd9edd
This is an on-going work to adapt Codex into Citizen. Some of the CSS variables are soft depreciated, see tokens.less for updated info.
120 lines
1.9 KiB
Plaintext
120 lines
1.9 KiB
Plaintext
.citizen-footer {
|
|
padding: var( --space-xxl ) var( --padding-page );
|
|
margin-top: var( --space-xxl );
|
|
// Reserve space for header
|
|
margin-bottom: var( --header-size );
|
|
clear: both;
|
|
font-size: var( --font-size-small );
|
|
color: var( --color-subtle );
|
|
background-color: var( --color-surface-2 );
|
|
direction: ltr;
|
|
|
|
&__container {
|
|
max-width: var( --width-layout--extended );
|
|
margin-right: auto;
|
|
margin-left: auto;
|
|
}
|
|
|
|
&__content,
|
|
&__bottom {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var( --space-md );
|
|
justify-content: space-between;
|
|
padding: var( --space-md ) 0;
|
|
}
|
|
|
|
&__bottom {
|
|
align-items: center;
|
|
margin-right: auto;
|
|
margin-left: auto;
|
|
border-top: 1px solid var( --border-color-base );
|
|
}
|
|
|
|
&__siteinfo {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var( --space-xs );
|
|
max-width: 90ch;
|
|
|
|
p {
|
|
margin: 0;
|
|
line-height: var( --line-height );
|
|
}
|
|
}
|
|
|
|
a {
|
|
font-weight: var( --font-weight-medium );
|
|
color: var( --color-emphasized );
|
|
}
|
|
|
|
ul {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
margin: 0;
|
|
}
|
|
|
|
li {
|
|
list-style: none;
|
|
}
|
|
}
|
|
|
|
#footer {
|
|
&-places {
|
|
ul {
|
|
flex-direction: column;
|
|
}
|
|
|
|
a {
|
|
display: block;
|
|
padding: var( --space-xs ) 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 );
|
|
}
|
|
|
|
&:hover,
|
|
&:focus {
|
|
text-decoration: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
&-tagline {
|
|
padding: var( --space-xs ) 0;
|
|
}
|
|
|
|
&-icons {
|
|
display: flex;
|
|
|
|
ul {
|
|
gap: var( --space-xs );
|
|
}
|
|
|
|
li {
|
|
display: flex; // Horizontally aligned with there are two icons in the same li
|
|
gap: var( --space-xs ); // Sometimes there can be multiple icon under the same li
|
|
}
|
|
|
|
a {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
}
|
|
}
|
|
|
|
@media ( min-width: @min-width-breakpoint-desktop ) {
|
|
.citizen-footer {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
#footer-sitetitle {
|
|
font-size: 2rem;
|
|
}
|
|
}
|