mirror of
https://github.com/StarCitizenTools/mediawiki-skins-Citizen.git
synced 2024-11-28 00:01:05 +00:00
feat(core): ✨ apply box-sizing: border-box by default
This commit is contained in:
parent
0b7c72ca5e
commit
68313123e9
|
@ -144,12 +144,6 @@
|
|||
margin-left: auto;
|
||||
}
|
||||
|
||||
.resource-loader-icon-link-small() {
|
||||
display: block;
|
||||
width: @icon-size;
|
||||
height: @icon-size;
|
||||
}
|
||||
|
||||
.resource-loader-icon() {
|
||||
position: absolute;
|
||||
width: inherit;
|
||||
|
|
|
@ -3,7 +3,6 @@
|
|||
|
||||
.citizen-pref {
|
||||
&__button {
|
||||
box-sizing: content-box;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
appearance: none;
|
||||
|
|
|
@ -6,6 +6,7 @@
|
|||
overflow: auto;
|
||||
width: 100%;
|
||||
max-height: ~'calc( var( --header-card-maxheight ) - var( --height-search-bar ) )';
|
||||
box-sizing: content-box; // Magic to align with search input
|
||||
margin: 0 0 0 -1px; // Reset <ol> styles, fix alignment
|
||||
border-bottom-left-radius: var( --border-radius--medium );
|
||||
border-bottom-right-radius: var( --border-radius--medium );
|
||||
|
|
|
@ -2,6 +2,7 @@
|
|||
* Framework
|
||||
*/
|
||||
html {
|
||||
box-sizing: border-box;
|
||||
// Not ideal but it works
|
||||
scroll-padding-top: 6rem;
|
||||
}
|
||||
|
@ -16,6 +17,13 @@ body {
|
|||
color: var( --color-base );
|
||||
}
|
||||
|
||||
// Apply border-box universally unless overwritten
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: inherit;
|
||||
}
|
||||
|
||||
:focus {
|
||||
outline-color: var( --color-primary );
|
||||
}
|
||||
|
|
|
@ -3,6 +3,7 @@
|
|||
|
||||
&Icon {
|
||||
display: flex;
|
||||
box-sizing: content-box; // Magic
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
|
|
|
@ -110,7 +110,7 @@
|
|||
// Sticky header styles
|
||||
.citizen-body-header--sticky {
|
||||
.citizen-toc__top.citizen-toc__link {
|
||||
height: 1.05rem; // ( 1rem text + 1rem padding ) * line height / 2
|
||||
height: 2rem; // 1rem text + 1rem padding
|
||||
padding-top: var( --space-xs );
|
||||
padding-bottom: var( --space-xs );
|
||||
opacity: 1;
|
||||
|
|
|
@ -22,7 +22,6 @@
|
|||
|
||||
// Fallback text button if extensions register those
|
||||
a {
|
||||
padding: var( --space-xxs );
|
||||
border-radius: var( --border-radius--small );
|
||||
font-size: 0.875rem;
|
||||
|
||||
|
@ -37,7 +36,8 @@
|
|||
}
|
||||
|
||||
.citizen-editsection-icon {
|
||||
.resource-loader-icon-link-small;
|
||||
width: 1.875rem;
|
||||
height: 1.875rem;
|
||||
opacity: var( --opacity-icon-base );
|
||||
text-indent: -9999px; // Hide text
|
||||
transition: @transition-opacity;
|
||||
|
@ -45,7 +45,7 @@
|
|||
&::before {
|
||||
.resource-loader-icon;
|
||||
display: block;
|
||||
background-size: contain;
|
||||
background-size: 1.125rem;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
|
|
|
@ -14,7 +14,6 @@
|
|||
top: 0;
|
||||
width: var( --header-button-size );
|
||||
height: var( --header-button-size );
|
||||
box-sizing: content-box;
|
||||
border-radius: var( --border-radius--small );
|
||||
margin: 0;
|
||||
background-position: center;
|
||||
|
|
|
@ -15,8 +15,6 @@
|
|||
> .oo-ui-popupWidget-popup {
|
||||
> .oo-ui-popupWidget {
|
||||
&-head {
|
||||
box-sizing: content-box; // fix overflow
|
||||
padding-top: 8px; // align with other menus
|
||||
border-bottom-color: var( --border-color-base );
|
||||
|
||||
> .oo-ui-iconWidget {
|
||||
|
@ -24,7 +22,9 @@
|
|||
}
|
||||
|
||||
> .oo-ui-labelElement-label {
|
||||
color: var( --color-base--emphasized );
|
||||
padding-top: 0.15em; // compensate font size changes
|
||||
font-size: 1rem;
|
||||
font-weight: var( --font-weight-semibold );
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue