Difference between revisions of "MediaWiki:Common.css"
From LINKS Community Center
| Line 4: | Line 4: | ||
.filtered { | .filtered { | ||
| − | display: flex; | + | display: flex; |
| − | + | flex-direction: column; | |
| − | } | + | } |
| + | |||
| + | .filtered .filtered-views { | ||
| + | flex: auto; | ||
| + | margin: 1em 0; | ||
| + | } | ||
| + | |||
| + | .filtered .filtered-filters { | ||
| + | /* width: 300px; | ||
| + | margin: 1em 0 0 1em;*/ | ||
| + | margin: 0; | ||
| + | } | ||
| + | |||
| + | .filtered-filters, | ||
| + | .filtered-value, | ||
| + | .filtered-value-scrollable { | ||
| + | overflow: auto; | ||
| + | } | ||
| + | |||
| + | /* Styling for filtered results format end */ | ||
| + | |||
| + | |||
| + | /* Width for discourse topics list on front-page */ | ||
| + | d-topics-list iframe { | ||
| + | width: 100% !important; | ||
| + | margin-left: auto; | ||
| + | margin-right: auto; | ||
| + | } | ||
| + | |||
| + | /* NEW HOMEPAGE CSS START */ | ||
| + | :root { | ||
| + | --links-grey: #415262; | ||
| + | --links-orange: #ee7802; | ||
| + | --links-blue: #1980c3; | ||
| + | --links-cyan: #34b8b8; | ||
| + | } | ||
| + | |||
| + | #links-homepage { | ||
| + | color: var(--links-grey); | ||
| + | } | ||
| + | |||
| + | .links-tile { | ||
| + | display: flex; | ||
| + | padding: 1em; | ||
| + | flex-direction: column; | ||
| + | justify-content: center; | ||
| + | align-items: center; | ||
| + | background-color: var(--links-grey); | ||
| + | color: rgba(255, 255, 255, .8) !important; | ||
| + | height: 150px; | ||
| + | text-decoration: none !important; | ||
| + | transition: all 400ms; | ||
| + | } | ||
| + | |||
| + | .links-tile svg { | ||
| + | fill: rgba(255, 255, 255, .8); | ||
| + | transition: all 400ms; | ||
| + | height: 70px; | ||
| + | } | ||
| + | |||
| + | .links-tile:hover { | ||
| + | background-color: var(--links-orange); | ||
| + | color: var(--links-grey) !important; | ||
| + | transform: scale(1.05); | ||
| + | } | ||
| + | |||
| + | .links-tile:hover svg { | ||
| + | fill: var(--links-grey); | ||
| + | } | ||
| + | |||
| + | .links-tile-title { | ||
| + | font-variant: small-caps; | ||
| + | text-align: center; | ||
| + | } | ||
| + | |||
| + | .links-divider { | ||
| + | height: 4px; | ||
| + | background-color: var(--links-blue); | ||
| + | background-image: linear-gradient(to right, var(--links-orange), var(--links-cyan), var(--links-blue)); | ||
| + | } | ||
| + | |||
| + | .links-button { | ||
| + | display: inline-block; | ||
| + | padding: 1em; | ||
| + | text-align: center; | ||
| + | font-variant: small-caps; | ||
| + | background-color: var(--links-cyan); | ||
| + | color: rgba(255, 255, 255, .8) !important; | ||
| + | transition: all 400ms; | ||
| + | text-decoration: none !important; | ||
| + | } | ||
| + | |||
| + | .links-button:hover { | ||
| + | background-color: var(--links-orange); | ||
| + | color: var(--links-grey); | ||
| + | } | ||
| − | + | .recent-change { | |
| − | + | border-bottom: 1px solid var(--primary-low); | |
| − | + | } | |
| − | + | /* NEW HOMEPAGE CSS END */ | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | . | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | } | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | /* NEW HOMEPAGE CSS END */ | ||
Revision as of 16:03, 15 February 2022
/* CSS placed here will be applied to all skins */
/* Styling for filtered results format start */
.filtered {
display: flex;
flex-direction: column;
}
.filtered .filtered-views {
flex: auto;
margin: 1em 0;
}
.filtered .filtered-filters {
/* width: 300px;
margin: 1em 0 0 1em;*/
margin: 0;
}
.filtered-filters,
.filtered-value,
.filtered-value-scrollable {
overflow: auto;
}
/* Styling for filtered results format end */
/* Width for discourse topics list on front-page */
d-topics-list iframe {
width: 100% !important;
margin-left: auto;
margin-right: auto;
}
/* NEW HOMEPAGE CSS START */
:root {
--links-grey: #415262;
--links-orange: #ee7802;
--links-blue: #1980c3;
--links-cyan: #34b8b8;
}
#links-homepage {
color: var(--links-grey);
}
.links-tile {
display: flex;
padding: 1em;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: var(--links-grey);
color: rgba(255, 255, 255, .8) !important;
height: 150px;
text-decoration: none !important;
transition: all 400ms;
}
.links-tile svg {
fill: rgba(255, 255, 255, .8);
transition: all 400ms;
height: 70px;
}
.links-tile:hover {
background-color: var(--links-orange);
color: var(--links-grey) !important;
transform: scale(1.05);
}
.links-tile:hover svg {
fill: var(--links-grey);
}
.links-tile-title {
font-variant: small-caps;
text-align: center;
}
.links-divider {
height: 4px;
background-color: var(--links-blue);
background-image: linear-gradient(to right, var(--links-orange), var(--links-cyan), var(--links-blue));
}
.links-button {
display: inline-block;
padding: 1em;
text-align: center;
font-variant: small-caps;
background-color: var(--links-cyan);
color: rgba(255, 255, 255, .8) !important;
transition: all 400ms;
text-decoration: none !important;
}
.links-button:hover {
background-color: var(--links-orange);
color: var(--links-grey);
}
.recent-change {
border-bottom: 1px solid var(--primary-low);
}
/* NEW HOMEPAGE CSS END */