refactor(css): variablize

cal-itp · Aug 1, 2023 · 9d81cb6 · 9d81cb6
1 parent 4256645
commit 9d81cb6
Showing 1 changed file with 3 additions and 7 deletions.
diff --git a/benefits/static/css/styles.css b/benefits/static/css/styles.css
@@ -664,12 +664,14 @@ a.card:focus-visible {
 :root {
   --modal-title-font-size: var(--font-size-24px);
   --modal-border-radius: 8px;
+  --modal-body-top: -36px;
 }
 
 @media (min-width: 992px) {
   :root {
     --modal-title-font-size: var(--font-size-35px);
     --modal-border-radius: 4px;
+    --modal-body-top: 0;
   }
 }
 
@@ -712,16 +714,10 @@ a.card:focus-visible {
 }
 
 .modal-body {
-  top: -36px;
+  top: var(--modal-body-top);
   z-index: 1056;
 }
 
-@media (min-width: 992px) {
-  .modal-body {
-    top: 0;
-  }
-}
-
 /* Modal Trigger */
 /* All links/image buttons that open modals have a question mark icon after them */
 /* Buttons that open modals (like the Agency Selector) do not have the icon */