steffen/website
1
0
Fork 0
Code Actions Packages Releases Activity

Update all CSS to use logical properties

Browse Source 
- Vendor CSS's are excluded for now
- Removed <IE7 asterisk prefix items
This commit is contained in:
iBug
2024-06-25 23:36:16 +08:00
parent 9ffaf41d20
commit 922440cd55
15 changed files with 159 additions and 229 deletions
Download Patch File Download Diff File Expand all files Collapse all files

104
_sass/minimal-mistakes/_archive.scss
View File

@ -7,7 +7,7 @@
margin-bottom: 2em; margin-bottom: 2em;
@include breakpoint($large) { @include breakpoint($large) {
float: right; float: inline-end;
width: calc(100% - #{$right-sidebar-width-narrow}); width: calc(100% - #{$right-sidebar-width-narrow});
padding-inline-end: $right-sidebar-width-narrow; padding-inline-end: $right-sidebar-width-narrow;
} }
@ -53,10 +53,7 @@
a[rel="permalink"]::before { a[rel="permalink"]::before {
content: ''; content: '';
position: absolute; position: absolute;
left: 0; inset: 0;
top: 0;
right: 0;
bottom: 0;
} }
a + a { a + a {
@ -98,14 +95,14 @@
.archive__item-caption { .archive__item-caption {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
right: 0; inset-inline-end: 0;
margin: 0 auto; margin: 0 auto;
padding: 2px 5px; padding: 2px 5px;
color: #fff; color: #fff;
font-family: $caption-font-family; font-family: $caption-font-family;
font-size: $type-size-8; font-size: $type-size-8;
background: #000; background: #000;
text-align: right; text-align: end;
z-index: 5; z-index: 5;
opacity: 0.5; opacity: 0.5;
border-radius: $border-radius 0 0 0; border-radius: $border-radius 0 0 0;
@ -140,11 +137,11 @@
/* extend grid elements to the right */ /* extend grid elements to the right */
@include breakpoint($large) { @include breakpoint($large) {
margin-right: -1 * $right-sidebar-width-narrow; margin-inline-end: -1 * $right-sidebar-width-narrow;
} }
@include breakpoint($x-large) { @include breakpoint($x-large) {
margin-right: -1 * $right-sidebar-width; margin-inline-end: -1 * $right-sidebar-width;
} }
} }
} }
@ -153,23 +150,22 @@
margin-bottom: 2em; margin-bottom: 2em;
@include breakpoint($small) { @include breakpoint($small) {
float: left; float: inline-start;
width: span(5 of 10); width: span(5 of 10);
&:nth-child(2n + 1) { &:nth-child(2n + 1) {
clear: both; clear: both;
margin-left: 0; margin-inline-start: 0;
} }
&:nth-child(2n + 2) { &:nth-child(2n + 2) {
clear: none; clear: none;
margin-left: gutter(of 10); margin-inline-start: gutter(of 10);
} }
} }
@include breakpoint($medium) { @include breakpoint($medium) {
margin-left: 0; /* override margin*/ margin-inline: 0; /* override margin*/
margin-right: 0; /* override margin*/
width: span(3 of 12); width: span(3 of 12);
&:nth-child(2n + 1) { &:nth-child(2n + 1) {
@ -182,17 +178,17 @@
&:nth-child(4n + 2) { &:nth-child(4n + 2) {
clear: none; clear: none;
margin-left: gutter(1 of 12); margin-inline-start: gutter(1 of 12);
} }
&:nth-child(4n + 3) { &:nth-child(4n + 3) {
clear: none; clear: none;
margin-left: gutter(1 of 12); margin-inline-start: gutter(1 of 12);
} }
&:nth-child(4n + 4) { &:nth-child(4n + 4) {
clear: none; clear: none;
margin-left: gutter(1 of 12); margin-inline-start: gutter(1 of 12);
} }
} }
@ -254,23 +250,23 @@
font-size: 1.125em; font-size: 1.125em;
@include breakpoint($small) { @include breakpoint($small) {
float: left; float: inline-start;
margin-bottom: 0; margin-bottom: 0;
width: span(4 of 12); width: span(4 of 12);
&:nth-child(3n + 1) { &:nth-child(3n + 1) {
clear: both; clear: both;
margin-left: 0; margin-inline-start: 0;
} }
&:nth-child(3n + 2) { &:nth-child(3n + 2) {
clear: none; clear: none;
margin-left: gutter(of 12); margin-inline-start: gutter(of 12);
} }
&:nth-child(3n + 3) { &:nth-child(3n + 3) {
clear: none; clear: none;
margin-left: gutter(of 12); margin-inline-start: gutter(of 12);
} }
.feature__item-teaser { .feature__item-teaser {
@ -280,30 +276,25 @@
} }
.archive__item-body { .archive__item-body {
padding-left: gutter(1 of 12); padding-inline: gutter(1 of 12);
padding-right: gutter(1 of 12);
} }
a.btn::before { a.btn::before {
content: ''; content: '';
position: absolute; position: absolute;
left: 0; inset: 0;
top: 0;
right: 0;
bottom: 0;
} }
&--left { &--left {
position: relative; position: relative;
float: left; float: inline-start;
margin-left: 0; margin-inline: 0;
margin-right: 0;
width: 100%; width: 100%;
clear: both; clear: both;
font-size: 1.125em; font-size: 1.125em;
.archive__item { .archive__item {
float: left; float: inline-start;
} }
.archive__item-teaser { .archive__item-teaser {
@ -313,22 +304,19 @@
a.btn::before { a.btn::before {
content: ''; content: '';
position: absolute; position: absolute;
left: 0; inset: 0;
top: 0;
right: 0;
bottom: 0;
} }
@include breakpoint($small) { @include breakpoint($small) {
.archive__item-teaser { .archive__item-teaser {
float: left; float: inline-start;
width: span(5 of 12); width: span(5 of 12);
} }
.archive__item-body { .archive__item-body {
float: right; float: inline-end;
padding-left: gutter(0.5 of 12); padding-inline-start: gutter(0.5 of 12);
padding-right: gutter(1 of 12); padding-inline-end: gutter(1 of 12);
width: span(7 of 12); width: span(7 of 12);
} }
} }
@ -336,15 +324,14 @@
&--right { &--right {
position: relative; position: relative;
float: left; float: inline-start;
margin-left: 0; margin-inline: 0;
margin-right: 0;
width: 100%; width: 100%;
clear: both; clear: both;
font-size: 1.125em; font-size: 1.125em;
.archive__item { .archive__item {
float: left; float: inline-start;
} }
.archive__item-teaser { .archive__item-teaser {
@ -354,34 +341,30 @@
a.btn::before { a.btn::before {
content: ''; content: '';
position: absolute; position: absolute;
left: 0; inset: 0;
top: 0;
right: 0;
bottom: 0;
} }
@include breakpoint($small) { @include breakpoint($small) {
text-align: right; text-align: end;
.archive__item-teaser { .archive__item-teaser {
float: right; float: inline-end;
width: span(5 of 12); width: span(5 of 12);
} }
.archive__item-body { .archive__item-body {
float: left; float: inline-start;
width: span(7 of 12); width: span(7 of 12);
padding-left: gutter(0.5 of 12); padding-inline-start: gutter(0.5 of 12);
padding-right: gutter(1 of 12); padding-inline-end: gutter(1 of 12);
} }
} }
} }
&--center { &--center {
position: relative; position: relative;
float: left; float: inline-start;
margin-left: 0; margin-inline: 0;
margin-right: 0;
width: 100%; width: 100%;
clear: both; clear: both;
font-size: 1.125em; font-size: 1.125em;
@ -398,10 +381,7 @@
a.btn::before { a.btn::before {
content: ''; content: '';
position: absolute; position: absolute;
left: 0; inset: 0;
top: 0;
right: 0;
bottom: 0;
} }
@include breakpoint($small) { @include breakpoint($small) {
@ -442,14 +422,14 @@
Wide Pages Wide Pages
========================================================================== */ ========================================================================== */
.wide { .wide {
.archive { .archive {
@include breakpoint($large) { @include breakpoint($large) {
padding-right: 0; padding-inline-end: 0;
} }
@include breakpoint($x-large) { @include breakpoint($x-large) {
padding-right: 0; padding-inline-end: 0;
} }
} }
} }

4
_sass/minimal-mistakes/_base.scss
View File

@ -116,9 +116,9 @@ blockquote {
cite { cite {
font-style: italic; font-style: italic;
&:before { &::before {
content: "\2014"; content: "\2014";
padding-right: 5px; padding-inline-end: 5px;
} }
} }
} }

6
_sass/minimal-mistakes/_buttons.scss
View File

@ -21,11 +21,11 @@
cursor: pointer; cursor: pointer;
.icon { .icon {
margin-right: 0.5em; margin-inline-end: 0.5em;
} }
.icon + .hidden { .icon + .hidden {
margin-left: -0.5em; /* override for hidden text*/ margin-inline-start: -0.5em; /* override for hidden text*/
} }
/* button colors */ /* button colors */
@ -94,4 +94,4 @@
&--small { &--small {
font-size: $type-size-7; font-size: $type-size-7;
} }
} }

14
_sass/minimal-mistakes/_footer.scss
View File

@ -4,9 +4,8 @@
.page__footer { .page__footer {
@include clearfix; @include clearfix;
float: left; float: inline-start;
margin-left: 0; margin-inline: 0;
margin-right: 0;
width: 100%; width: 100%;
margin-top: 3em; margin-top: 3em;
color: $muted-text-color; color: $muted-text-color;
@ -18,8 +17,7 @@
footer { footer {
@include clearfix; @include clearfix;
margin-left: auto; margin-inline: auto;
margin-right: auto;
margin-top: 2em; margin-top: 2em;
max-width: 100%; max-width: 100%;
padding: 0 1em 2em; padding: 0 1em 2em;
@ -67,13 +65,13 @@
text-transform: uppercase; text-transform: uppercase;
} }
li + li:before { li + li::before {
content: ""; content: "";
padding-right: 5px; padding-inline-end: 5px;
} }
a { a {
padding-right: 10px; padding-inline-end: 10px;
font-weight: bold; font-weight: bold;
} }

43
_sass/minimal-mistakes/_forms.scss
View File

@ -3,7 +3,7 @@
========================================================================== */ ========================================================================== */
form { form {
margin: 0 0 5px 0; margin-bottom: 5px;
padding: 1em; padding: 1em;
background-color: $form-background-color; background-color: $form-background-color;
@ -17,7 +17,7 @@ form {
display: block; display: block;
width: 100%; width: 100%;
margin-bottom: 5px * 2; margin-bottom: 5px * 2;
*margin-left: -7px; margin-inline-start: -7px;
padding: 0; padding: 0;
color: $text-color; color: $text-color;
border: 0; border: 0;
@ -45,7 +45,6 @@ button,
select, select,
textarea { textarea {
vertical-align: baseline; vertical-align: baseline;
*vertical-align: middle;
} }
input, input,
@ -102,7 +101,6 @@ input[type="radio"] {
height: auto; height: auto;
padding: 0; padding: 0;
margin: 3px 0; margin: 3px 0;
*margin-top: 0;
line-height: normal; line-height: normal;
cursor: pointer; cursor: pointer;
border-radius: 0; border-radius: 0;
@ -114,8 +112,6 @@ input[type="checkbox"],
input[type="radio"] { input[type="radio"] {
box-sizing: border-box; box-sizing: border-box;
padding: 0; padding: 0;
*width: 13px;
*height: 13px;
} }
input[type="image"] { input[type="image"] {
@ -138,12 +134,6 @@ input[type="submit"] {
width: auto; width: auto;
height: auto; height: auto;
cursor: pointer; cursor: pointer;
*overflow: visible;
}
select,
input[type="file"] {
*margin-top: 4px;
} }
select { select {
@ -173,14 +163,14 @@ input[type="hidden"] {
.radio, .radio,
.checkbox { .checkbox {
padding-left: 18px; padding-inline-start: 18px;
font-weight: normal; font-weight: normal;
} }
.radio input[type="radio"], .radio input[type="radio"],
.checkbox input[type="checkbox"] { .checkbox input[type="checkbox"] {
float: left; float: inline-start;
margin-left: -18px; margin-inline-start: -18px;
} }
.radio.inline, .radio.inline,
@ -193,7 +183,7 @@ input[type="hidden"] {
.radio.inline + .radio.inline, .radio.inline + .radio.inline,
.checkbox.inline + .checkbox.inline { .checkbox.inline + .checkbox.inline {
margin-left: 10px; margin-inline-start: 10px;
} }
/* /*
@ -248,7 +238,7 @@ select:focus {
.help-inline { .help-inline {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
padding-left: 5px; padding-inline-start: 5px;
} }
/* /*
@ -279,16 +269,16 @@ select:focus {
.form-inline .radio, .form-inline .radio,
.form-inline .checkbox, .form-inline .checkbox,
.form-inline .radio { .form-inline .radio {
padding-left: 0; padding-inline-start: 0;
margin-bottom: 0; margin-bottom: 0;
vertical-align: middle; vertical-align: middle;
} }
.form-inline .radio input[type="radio"], .form-inline .radio input[type="radio"],
.form-inline .checkbox input[type="checkbox"] { .form-inline .checkbox input[type="checkbox"] {
float: left; float: inline-start;
margin-left: 0; margin-inline-start: 0;
margin-right: 3px; margin-inline-end: 3px;
} }
/* /*
@ -303,8 +293,7 @@ select:focus {
} }
.form-search .search-query { .form-search .search-query {
padding-left: 14px; padding-inline: 14px;
padding-right: 14px;
margin-bottom: 0; margin-bottom: 0;
border-radius: 14px; border-radius: 14px;
} }
@ -324,15 +313,15 @@ select:focus {
.form-search .radio input[type="radio"], .form-search .radio input[type="radio"],
.form-search .checkbox input[type="checkbox"] { .form-search .checkbox input[type="checkbox"] {
float: left; float: left;
margin-left: 0; margin-inline-start: 0;
margin-right: 3px; margin-inline-end: 3px;
} }
/* /*
.form--loading .form--loading
========================================================================== */ ========================================================================== */
.form--loading:before { .form--loading::before {
content: ""; content: "";
} }
@ -340,7 +329,7 @@ select:focus {
display: block; display: block;
} }
.form:before { .form::before {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;

14
_sass/minimal-mistakes/_masthead.scss
View File

@ -13,8 +13,7 @@
&__inner-wrap { &__inner-wrap {
@include clearfix; @include clearfix;
margin-left: auto; margin-inline: auto;
margin-right: auto;
padding: 1em; padding: 1em;
max-width: 100%; max-width: 100%;
display: -webkit-box; display: -webkit-box;
@ -59,17 +58,16 @@
} }
.masthead__menu { .masthead__menu {
float: left; float: inline-start;
margin-left: 0; margin-inline: 0;
margin-right: 0;
width: 100%; width: 100%;
clear: both; clear: both;
.site-nav { .site-nav {
margin-left: 0; margin-inline-start: 0;
@include breakpoint($small) { @include breakpoint($small) {
float: right; float: inline-end;
} }
} }
@ -87,7 +85,7 @@
white-space: nowrap; white-space: nowrap;
&--lg { &--lg {
padding-right: 2em; padding-inline-end: 2em;
font-weight: 700; font-weight: 700;
} }
} }

48
_sass/minimal-mistakes/_navigation.scss
View File

@ -10,8 +10,7 @@
@include clearfix; @include clearfix;
margin: 0 auto; margin: 0 auto;
max-width: 100%; max-width: 100%;
padding-left: 1em; padding-inline: 1em;
padding-right: 1em;
font-family: $sans-serif; font-family: $sans-serif;
-webkit-animation: $intro-transition; -webkit-animation: $intro-transition;
animation: $intro-transition; animation: $intro-transition;
@ -28,7 +27,7 @@
font-size: $type-size-6; font-size: $type-size-6;
@include breakpoint($large) { @include breakpoint($large) {
float: right; float: inline-end;
width: calc(100% - #{$right-sidebar-width-narrow}); width: calc(100% - #{$right-sidebar-width-narrow});
} }
@ -104,15 +103,15 @@
margin-left: 0; margin-left: 0;
a { a {
border-top-left-radius: $border-radius; border-start-start-radius: $border-radius;
border-bottom-left-radius: $border-radius; border-end-start-radius: $border-radius;
} }
} }
&:last-child { &:last-child {
a { a {
border-top-right-radius: $border-radius; border-start-end-radius: $border-radius;
border-bottom-right-radius: $border-radius; border-end-end-radius: $border-radius;
} }
} }
} }
@ -137,14 +136,14 @@
} }
&:first-child { &:first-child {
border-top-right-radius: 0; border-start-end-radius: 0;
border-bottom-right-radius: 0; border-end-end-radius: 0;
} }
&:last-child { &:last-child {
margin-left: -1px; margin-inline-start: -1px;
border-top-left-radius: 0; border-start-start-radius: 0;
border-bottom-left-radius: 0; border-end-start-radius: 0;
} }
&.disabled { &.disabled {
@ -262,7 +261,7 @@
.hidden-links { .hidden-links {
position: absolute; position: absolute;
top: 100%; top: 100%;
right: 0; inset-inline-end: 0;
margin-top: 15px; margin-top: 15px;
padding: 5px; padding: 5px;
border: 1px solid $border-color; border: 1px solid $border-color;
@ -287,11 +286,11 @@
} }
} }
&:before { &::before {
content: ""; content: "";
position: absolute; position: absolute;
top: -11px; top: -11px;
right: 10px; inset-inline-end: 10px;
width: 0; width: 0;
border-style: solid; border-style: solid;
border-width: 0 10px 10px; border-width: 0 10px 10px;
@ -300,11 +299,11 @@
z-index: 0; z-index: 0;
} }
&:after { &::after {
content: ""; content: "";
position: absolute; position: absolute;
top: -10px; top: -10px;
right: 10px; inset-inline-end: 10px;
width: 0; width: 0;
border-style: solid; border-style: solid;
border-width: 0 10px 10px; border-width: 0 10px 10px;
@ -361,11 +360,11 @@
transition: 0.2s ease-out; transition: 0.2s ease-out;
cursor: pointer; cursor: pointer;
&:before, &::before,
&:after { &::after {
content: ""; content: "";
position: absolute; position: absolute;
right: 1em; inset-inline-end: 1em;
top: 1.25em; top: 1.25em;
width: 0.75em; width: 0.75em;
height: 0.125em; height: 0.125em;
@ -446,9 +445,8 @@
} }
.active { .active {
margin-left: -0.5em; margin-inline-start: -0.5em;
padding-left: 0.5em; padding-inline: 0.5em;
padding-right: 0.5em;
font-weight: bold; font-weight: bold;
} }
@ -516,8 +514,8 @@
color: #fff; color: #fff;
font-size: $type-size-6; font-size: $type-size-6;
background: $primary-color; background: $primary-color;
border-top-left-radius: $border-radius; border-start-start-radius: $border-radius;
border-top-right-radius: $border-radius; border-start-end-radius: $border-radius;
} }
// Scrollspy marks toc items as .active when they are in focus // Scrollspy marks toc items as .active when they are in focus

49
_sass/minimal-mistakes/_page.scss
View File

@ -4,10 +4,8 @@
#main { #main {
@include clearfix; @include clearfix;
margin-left: auto; margin-inline: auto;
margin-right: auto; padding-inline: 1em;
padding-left: 1em;
padding-right: 1em;
-webkit-animation: $intro-transition; -webkit-animation: $intro-transition;
animation: $intro-transition; animation: $intro-transition;
max-width: 100%; max-width: 100%;
@ -37,7 +35,7 @@ body {
.page { .page {
@include breakpoint($large) { @include breakpoint($large) {
float: right; float: inline-end;
width: calc(100% - #{$right-sidebar-width-narrow}); width: calc(100% - #{$right-sidebar-width-narrow});
padding-inline-end: $right-sidebar-width-narrow; padding-inline-end: $right-sidebar-width-narrow;
} }
@ -50,8 +48,7 @@ body {
.page__inner-wrap { .page__inner-wrap {
float: left; float: left;
margin-top: 1em; margin-top: 1em;
margin-left: 0; margin-inline: 0;
margin-right: 0;
width: 100%; width: 100%;
clear: both; clear: both;
@ -59,9 +56,8 @@ body {
.page__meta, .page__meta,
.page__share { .page__share {
position: relative; position: relative;
float: left; float: inline-start;
margin-left: 0; margin-inline: 0;
margin-right: 0;
width: 100%; width: 100%;
clear: both; clear: both;
} }
@ -203,8 +199,7 @@ body {
} }
.wrapper { .wrapper {
padding-left: 1em; padding-inline: 1em;
padding-right: 1em;
@include breakpoint($x-large) { @include breakpoint($x-large) {
max-width: $x-large; max-width: $x-large;
@ -242,14 +237,14 @@ body {
.page__hero-caption { .page__hero-caption {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
right: 0; inset-inline-end: 0;
margin: 0 auto; margin: 0 auto;
padding: 2px 5px; padding: 2px 5px;
color: #fff; color: #fff;
font-family: $caption-font-family; font-family: $caption-font-family;
font-size: $type-size-7; font-size: $type-size-7;
background: #000; background: #000;
text-align: right; text-align: end;
z-index: 5; z-index: 5;
opacity: 0.5; opacity: 0.5;
border-radius: $border-radius 0 0 0; border-radius: $border-radius 0 0 0;
@ -320,8 +315,7 @@ body {
.page__meta-sep::before { .page__meta-sep::before {
content: "\2022"; content: "\2022";
padding-left: 0.5em; padding-inline: 0.5em;
padding-right: 0.5em;
} }
/* /*
@ -417,7 +411,7 @@ body {
color: $muted-text-color; color: $muted-text-color;
font-size: 0.6em; font-size: 0.6em;
text-transform: uppercase; text-transform: uppercase;
text-align: right; text-align: end;
text-decoration: none; text-decoration: none;
} }
@ -427,8 +421,7 @@ body {
.page__comments { .page__comments {
float: left; float: left;
margin-left: 0; margin-inline: 0;
margin-right: 0;
width: 100%; width: 100%;
clear: both; clear: both;
} }
@ -494,7 +487,7 @@ body {
} }
.comment__content-wrapper { .comment__content-wrapper {
float: right; float: inline-end;
width: calc(100% - 60px); width: calc(100% - 60px);
@include breakpoint($large) { @include breakpoint($large) {
@ -556,23 +549,13 @@ body {
========================================================================== */ ========================================================================== */
.wide { .wide {
.page { .page, .page__related {
@include breakpoint($large) { @include breakpoint($large) {
padding-right: 0; padding-inline-end: 0;
} }
@include breakpoint($x-large) { @include breakpoint($x-large) {
padding-right: 0; padding-inline-end: 0;
}
}
.page__related {
@include breakpoint($large) {
padding-right: 0;
}
@include breakpoint($x-large) {
padding-right: 0;
} }
} }
} }

5
_sass/minimal-mistakes/_reset.scss
View File

@ -64,8 +64,6 @@ audio,
canvas, canvas,
video { video {
display: inline-block; display: inline-block;
*display: inline;
*zoom: 1;
} }
/* Prevents modern browsers from displaying 'audio' without controls */ /* Prevents modern browsers from displaying 'audio' without controls */
@ -142,7 +140,6 @@ textarea {
button, button,
input { input {
*overflow: visible; /* inner spacing ie IE6/7*/
line-height: normal; /* FF3/4 have !important on line-height in UA stylesheet*/ line-height: normal; /* FF3/4 have !important on line-height in UA stylesheet*/
} }
@ -184,4 +181,4 @@ input[type="search"]::-webkit-search-cancel-button {
textarea { textarea {
overflow: auto; /* remove vertical scrollbar in IE6-9*/ overflow: auto; /* remove vertical scrollbar in IE6-9*/
vertical-align: top; /* readability and alignment cross-browser*/ vertical-align: top; /* readability and alignment cross-browser*/
} }

9
_sass/minimal-mistakes/_search.scss
View File

@ -9,8 +9,7 @@
} }
.search__toggle { .search__toggle {
margin-left: 1rem; margin-inline: 1rem;
margin-right: 1rem;
height: $nav-toggle-height; height: $nav-toggle-height;
border: 0; border: 0;
outline: none; outline: none;
@ -38,10 +37,8 @@
&__inner-wrap { &__inner-wrap {
width: 100%; width: 100%;
margin-left: auto; margin-inline: auto;
margin-right: auto; padding-inline: 1em;
padding-left: 1em;
padding-right: 1em;
-webkit-animation: $intro-transition; -webkit-animation: $intro-transition;
animation: $intro-transition; animation: $intro-transition;
-webkit-animation-delay: 0.15s; -webkit-animation-delay: 0.15s;

30
_sass/minimal-mistakes/_sidebar.scss
View File

@ -108,12 +108,12 @@
.splash .sidebar__right { .splash .sidebar__right {
@include breakpoint($large) { @include breakpoint($large) {
position: relative; position: relative;
float: right; float: inline-end;
margin-right: 0; margin-inline-end: 0;
} }
@include breakpoint($x-large) { @include breakpoint($x-large) {
margin-right: 0; margin-inline-end: 0;
} }
} }
@ -147,15 +147,13 @@
.author__content { .author__content {
display: table-cell; display: table-cell;
vertical-align: top; vertical-align: top;
padding-left: 15px; padding-inline: 15px 25px;
padding-right: 25px;
line-height: 1; line-height: 1;
@include breakpoint($large) { @include breakpoint($large) {
display: block; display: block;
width: 100%; width: 100%;
padding-left: 0; padding-inline: 0;
padding-right: 0;
} }
a { a {
@ -219,7 +217,7 @@
content: ''; content: '';
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; inset-inline-start: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
pointer-events: none; pointer-events: none;
@ -241,7 +239,7 @@
.author__urls { .author__urls {
display: none; display: none;
position: absolute; position: absolute;
right: 0; inset-inline-end: 0;
margin-top: 15px; margin-top: 15px;
padding: 10px; padding: 10px;
list-style-type: none; list-style-type: none;
@ -265,12 +263,12 @@
box-shadow: none; box-shadow: none;
} }
&:before { &::before {
display: block; display: block;
content: ""; content: "";
position: absolute; position: absolute;
top: -11px; top: -11px;
left: calc(50% - 10px); inset-inline-start: calc(50% - 10px);
width: 0; width: 0;
border-style: solid; border-style: solid;
border-width: 0 10px 10px; border-width: 0 10px 10px;
@ -287,7 +285,7 @@
content: ""; content: "";
position: absolute; position: absolute;
top: -10px; top: -10px;
left: calc(50% - 10px); inset-inline-start: calc(50% - 10px);
width: 0; width: 0;
border-style: solid; border-style: solid;
border-width: 0 10px 10px; border-width: 0 10px 10px;
@ -333,10 +331,10 @@
@include breakpoint($large) { @include breakpoint($large) {
position: initial; position: initial;
top: initial; top: initial;
right: initial; inset-inline-end: initial;
width: initial; width: initial;
margin-right: initial; margin-inline-end: initial;
padding-left: initial; padding-inline-start: initial;
z-index: initial; z-index: initial;
&.sticky { &.sticky {
@ -346,6 +344,6 @@
@include breakpoint($x-large) { @include breakpoint($x-large) {
width: initial; width: initial;
margin-right: initial; margin-inline-end: initial;
} }
} }

8
_sass/minimal-mistakes/_syntax.scss
View File

@ -37,11 +37,11 @@ figure.highlight {
/* line numbers*/ /* line numbers*/
&.gutter, &.gutter,
&.rouge-gutter { &.rouge-gutter {
padding-right: 1em; padding-inline-end: 1em;
width: 1em; width: 1em;
color: $base04; color: $base04;
border-right: 1px solid $base04; border-inline-end: 1px solid $base04;
text-align: right; text-align: end;
} }
/* code */ /* code */
@ -325,4 +325,4 @@ figure.highlight {
th, td { th, td {
border-bottom: 0; border-bottom: 0;
} }
} }

4
_sass/minimal-mistakes/_tables.scss
View File

@ -24,7 +24,7 @@ thead {
th { th {
padding: 0.5em; padding: 0.5em;
font-weight: bold; font-weight: bold;
text-align: left; text-align: start;
} }
td { td {
@ -36,4 +36,4 @@ tr,
td, td,
th { th {
vertical-align: middle; vertical-align: middle;
} }

42
_sass/minimal-mistakes/_utilities.scss
View File

@ -83,20 +83,11 @@ body:hover .visually-hidden button {
Type Type
========================================================================== */ ========================================================================== */
.text-left { $text-alignments: left, right, start, end, center, justify;
text-align: left; @each $alignment in $text-alignments {
} .text-#{$alignment} {
text-align: $alignment;
.text-center { }
text-align: center;
}
.text-right {
text-align: right;
}
.text-justify {
text-align: justify;
} }
.text-nowrap { .text-nowrap {
@ -108,7 +99,7 @@ body:hover .visually-hidden button {
========================================================================== */ ========================================================================== */
.task-list { .task-list {
padding:0; padding: 0;
li { li {
list-style-type: none; list-style-type: none;
@ -135,8 +126,7 @@ body:hover .visually-hidden button {
} }
.wrapper { .wrapper {
margin-left: auto; margin-inline: auto;
margin-right: auto;
width: 100%; width: 100%;
} }
@ -148,8 +138,7 @@ body:hover .visually-hidden button {
.align-left { .align-left {
display: block; display: block;
margin-left: auto; margin-inline: auto;
margin-right: auto;
@include breakpoint($small) { @include breakpoint($small) {
float: left; float: left;
@ -161,8 +150,7 @@ body:hover .visually-hidden button {
.align-right { .align-right {
display: block; display: block;
margin-left: auto; margin-inline: auto;
margin-right: auto;
@include breakpoint($small) { @include breakpoint($small) {
float: right; float: right;
@ -174,8 +162,7 @@ body:hover .visually-hidden button {
.align-center { .align-center {
display: block; display: block;
margin-left: auto; margin-inline: auto;
margin-right: auto;
} }
/* file page content container */ /* file page content container */
@ -533,7 +520,7 @@ pre {
display: block; display: block;
position: absolute; position: absolute;
top: 0.6em; top: 0.6em;
right: 0.5em; inset-inline-end: 0.5em;
width: 1.8em; width: 1.8em;
height: 1.5em; height: 1.5em;
z-index: 1; z-index: 1;
@ -548,17 +535,14 @@ pre {
&::before { &::before {
content: ''; content: '';
position: absolute; position: absolute;
top: 0; inset: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 2; z-index: 2;
} }
i { i {
position: absolute; position: absolute;
top: 0.25em; top: 0.25em;
right: 0.25em; inset-inline-end: 0.25em;
&.copied { &.copied {
opacity: 0; opacity: 0;
} }

8
a.scss Normal file
View File

@ -0,0 +1,8 @@
label,
input,
button,
select,
textarea {
vertical-align: baseline;
*vertical-align: middle;
}