Fix the remaining issues with CSS logical properties

minyoongi96 · Aug 26, 2024 · c40d8e8 · c40d8e8
1 parent f993d2b
commit c40d8e8
Show file tree

Hide file tree

Showing 7 changed files with 29 additions and 28 deletions.
diff --git a/_sass/minimal-mistakes/_archive.scss b/_sass/minimal-mistakes/_archive.scss
@@ -370,7 +370,7 @@
     font-size: 1.125em;
 
     .archive__item {
-      float: left;
+      float: inline-start;
       width: 100%;
     }
 

diff --git a/_sass/minimal-mistakes/_forms.scss b/_sass/minimal-mistakes/_forms.scss
@@ -305,14 +305,14 @@ select:focus {
 .form-search .radio,
 .form-search .checkbox,
 .form-inline .radio {
-  padding-left: 0;
+  padding-inline-start: 0;
   margin-bottom: 0;
   vertical-align: middle;
 }
 
 .form-search .radio input[type="radio"],
 .form-search .checkbox input[type="checkbox"] {
-  float: left;
+  float: inline-start;
   margin-inline-start: 0;
   margin-inline-end: 3px;
 }
@@ -332,7 +332,7 @@ select:focus {
 .form::before {
   position: absolute;
   top: 0;
-  left: 0;
+  inset-inline-start: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(255, 255, 255, 0.7);
@@ -343,6 +343,6 @@ select:focus {
   display: none;
   position: absolute;
   top: 50%;
-  left: 50%;
+  inset-inline-start: 50%;
   z-index: 11;
 }
diff --git a/_sass/minimal-mistakes/_navigation.scss b/_sass/minimal-mistakes/_navigation.scss
@@ -51,7 +51,7 @@
 
 .pagination {
   @include clearfix();
-  float: left;
+  float: inline-start;
   margin-top: 1em;
   padding-top: 1em;
   width: 100%;
@@ -65,8 +65,8 @@
 
   li {
     display: block;
-    float: left;
-    margin-left: -1px;
+    float: inline-start;
+    margin-inline-start: -1px;
 
     a {
       display: block;
@@ -100,7 +100,7 @@
     }
 
     &:first-child {
-      margin-left: 0;
+      margin-inline-start: 0;
 
       a {
         border-start-start-radius: $border-radius;
@@ -120,7 +120,7 @@
   &--pager {
     display: block;
     padding: 1em 2em;
-    float: left;
+    float: inline-start;
     width: 50%;
     font-family: $sans-serif;
     font-size: $type-size-5;
@@ -239,7 +239,7 @@
       &:before {
         content: "";
         position: absolute;
-        left: 0;
+        inset-inline-start: 0;
         bottom: 0;
         height: 4px;
         background: $primary-color;

diff --git a/_sass/minimal-mistakes/_notices.scss b/_sass/minimal-mistakes/_notices.scss
@@ -54,7 +54,7 @@
   }
 
   @at-root #{selector-unify(&, "blockquote")} {
-    border-left-color: mix(#000, $notice-color, 10%);
+    border-inline-start-color: mix(#000, $notice-color, 10%);
   }
 
   code {

diff --git a/_sass/minimal-mistakes/_page.scss b/_sass/minimal-mistakes/_page.scss
@@ -46,7 +46,7 @@ body {
   }
 
   .page__inner-wrap {
-    float: left;
+    float: inline-start;
     margin-top: 1em;
     margin-inline: 0;
     width: 100%;
@@ -156,7 +156,7 @@ body {
   }
 
   dd {
-    margin-left: 1em;
+    margin-inline-start: 1em;
     font-family: $sans-serif;
     font-size: $type-size-6;
   }
@@ -168,7 +168,7 @@ body {
   /* blockquote citations */
   blockquote + .small {
     margin-top: -1.5em;
-    padding-left: 1.25rem;
+    padding-inline-start: 1.25rem;
   }
 }
 
@@ -420,7 +420,7 @@ body {
    ========================================================================== */
 
 .page__comments {
-  float: left;
+  float: inline-start;
   margin-inline: 0;
   width: 100%;
   clear: both;
@@ -463,7 +463,7 @@ body {
 }
 
 .comment__avatar-wrapper {
-  float: left;
+  float: inline-start;
   width: 60px;
   height: 60px;
 

diff --git a/_sass/minimal-mistakes/_syntax.scss b/_sass/minimal-mistakes/_syntax.scss
@@ -15,6 +15,7 @@ figure.highlight {
 
   [dir=rtl] & {
     direction: ltr;
+    text-align: start;
   }
 
   > pre,
@@ -47,7 +48,7 @@ figure.highlight {
     /* code */
     &.code,
     &.rouge-code {
-      padding-left: 1em;
+      padding-inline-start: 1em;
     }
   }
 

diff --git a/_sass/minimal-mistakes/_utilities.scss b/_sass/minimal-mistakes/_utilities.scss
@@ -112,7 +112,7 @@ $text-alignments: left, right, start, end, center, justify;
 }
 
 .task-list .task-list {
-  margin-left: 1em;
+  margin-inline-start: 1em;
 }
 
 /*
@@ -243,11 +243,11 @@ $text-alignments: left, right, start, end, center, justify;
   -webkit-transition: 0.3s;
   transition: 0.3s;
 
-  &:before,
-  &:after {
+  &::before,
+  &::after {
     content: "";
     position: absolute;
-    left: 0;
+    inset-inline-start: 0;
     width: $navicon-width;
     height: $navicon-height;
     background: $primary-color;
@@ -295,7 +295,7 @@ $text-alignments: left, right, start, end, center, justify;
       content: '';
       position: fixed;
       top: 0;
-      left: 0;
+      inset-inline-start: 0;
       width: 100%;
       height: 100%;
       opacity: 0;
@@ -369,11 +369,11 @@ $text-alignments: left, right, start, end, center, justify;
   overflow: hidden;
   position: relative;
 
-  &:before {
+  &::before {
     position: absolute;
     content: "";
     top: 0;
-    left: 0;
+    inset-inline-start: 0;
     width: 100%;
     height: 100%;
     z-index: 999;
@@ -390,8 +390,8 @@ $text-alignments: left, right, start, end, center, justify;
   position: fixed;
   width: 300px;
   top: 50%;
-  left: 50%;
-  margin-left: -150px;
+  inset-inline-start: 50%;
+  margin-inline-start: -150px;
   margin-top: -150px;
   min-height: 0;
   z-index: 9999;
@@ -482,7 +482,7 @@ a.reversefootnote {
   embed {
     position: absolute;
     top: 0;
-    left: 0;
+    inset-inline-start: 0;
     width: 100%;
     height: 100%;
   }