mirror of
https://github.com/StarCitizenTools/mediawiki-skins-Citizen.git
synced 2024-12-01 09:26:53 +00:00
Merge pull request #139 from StarCitizenTools/dev
Clean up common stylesheets
This commit is contained in:
commit
6c120efad7
|
@ -219,18 +219,6 @@ figcaption,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.firstHeading {
|
|
||||||
margin: 0;
|
|
||||||
color: @base-10;
|
|
||||||
overflow-wrap: break-word; // Break word instead of overflow if title is too long
|
|
||||||
}
|
|
||||||
|
|
||||||
#siteSub {
|
|
||||||
display: block;
|
|
||||||
margin: 0.4rem 0 1.6rem;
|
|
||||||
color: @base-30;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mw-indicators {
|
.mw-indicators {
|
||||||
float: right;
|
float: right;
|
||||||
line-height: @content-line-height;
|
line-height: @content-line-height;
|
||||||
|
@ -245,154 +233,6 @@ figcaption,
|
||||||
*display: inline; // stylelint-disable declaration-block-no-duplicate-properties
|
*display: inline; // stylelint-disable declaration-block-no-duplicate-properties
|
||||||
}
|
}
|
||||||
|
|
||||||
.firstHeading,
|
|
||||||
#siteSub {
|
|
||||||
.content-center;
|
|
||||||
}
|
|
||||||
|
|
||||||
#contentSub,
|
|
||||||
#contentSub2 {
|
|
||||||
color: @base-30;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mw-body-content {
|
|
||||||
position: relative;
|
|
||||||
.content-center;
|
|
||||||
z-index: 0;
|
|
||||||
|
|
||||||
p {
|
|
||||||
overflow-wrap: break-word;
|
|
||||||
}
|
|
||||||
|
|
||||||
table {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5,
|
|
||||||
h6 {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
color: @color-content-header;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1,
|
|
||||||
h2 {
|
|
||||||
margin-top: @content-margin-top * 3;
|
|
||||||
}
|
|
||||||
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5,
|
|
||||||
h6,
|
|
||||||
p + p {
|
|
||||||
margin-top: @content-margin-top * 2;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 + h2,
|
|
||||||
h2 + h3,
|
|
||||||
h3 + h4,
|
|
||||||
h4 + h5,
|
|
||||||
h5 + h6,
|
|
||||||
p,
|
|
||||||
table {
|
|
||||||
margin-top: @content-margin-top;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul {
|
|
||||||
margin: @content-margin-top 0 0 @content-margin-top * 2;
|
|
||||||
|
|
||||||
ul {
|
|
||||||
margin: 0 0 0 @content-margin-top * 2;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ol {
|
|
||||||
margin: @content-margin-top 0 0 @content-margin-top * 3;
|
|
||||||
|
|
||||||
ol {
|
|
||||||
margin: 0 0 0 @content-margin-top * 3;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.image {
|
|
||||||
display: block;
|
|
||||||
overflow: hidden;
|
|
||||||
width: fit-content; // Get rid of extra pixels from thumbinner
|
|
||||||
|
|
||||||
img {
|
|
||||||
filter: none;
|
|
||||||
transition: @transition-filter, @transition-transform-quick;
|
|
||||||
|
|
||||||
&.lazy {
|
|
||||||
display: block;
|
|
||||||
background-color: @base-90;
|
|
||||||
filter: blur( 8px );
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
#mw-content-text {
|
|
||||||
.mw-parser-output {
|
|
||||||
.mw-headline {
|
|
||||||
order: -1; // Make sure that header is the first
|
|
||||||
}
|
|
||||||
|
|
||||||
& > h1,
|
|
||||||
& > h2,
|
|
||||||
& > h3,
|
|
||||||
& > h4,
|
|
||||||
& > h5,
|
|
||||||
& > h6 {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mw-editsection {
|
|
||||||
position: absolute;
|
|
||||||
display: flex;
|
|
||||||
margin: 0;
|
|
||||||
left: 0;
|
|
||||||
transform: ~'translateX(calc(-100% - @{margin-side}))';
|
|
||||||
|
|
||||||
a {
|
|
||||||
.resource-loader-icon-link-small;
|
|
||||||
padding: @margin-side / 4;
|
|
||||||
opacity: @opacity-icon;
|
|
||||||
transition: @transition-opacity;
|
|
||||||
text-indent: -9999px; // Hide text
|
|
||||||
background: 0 !important; // Cancel above styles
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
.resource-loader-icon;
|
|
||||||
background-size: contain;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover,
|
|
||||||
&:active,
|
|
||||||
&:focus {
|
|
||||||
opacity: @opacity-icon-active;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> span {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.plainlist ol,
|
.plainlist ol,
|
||||||
.plainlist ul {
|
.plainlist ul {
|
||||||
line-height: inherit;
|
line-height: inherit;
|
||||||
|
@ -456,22 +296,6 @@ figcaption,
|
||||||
color: @dark-color-link-new !important;
|
color: @dark-color-link-new !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-body .firstHeading,
|
|
||||||
.mw-body-content h1,
|
|
||||||
.mw-body-content h2,
|
|
||||||
.mw-body-content h3,
|
|
||||||
.mw-body-content h4,
|
|
||||||
.mw-body-content h5,
|
|
||||||
.mw-body-content h6 {
|
|
||||||
color: @dark-text-100;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mw-body-content #contentSub,
|
|
||||||
.mw-body-content #contentSub2,
|
|
||||||
.mw-body #siteSub {
|
|
||||||
color: @dark-text-80 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mw-editsection > a:before {
|
.mw-editsection > a:before {
|
||||||
filter: invert( 1 );
|
filter: invert( 1 );
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,3 +1,25 @@
|
||||||
|
.firstHeading {
|
||||||
|
margin: 0;
|
||||||
|
color: @base-10;
|
||||||
|
overflow-wrap: break-word; // Break word instead of overflow if title is too long
|
||||||
|
}
|
||||||
|
|
||||||
|
#siteSub {
|
||||||
|
display: block;
|
||||||
|
margin: 0.4rem 0 1.6rem;
|
||||||
|
color: @base-30;
|
||||||
|
}
|
||||||
|
|
||||||
|
.firstHeading,
|
||||||
|
#siteSub {
|
||||||
|
.content-center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#contentSub,
|
||||||
|
#contentSub2 {
|
||||||
|
color: @base-30;
|
||||||
|
}
|
||||||
|
|
||||||
#mw-content-text {
|
#mw-content-text {
|
||||||
/*
|
/*
|
||||||
* Interal link styles
|
* Interal link styles
|
||||||
|
@ -66,6 +88,130 @@
|
||||||
margin-right: @negative-margin / 2;
|
margin-right: @negative-margin / 2;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mw-parser-output {
|
||||||
|
.mw-headline {
|
||||||
|
order: -1; // Make sure that header is the first
|
||||||
|
}
|
||||||
|
|
||||||
|
& > h1,
|
||||||
|
& > h2,
|
||||||
|
& > h3,
|
||||||
|
& > h4,
|
||||||
|
& > h5,
|
||||||
|
& > h6 {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mw-editsection {
|
||||||
|
position: absolute;
|
||||||
|
display: flex;
|
||||||
|
margin: 0;
|
||||||
|
left: 0;
|
||||||
|
transform: ~'translateX(calc(-100% - @{margin-side}))';
|
||||||
|
|
||||||
|
a {
|
||||||
|
.resource-loader-icon-link-small;
|
||||||
|
padding: @margin-side / 4;
|
||||||
|
opacity: @opacity-icon;
|
||||||
|
transition: @transition-opacity;
|
||||||
|
text-indent: -9999px; // Hide text
|
||||||
|
background: 0 !important; // Cancel above styles
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
.resource-loader-icon;
|
||||||
|
background-size: contain;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover,
|
||||||
|
&:active,
|
||||||
|
&:focus {
|
||||||
|
opacity: @opacity-icon-active;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> span {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mw-body-content {
|
||||||
|
position: relative;
|
||||||
|
.content-center;
|
||||||
|
z-index: 0;
|
||||||
|
|
||||||
|
p {
|
||||||
|
overflow-wrap: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
color: @color-content-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1,
|
||||||
|
h2 {
|
||||||
|
margin-top: @content-margin-top * 3;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6,
|
||||||
|
p + p {
|
||||||
|
margin-top: @content-margin-top * 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 + h2,
|
||||||
|
h2 + h3,
|
||||||
|
h3 + h4,
|
||||||
|
h4 + h5,
|
||||||
|
h5 + h6,
|
||||||
|
p,
|
||||||
|
table {
|
||||||
|
margin-top: @content-margin-top;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
margin: @content-margin-top 0 0 @content-margin-top * 2;
|
||||||
|
|
||||||
|
ul {
|
||||||
|
margin: 0 0 0 @content-margin-top * 2;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
ol {
|
||||||
|
margin: @content-margin-top 0 0 @content-margin-top * 3;
|
||||||
|
|
||||||
|
ol {
|
||||||
|
margin: 0 0 0 @content-margin-top * 3;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
a.image {
|
||||||
|
display: block;
|
||||||
|
overflow: hidden;
|
||||||
|
width: fit-content; // Get rid of extra pixels from thumbinner
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media ( max-width: @screen0 ) {
|
@media ( max-width: @screen0 ) {
|
||||||
|
@ -177,3 +323,21 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media ( prefers-color-scheme: dark ) {
|
||||||
|
.mw-body .firstHeading,
|
||||||
|
.mw-body-content h1,
|
||||||
|
.mw-body-content h2,
|
||||||
|
.mw-body-content h3,
|
||||||
|
.mw-body-content h4,
|
||||||
|
.mw-body-content h5,
|
||||||
|
.mw-body-content h6 {
|
||||||
|
color: @dark-text-100;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mw-body-content #contentSub,
|
||||||
|
.mw-body-content #contentSub2,
|
||||||
|
.mw-body #siteSub {
|
||||||
|
color: @dark-text-80 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -7,12 +7,11 @@
|
||||||
@import 'common/common.less';
|
@import 'common/common.less';
|
||||||
@import 'common/content.less';
|
@import 'common/content.less';
|
||||||
@import 'common/typography.less';
|
@import 'common/typography.less';
|
||||||
@import 'common/scrollbar.less';
|
@import 'common/hacks.less';
|
||||||
@import 'common/reducemotion.less';
|
|
||||||
@import 'common/catlinks.less';
|
|
||||||
@import 'common/toc.less';
|
@import 'common/toc.less';
|
||||||
@import 'common/wikitable.less';
|
@import 'common/wikitable.less';
|
||||||
@import 'common/hacks.less';
|
@import 'common/scrollbar.less';
|
||||||
|
@import 'common/reducemotion.less';
|
||||||
|
|
||||||
// Components
|
// Components
|
||||||
@import 'Header.less';
|
@import 'Header.less';
|
||||||
|
@ -21,6 +20,7 @@
|
||||||
@import 'Pagetools.less';
|
@import 'Pagetools.less';
|
||||||
@import 'Menu.less';
|
@import 'Menu.less';
|
||||||
@import 'Sidebar.less';
|
@import 'Sidebar.less';
|
||||||
|
@import 'Catlinks.less';
|
||||||
@import 'Pagelinks.less';
|
@import 'Pagelinks.less';
|
||||||
@import 'Footer.less';
|
@import 'Footer.less';
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue