fix[cloe #187]: fix rest of depricated things

GabsEdits · GabsEdits · commit 62e1f5facc9d · 2025-05-01T16:45:59.000+03:00
diff --git a/docs/.vitepress/theme/custom.scss b/docs/.vitepress/theme/custom.scss
@@ -27,15 +27,18 @@
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(30%, 1fr));
     margin: 0;
+    gap: 0.625rem;
 
     @media screen and (max-width: 37.5rem) {
       grid-template-columns: repeat(auto-fit, minmax(50%, 1fr));
     }
 
     & {
-      gap: 0.625rem;
       padding: 0;
-      min-width: 100%;
+
+      & {
+        min-width: 100%;
+      }
     }
 
     li {
@@ -184,13 +187,15 @@ input[type="checkbox"] {
   padding: 0;
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(30%, 1fr));
+  gap: 0.625rem;
 
   @media screen and (max-width: 37.5rem) {
     grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
   }
 
-  min-width: 100%;
-  gap: 0.625rem;
+  & {
+    min-width: 100%;
+  }
 
   li {
     list-style: none;
diff --git a/src/styles/_color.scss b/src/styles/_color.scss
@@ -30,7 +30,7 @@ $bg-color-m-d: color.scale($bg-color-s-d, $lightness: 5%) !default;
 $bg-color-accent-alpha: color.scale($color-accent, $alpha: -60%) !default;
 
 $bg-color-code-l: color.scale($bg-color-l, $lightness: -5%) !default;
-$bg-color-code-d: mix($bg-color-d, $bg-color-s-d, 60%) !default;
+$bg-color-code-d: color.mix($bg-color-d, $bg-color-s-d, 60%) !default;
 
 $nav-bg-l: color.scale(
   $bg-color-s-l,
diff --git a/src/styles/_common.scss b/src/styles/_common.scss
@@ -23,7 +23,7 @@ pre {
 
   code {
     border: 0;
-    @include roundedNone;
+    @include variables.roundedNone;
     background-color: transparent;
     padding: 0;
     color: var(--color-text);
@@ -110,7 +110,7 @@ video {
 
 video:hover {
   transform: scale(1.06);
-  @include roundedNone;
+  @include variables.roundedNone;
 }
 
 figcaption {
@@ -124,7 +124,7 @@ figcaption {
 
 hr {
   margin: 1.25rem 5%;
-  @include borderBasic(0.125rem);
+  @include variables.borderBasic(0.125rem);
   border-radius: var(--rounded);
 }
 
diff --git a/src/styles/_typography.scss b/src/styles/_typography.scss
@@ -172,7 +172,7 @@ main {
 
 button {
   cursor: pointer;
-  @include noBasicStyles;
+  @include variables.noBasicStyles;
 }
 
 abbr {
diff --git a/src/styles/components/_images.scss b/src/styles/components/_images.scss
@@ -9,7 +9,7 @@
     box-shadow: none;
 
     & {
-      @include roundedNone;
+      @include variables.roundedNone;
     }
   }
 
@@ -18,7 +18,7 @@
     box-shadow: none;
 
     & {
-      @include roundedNone;
+      @include variables.roundedNone;
     }
   }
 }
@@ -29,18 +29,18 @@ img {
     max-width: 100%;
 
     & {
-      @include roundedNone;
+      @include variables.roundedNone;
     }
   }
 
   &[src*="#not-rounded"] {
     & {
-      @include roundedNone;
+      @include variables.roundedNone;
     }
 
     &:hover {
       & {
-        @include roundedNone;
+        @include variables.roundedNone;
       }
     }
   }
@@ -105,14 +105,14 @@ img {
     border: none;
 
     & {
-      @include roundedNone;
+      @include variables.roundedNone;
     }
 
     &:hover {
       box-shadow: none;
       border: 0;
       & {
-        @include roundedNone;
+        @include variables.roundedNone;
       }
     }
   }
@@ -128,7 +128,7 @@ img {
     width: 100vw;
     max-width: 100vw;
     & {
-      @include roundedNone;
+      @include variables.roundedNone;
     }
 
     & {
@@ -152,11 +152,11 @@ img {
 }
 
 a img {
-  @include borderBasic(1px);
+  @include variables.borderBasic(1px);
 
   &:hover {
     cursor: pointer;
-    @include borderBasic(2px);
+    @include variables.borderBasic(2px);
   }
 
   &[src*="#no-border"] {

Original file line number	Diff line number	Diff line change
`@@ -172,7 +172,7 @@ main {`
`172`	`172`
`173`	`173`	`button {`
`174`	`174`	`cursor: pointer;`
`175`		`- @include noBasicStyles;`
	`175`	`+ @include variables.noBasicStyles;`
`176`	`176`	`}`
`177`	`177`
`178`	`178`	`abbr {`
Original file line number	Diff line number	Diff line change
`@@ -9,7 +9,7 @@`
`9`	`9`	`box-shadow: none;`
`10`	`10`
`11`	`11`	`& {`
`12`		`- @include roundedNone;`
	`12`	`+ @include variables.roundedNone;`
`13`	`13`	`}`
`14`	`14`	`}`
`15`	`15`
`@@ -18,7 +18,7 @@`
`18`	`18`	`box-shadow: none;`
`19`	`19`
`20`	`20`	`& {`
`21`		`- @include roundedNone;`
	`21`	`+ @include variables.roundedNone;`
`22`	`22`	`}`
`23`	`23`	`}`
`24`	`24`	`}`
`@@ -29,18 +29,18 @@ img {`
`29`	`29`	`max-width: 100%;`
`30`	`30`
`31`	`31`	`& {`
`32`		`- @include roundedNone;`
	`32`	`+ @include variables.roundedNone;`
`33`	`33`	`}`
`34`	`34`	`}`
`35`	`35`
`36`	`36`	`&[src*="#not-rounded"] {`
`37`	`37`	`& {`
`38`		`- @include roundedNone;`
	`38`	`+ @include variables.roundedNone;`
`39`	`39`	`}`
`40`	`40`
`41`	`41`	`&:hover {`
`42`	`42`	`& {`
`43`		`- @include roundedNone;`
	`43`	`+ @include variables.roundedNone;`
`44`	`44`	`}`
`45`	`45`	`}`
`46`	`46`	`}`
`@@ -105,14 +105,14 @@ img {`
`105`	`105`	`border: none;`
`106`	`106`
`107`	`107`	`& {`
`108`		`- @include roundedNone;`
	`108`	`+ @include variables.roundedNone;`
`109`	`109`	`}`
`110`	`110`
`111`	`111`	`&:hover {`
`112`	`112`	`box-shadow: none;`
`113`	`113`	`border: 0;`
`114`	`114`	`& {`
`115`		`- @include roundedNone;`
	`115`	`+ @include variables.roundedNone;`
`116`	`116`	`}`
`117`	`117`	`}`
`118`	`118`	`}`
`@@ -128,7 +128,7 @@ img {`
`128`	`128`	`width: 100vw;`
`129`	`129`	`max-width: 100vw;`
`130`	`130`	`& {`
`131`		`- @include roundedNone;`
	`131`	`+ @include variables.roundedNone;`
`132`	`132`	`}`
`133`	`133`
`134`	`134`	`& {`
`@@ -152,11 +152,11 @@ img {`
`152`	`152`	`}`
`153`	`153`
`154`	`154`	`a img {`
`155`		`- @include borderBasic(1px);`
	`155`	`+ @include variables.borderBasic(1px);`
`156`	`156`
`157`	`157`	`&:hover {`
`158`	`158`	`cursor: pointer;`
`159`		`- @include borderBasic(2px);`
	`159`	`+ @include variables.borderBasic(2px);`
`160`	`160`	`}`
`161`	`161`
`162`	`162`	`&[src*="#no-border"] {`