From 1e67773e63ffb304cc02504393f4502c720bf6a5 Mon Sep 17 00:00:00 2001
From: Herman Steuernagel <herman@xmmedia.com>
Date: Mon, 25 Nov 2024 09:33:52 -0800
Subject: [PATCH] migrate sass

---
 .idea/Starter - Symfony 4.iml              |  5 +--
 public/css/admin.scss                      | 39 +++++++++++-----------
 public/css/admin/_header.scss              | 10 ++++--
 public/css/admin/_sidebar_nav_submenu.scss |  4 +--
 public/css/common/_common.scss             |  3 --
 public/css/user.scss                       | 31 ++++++++---------
 public/css/user/_header.scss               |  2 ++
 7 files changed, 50 insertions(+), 44 deletions(-)

diff --git a/.idea/Starter - Symfony 4.iml b/.idea/Starter - Symfony 4.iml
index 6a6229b13..fc7501dc9 100644
--- a/.idea/Starter - Symfony 4.iml	
+++ b/.idea/Starter - Symfony 4.iml	
@@ -2,8 +2,8 @@
 <module type="WEB_MODULE" version="4">
   <component name="NewModuleRootManager">
     <content url="file://$MODULE_DIR$">
-      <sourceFolder url="file://$MODULE_DIR$/src" isTestSource="false" packagePrefix="App\" />
-      <sourceFolder url="file://$MODULE_DIR$/tests" isTestSource="true" packagePrefix="App\Tests\" />
+      <sourceFolder url="file://$MODULE_DIR$/tests" isTestSource="true" />
+      <sourceFolder url="file://$MODULE_DIR$/spec" isTestSource="true" />
       <excludeFolder url="file://$MODULE_DIR$/bin" />
       <excludeFolder url="file://$MODULE_DIR$/coverage" />
       <excludeFolder url="file://$MODULE_DIR$/var" />
@@ -234,6 +234,7 @@
       <excludeFolder url="file://$MODULE_DIR$/vendor/ergebnis/json-schema-validator" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/justinrainbow/json-schema" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/localheinz/diff" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/marc-mabe/php-enum-phpstan" />
     </content>
     <orderEntry type="inheritedJdk" />
     <orderEntry type="sourceFolder" forTests="false" />
diff --git a/public/css/admin.scss b/public/css/admin.scss
index 66f377a71..529d5f706 100755
--- a/public/css/admin.scss
+++ b/public/css/admin.scss
@@ -1,3 +1,4 @@
+@use "sass:meta";
 @tailwind base;
 @tailwind components;
 
@@ -6,7 +7,7 @@
 
 $header-height: 3.72rem;
 
