Merge pull request #139 from StarCitizenTools/dev

Clean up common stylesheets
This commit is contained in:
alistair3149 2020-06-12 14:19:48 -04:00 committed by GitHub
commit 6c120efad7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 168 additions and 180 deletions

View file

@ -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 );
} }

View file

@ -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;
}
}

View file

@ -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';
} }