Qol 8391 styles update (#451)

* styles update * styles update * styles update * changed to rem
qld-gov-au · Apr 7, 2022 · 4bbc9cf · 4bbc9cf
1 parent b6e486a
commit 4bbc9cf
Show file tree

Hide file tree

Showing 3 changed files with 1,689 additions and 13 deletions.
diff --git a/src/assets/_project/_blocks/components/forms/_qg-forms.scss b/src/assets/_project/_blocks/components/forms/_qg-forms.scss
@@ -42,10 +42,6 @@
     }
   }
 
-  //[type="checkbox"]:checked + label .rc-theme__icon, [type="radio"]:checked + label .rc-theme__icon {
-  //  background-color: #007eb1 !important;
-  //  fill: #fff;
-  //}
   &.choices {
     li {
       width: 255px;
@@ -190,23 +186,38 @@
     color: $labelHeadingColour;
     font-weight: $labelHeadingWeight;
   }
+  .qg-forms-v2__checkbox, .qg-forms-v2__radio {
+    label {
+      margin-bottom: rem(14px);
+    }
+    input[type=radio], input[type=checkbox] {
+      top:0;
+    }
+  }
   .checkbox, .qg-forms-v2__checkbox,
   .form-radio, .qg-forms-v2__radio {
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    margin: 0;
+    .radio {
+      margin: 0;
+    }
     div.form-check {
       padding-bottom: $defaultRem;
+      padding-left: 0
     }
     input[type=radio], input[type=checkbox] {
-      width: 25px;
-      height: 25px;
+      width: rem(25px);
+      height: rem(25px);
       padding-right: 1rem;
-      top: $none;
-      margin-top: $none;
+      margin-top: 0;
       border-radius: $borderRadius;
       border-width: $borderWidth;
       float: left;
     }
     label {
-      margin-left: rem(12px);
+      font-weight: normal;
+      margin-left: rem(16px);
       display: inline-block;
       span {
         font-weight: $checkboxWeight;
@@ -228,8 +239,12 @@
   .formio-hidden {
     margin-bottom: 0 !important;
   }
+  .invalid .alert{
+    font-weight: normal;
+  }
   .alert {
     margin-bottom: $defaultRem;
+    font-size: rem(16px);
   }
   .text-muted {
     color: $hintColour;
@@ -275,7 +290,7 @@
     color: white !important;
     background-color: white !important;
     border-color: white !important;
-    padding: $none;
+    padding: 0;
   }
 
   //error labels
@@ -353,7 +368,7 @@
   //Workarounds -----------------------------------------------------
   //Workarounds for instances where panel/card is applied to form body
   .border {
-    border: $none;
+    border: 0;
   }
   .card {
     position: relative;

diff --git a/src/assets/_project/_blocks/scss-general/_qg-variables.scss b/src/assets/_project/_blocks/scss-general/_qg-variables.scss
@@ -190,7 +190,7 @@ $tables-paginate-enabled-previous-next-color: #111111;
 
 // forms
 $fontFace: inherit;
-$defaultRem: 1rem !important;
+$defaultRem: 1rem;
 
 $labelHeadingColour: #000;
 $labelHeadingSize: 20px;
@@ -205,7 +205,6 @@ $hintColour: #767676 !important;
 $hintWeight: 400;
 $borderRadius: 4px;
 $borderWidth: 3px;
-$none: 0px !important;
 $checkboxWeight: 400;
 
 $inputHeight: 46px;