-@import "common/common";
+@include meta.load-css("common/common");
 
 // global styles on the most common elements
 html {
@@ -23,25 +24,25 @@ body {
 }
 
 // load common styles
-@import "common/forms",
-    "common/radios",
-    "common/alerts",
-    "common/headings",
-    "common/modal",
-    "common/button_pair",
-    "common/loading";
+@include meta.load-css("common/forms");
+@include meta.load-css("common/radios");
+@include meta.load-css("common/alerts");
+@include meta.load-css("common/headings");
+@include meta.load-css("common/modal");
+@include meta.load-css("common/button_pair");
+@include meta.load-css("common/loading");
 
 // admin only styles
-@import "admin/content",
-    "admin/headings",
-    "admin/buttons",
-    "admin/header",
-    "admin/forms",
-    "admin/record_list",
-    "admin/record_view",
-    "admin/sidebar_nav",
-    "admin/sidebar_nav_submenu",
-    "admin/dashboard",
-    "admin/password";
+@include meta.load-css("admin/content");
+@include meta.load-css("admin/headings");
+@include meta.load-css("admin/buttons");
+@include meta.load-css("admin/header");
+@include meta.load-css("admin/forms");
+@include meta.load-css("admin/record_list");
+@include meta.load-css("admin/record_view");
+@include meta.load-css("admin/sidebar_nav");
+@include meta.load-css("admin/sidebar_nav_submenu");
+@include meta.load-css("admin/dashboard");
+@include meta.load-css("admin/password");
 
 @tailwind utilities;
diff --git a/public/css/admin/_header.scss b/public/css/admin/_header.scss
index de943d8a9..674c4521c 100755
--- a/public/css/admin/_header.scss
+++ b/public/css/admin/_header.scss
@@ -1,14 +1,18 @@
+:root {
+    --header-height: 3.72rem;
+}
+
 .header-wrap {
     @apply flex flex-col md:flex-row justify-between items-end md:items-center py-2 md:py-0 bg-gray-100 border-b border-gray-300;
-    min-height: $header-height + 3.5;
+    min-height: calc(var(--header-height) + 3.5rem);
     @screen xs {
-        min-height: $header-height;
+        min-height: var(--header-height);
     }
 }
 
 .header-wrap-small {
     @apply flex lg:hidden justify-between items-center relative z-10 pt-4 text-white bg-black border-b border-gray-400;
-    height: $header-height;
+    height: var(--header-height);
 
     a {
         @apply text-white;
diff --git a/public/css/admin/_sidebar_nav_submenu.scss b/public/css/admin/_sidebar_nav_submenu.scss
index 2110277d1..f8a0b473c 100755
--- a/public/css/admin/_sidebar_nav_submenu.scss
+++ b/public/css/admin/_sidebar_nav_submenu.scss
@@ -1,6 +1,6 @@
 .sidebar_nav-submenu-wrap {
     @apply fixed top-0 left-0 right-0 z-0 w-40 h-full opacity-0 invisible text-left bg-gray-800;
-    margin-top: $header-height;
+    margin-top: var(--header-height);
     @screen lg {
         @apply w-64 mt-0;
     }
@@ -14,7 +14,7 @@
 }
 .sidebar_nav-submenu_header {
     @apply text-lg font-extralight border-b border-gray-600;
-    min-height: $header-height;
+    min-height: var(--header-height);
     padding: 1.25rem 0 1rem 1rem;
     @screen lg {
         @apply text-2xl;
diff --git a/public/css/common/_common.scss b/public/css/common/_common.scss
index 6bb53f941..d59916dc1 100755
--- a/public/css/common/_common.scss
+++ b/public/css/common/_common.scss
@@ -1,6 +1,3 @@
-/* this file is for public and private/admin pages */
-@import "media";
-
 a, .button-link {
     @apply text-blue-500 text-left no-underline transition-default;
     &:hover, &:active {
diff --git a/public/css/user.scss b/public/css/user.scss
index 4663ac209..32cda43e9 100755
--- a/public/css/user.scss
+++ b/public/css/user.scss
@@ -1,9 +1,10 @@
+@use "sass:meta";
 @tailwind base;
 @tailwind components;
 
 @import '../../node_modules/vue-multiselect/dist/vue-multiselect.css';
 
-@import "common/common";
+@include meta.load-css("common/common");
 
 // global styles on the most common elements
 html {
@@ -11,22 +12,22 @@ html {
 }
 
 // common styles
-@import "common/alerts",
-    "common/content_alignment",
-    "common/content",
-    "common/headings",
-    "common/forms",
-    "common/radios",
-    "common/modal",
-    "common/embed",
-    "common/loading";
+@include meta.load-css("common/alerts");
+@include meta.load-css("common/content_alignment");
+@include meta.load-css("common/content");
+@include meta.load-css("common/headings");
+@include meta.load-css("common/forms");
+@include meta.load-css("common/radios");
+@include meta.load-css("common/modal");
+@include meta.load-css("common/embed");
+@include meta.load-css("common/loading");
 
 // public only styles
-@import "user/buttons",
-    "user/headings",
-    "user/header",
-    "user/footer",
-    "user/forms";
+@include meta.load-css("user/buttons");
+@include meta.load-css("user/headings");
+@include meta.load-css("user/header");
+@include meta.load-css("user/footer");
+@include meta.load-css("user/forms");
 
 // page specific
 //@import ;
diff --git a/public/css/user/_header.scss b/public/css/user/_header.scss
index 285a266ed..efa388aa3 100755
--- a/public/css/user/_header.scss
+++ b/public/css/user/_header.scss
@@ -1,3 +1,5 @@
+@use "../common/media";
+
 .header_nav-nav {
     @apply flex justify-center divide-x divide-gray-500 list-none pl-0;
     a {