From 0aef07c34527cb9b03b6b047d3880d420ff8ca99 Mon Sep 17 00:00:00 2001
From: Edward <edward@driebit.nl>
Date: Mon, 24 Feb 2025 12:02:04 +0100
Subject: [PATCH] Revert "OEI-70 ginger foundation (#744)"

This reverts commit f0fe2f4ac959a7bfc04de74e778dcfca2e76cb9f.
---
 .../lib/css/src/_base.scss                    |  2 +-
 .../lib/css/src/_mixins.scss                  | 21 ++++++++++++-------
 .../src/blocks/_1page-actions-extends.scss    |  2 +-
 .../lib/css/src/layout/_global-nav.scss       |  2 +-
 .../lib/css/src/layout/_page-actions.scss     |  2 +-
 5 files changed, 17 insertions(+), 12 deletions(-)

diff --git a/modules/mod_ginger_foundation/lib/css/src/_base.scss b/modules/mod_ginger_foundation/lib/css/src/_base.scss
index 5146bde1b..848a261ba 100644
--- a/modules/mod_ginger_foundation/lib/css/src/_base.scss
+++ b/modules/mod_ginger_foundation/lib/css/src/_base.scss
@@ -133,7 +133,7 @@ h3 {
     @include size(margin-bottom, 0);
 }
 
-@include mq(min-width, 900px) {
+@include mq(min-width, 900) {
     h1 {
         @include size(font-size, 41);
         @include size(line-height, 44);
diff --git a/modules/mod_ginger_foundation/lib/css/src/_mixins.scss b/modules/mod_ginger_foundation/lib/css/src/_mixins.scss
index 468741976..7e3fa7343 100644
--- a/modules/mod_ginger_foundation/lib/css/src/_mixins.scss
+++ b/modules/mod_ginger_foundation/lib/css/src/_mixins.scss
@@ -1,7 +1,11 @@
 @use "sass:math";
 
+@function strip-unit($num) {
+    @return math.div($num, $num * 0 + 1);
+}
+
 @function px-to-rem($value) {
-    @return calc(#{$value} * 0.1);
+    @return  $value*0.1;
 }
 
 /* Takes sizes in pixels and outputs both the pixel and rem values for the given property */
@@ -11,10 +15,9 @@
     $remValues: '';
 
     @for $i from 1 through $max {
-        $value: nth($values, $i);
+        $value: strip-unit(nth($values, $i));
         $pxValues: #{$pxValues + $value}px;
-        $pxToRems: px-to-rem(#{$value}rem);
-        $remValues: #{$remValues + $pxToRems};
+        $remValues: #{$remValues + px-to-rem($value)}rem;
 
         @if $i < $max {
             $pxValues: #{$pxValues + " "};
@@ -32,7 +35,9 @@
 
 /* Creates a mediaquery based on property and size in pixels */
 @mixin mq($property, $size) {
-    @media only screen and (#{$property}: $size ) {
+    $value: strip-unit($size);
+
+    @media only screen and (#{$property}: #{$value}px ) {
         @content;
     }
 }
@@ -112,8 +117,8 @@
         &:before {
             content: '';
             display: inline-block;
-            @include size(width, 15);
-            @include size(height, 15);
+            @include size(width, 15px);
+            @include size(height, 15px);
             @include size(margin-right, 15);
             position: relative;
             top: 2px;
@@ -168,7 +173,7 @@
         display: block;
         content: "";
         width: 100%;
-        padding-top: calc(#{$height} / #{$width} * 100%);
+        padding-top: math.div($height, $width) * 100%;
     }
 
     > div {
diff --git a/modules/mod_ginger_foundation/lib/css/src/blocks/_1page-actions-extends.scss b/modules/mod_ginger_foundation/lib/css/src/blocks/_1page-actions-extends.scss
index 8c2750351..0436d8468 100644
--- a/modules/mod_ginger_foundation/lib/css/src/blocks/_1page-actions-extends.scss
+++ b/modules/mod_ginger_foundation/lib/css/src/blocks/_1page-actions-extends.scss
@@ -3,7 +3,7 @@
     @include size(margin-bottom, 10);
 }
 
-@include mq(min-width, 900px) {
+@include mq(min-width, 900) {
     .page-action-elements {
         margin-top: 0px;
         @include size(margin-bottom, 10);
diff --git a/modules/mod_ginger_foundation/lib/css/src/layout/_global-nav.scss b/modules/mod_ginger_foundation/lib/css/src/layout/_global-nav.scss
index 3deec8eb7..271c06692 100644
--- a/modules/mod_ginger_foundation/lib/css/src/layout/_global-nav.scss
+++ b/modules/mod_ginger_foundation/lib/css/src/layout/_global-nav.scss
@@ -297,7 +297,7 @@
     }
 }
 
-@include mq(max-height, 500px) {
+@include mq(max-height, 500) {
     .is-open .global-nav__menu {
         height: calc(100% - (#{$globalNavHeight + $globalNavHeight}px));
         overflow-y: scroll;
diff --git a/modules/mod_ginger_foundation/lib/css/src/layout/_page-actions.scss b/modules/mod_ginger_foundation/lib/css/src/layout/_page-actions.scss
index a7b0788d4..fdbca0abb 100644
--- a/modules/mod_ginger_foundation/lib/css/src/layout/_page-actions.scss
+++ b/modules/mod_ginger_foundation/lib/css/src/layout/_page-actions.scss
@@ -20,7 +20,7 @@
     display: inline-block;
 }
 
-@include mq(min-width, 900px) {
+@include mq(min-width, 900) {
     .page-actions__author {
         @include size(margin-bottom, 10);
     }