replace dimension-layout tokens with temporary explicit values

chukarave · chukarave · commit c8d8de4bcf5b · 2023-12-21T10:53:18.000+01:00
diff --git a/resources/sass/app.scss b/resources/sass/app.scss
@@ -23,49 +23,49 @@ body {
 */
 main {
     max-width: 1090px;
-    padding: 0 $dimension-layout-xsmall;
+    padding: 0 1rem;
     margin: 0 auto;
 
     & > header {
         display: flex;
         justify-content: space-between;
-        margin: $dimension-layout-small 0;
+        margin: 1.500rem 0;
     }
 
     @media(min-width: $min-width-breakpoint-tablet){
-        padding: 0 $dimension-layout-small;
+        padding: 0 1.500rem;
     }
 }
 
 section {
-    margin-bottom: $dimension-layout-large;
+    margin-bottom: 2.500rem;
 }
 
 h1, .h1 {
     @include heading-1;
 
-    margin: $dimension-layout-xsmall 0;
+    margin: 1rem 0;
 
     @media (min-width: $min-width-breakpoint-tablet) {
-        margin: $dimension-layout-small 0;
+        margin: 1rem 0;
     }
 }
 
 h4, .h4 {
-    margin: $dimension-layout-xxsmall 0;
+    margin: 0.500rem 0;
     @include heading-4;
 
     @media(min-width: $min-width-breakpoint-tablet){
-        margin: $dimension-layout-xsmall 0;
+        margin: 1rem 0;
     }
 }
 
 h5, .h5 {
-    margin: $dimension-layout-xxsmall 0;
+    margin: 0.500rem 0;
     @include heading-5;
 
     @media(min-width: $min-width-breakpoint-tablet){
-        margin: $dimension-layout-xsmall 0;
+        margin: 1rem 0;
     }
 }
 
@@ -102,7 +102,7 @@ li {
 
 // this ensures that there will be a space if there is more than one message
 #message-section .cdx-message:not(:nth-child(1)) {
-    margin-top: $dimension-layout-xsmall;
+    margin-top: 1rem;
 }
 
 /**
@@ -121,7 +121,6 @@ li {
 
     .auth-widget {
         display: flex;
-        color: $color-base-50;
 
         .username {
             margin-inline-end: $dimension-spacing-xlarge;
@@ -133,7 +132,7 @@ li {
         }
 
         @media (max-width: $max-width-breakpoint-tablet) {
-            margin-bottom: $dimension-layout-xsmall;
+            margin-bottom: 1rem;
         }
     }
 }

Original file line number	Diff line number	Diff line change
`@@ -23,49 +23,49 @@ body {`
`23`	`23`	`*/`
`24`	`24`	`main {`
`25`	`25`	`max-width: 1090px;`
`26`		`- padding: 0 $dimension-layout-xsmall;`
	`26`	`+ padding: 0 1rem;`
`27`	`27`	`margin: 0 auto;`
`28`	`28`
`29`	`29`	`& > header {`
`30`	`30`	`display: flex;`
`31`	`31`	`justify-content: space-between;`
`32`		`- margin: $dimension-layout-small 0;`
	`32`	`+ margin: 1.500rem 0;`
`33`	`33`	`}`
`34`	`34`
`35`	`35`	`@media(min-width: $min-width-breakpoint-tablet){`
`36`		`- padding: 0 $dimension-layout-small;`
	`36`	`+ padding: 0 1.500rem;`
`37`	`37`	`}`
`38`	`38`	`}`
`39`	`39`
`40`	`40`	`section {`
`41`		`- margin-bottom: $dimension-layout-large;`
	`41`	`+ margin-bottom: 2.500rem;`
`42`	`42`	`}`
`43`	`43`
`44`	`44`	`h1, .h1 {`
`45`	`45`	`@include heading-1;`
`46`	`46`
`47`		`- margin: $dimension-layout-xsmall 0;`
	`47`	`+ margin: 1rem 0;`
`48`	`48`
`49`	`49`	`@media (min-width: $min-width-breakpoint-tablet) {`
`50`		`- margin: $dimension-layout-small 0;`
	`50`	`+ margin: 1rem 0;`
`51`	`51`	`}`
`52`	`52`	`}`
`53`	`53`
`54`	`54`	`h4, .h4 {`
`55`		`- margin: $dimension-layout-xxsmall 0;`
	`55`	`+ margin: 0.500rem 0;`
`56`	`56`	`@include heading-4;`
`57`	`57`
`58`	`58`	`@media(min-width: $min-width-breakpoint-tablet){`
`59`		`- margin: $dimension-layout-xsmall 0;`
	`59`	`+ margin: 1rem 0;`
`60`	`60`	`}`
`61`	`61`	`}`
`62`	`62`
`63`	`63`	`h5, .h5 {`
`64`		`- margin: $dimension-layout-xxsmall 0;`
	`64`	`+ margin: 0.500rem 0;`
`65`	`65`	`@include heading-5;`
`66`	`66`
`67`	`67`	`@media(min-width: $min-width-breakpoint-tablet){`
`68`		`- margin: $dimension-layout-xsmall 0;`
	`68`	`+ margin: 1rem 0;`
`69`	`69`	`}`
`70`	`70`	`}`
`71`	`71`
`@@ -102,7 +102,7 @@ li {`
`102`	`102`
`103`	`103`	`// this ensures that there will be a space if there is more than one message`
`104`	`104`	`#message-section .cdx-message:not(:nth-child(1)) {`
`105`		`- margin-top: $dimension-layout-xsmall;`
	`105`	`+ margin-top: 1rem;`
`106`	`106`	`}`
`107`	`107`
`108`	`108`	`/**`
`@@ -121,7 +121,6 @@ li {`
`121`	`121`
`122`	`122`	`.auth-widget {`
`123`	`123`	`display: flex;`
`124`		`- color: $color-base-50;`
`125`	`124`
`126`	`125`	`.username {`
`127`	`126`	`margin-inline-end: $dimension-spacing-xlarge;`
`@@ -133,7 +132,7 @@ li {`
`133`	`132`	`}`
`134`	`133`
`135`	`134`	`@media (max-width: $max-width-breakpoint-tablet) {`
`136`		`- margin-bottom: $dimension-layout-xsmall;`
	`135`	`+ margin-bottom: 1rem;`
`137`	`136`	`}`
`138`	`137`	`}`
`139`	`138`	`}`