chore: GH pages deploy test 9

ably · Mar 18, 2024 · e8ab911 · e8ab911
1 parent 2fae9f7
commit e8ab911
Show file tree

Hide file tree

Showing 3 changed files with 236 additions and 242 deletions.
diff --git a/src/core/styles.components.css b/src/core/styles.components.css
@@ -3,33 +3,31 @@
 @import "./styles/text.css";
 @import "./styles/forms.css";
 
-@layer components {
-  .ui-input {
-    @apply text-p2 font-medium bg-light-grey rounded p-input w-full leading-none appearance-none border border-mid-grey transition-input;
-    @apply hover:bg-white hover:shadow-input hover:border-transparent;
-    @apply focus:bg-white focus:shadow-input focus:border-transparent focus:outline-gui-focus;
-    @apply max-w-screen-sm;
-  }
+.ui-input {
+  @apply text-p2 font-medium bg-light-grey rounded p-input w-full leading-none appearance-none border border-mid-grey transition-input;
+  @apply hover:bg-white hover:shadow-input hover:border-transparent;
+  @apply focus:bg-white focus:shadow-input focus:border-transparent focus:outline-gui-focus;
+  @apply max-w-screen-sm;
+}
 
-  /* Basis for icon component */
-  .ui-icon-cool-black {
-    stroke: var(--color-cool-black);
-  }
+/* Basis for icon component */
+.ui-icon-cool-black {
+  stroke: var(--color-cool-black);
+}
 
-  .ui-icon-white {
-    stroke: var(--color-white);
-  }
+.ui-icon-white {
+  stroke: var(--color-white);
+}
 
-  .ui-icon-dark-grey {
-    stroke: var(--color-dark-grey);
-  }
+.ui-icon-dark-grey {
+  stroke: var(--color-dark-grey);
+}
 
-  .ui-version-tag {
-    @apply inline-block absolute align-top uppercase font-bold whitespace-nowrap;
+.ui-version-tag {
+  @apply inline-block absolute align-top uppercase font-bold whitespace-nowrap;
 
-    position: relative;
-    vertical-align: super;
-    margin-left: 3px;
-    font-size: 8px;
-  }
+  position: relative;
+  vertical-align: super;
+  margin-left: 3px;
+  font-size: 8px;
 }
diff --git a/src/core/styles/forms.css b/src/core/styles/forms.css
@@ -1,64 +1,62 @@
-@layer components {
-  .ui-checkbox-p1 {
-    @apply flex items-start mb-16 font-sans font-medium;
-  }
+.ui-checkbox-p1 {
+  @apply flex items-start mb-16 font-sans font-medium;
+}
 
-  .ui-checkbox-p2 {
-    @apply flex items-start mb-12 font-sans font-medium;
-  }
+.ui-checkbox-p2 {
+  @apply flex items-start mb-12 font-sans font-medium;
+}
 
-  .ui-checkbox-input {
-    @apply opacity-0 absolute h-20 w-20;
-  }
+.ui-checkbox-input {
+  @apply opacity-0 absolute h-20 w-20;
+}
 
-  .ui-checkbox-styled {
-    @apply w-20 h-20 mr-16;
-    @apply bg-white flex flex-shrink-0 justify-center items-center;
-    @apply border border-dark-grey rounded-md focus-within:border-active-orange;
-  }
+.ui-checkbox-styled {
+  @apply w-20 h-20 mr-16;
+  @apply bg-white flex flex-shrink-0 justify-center items-center;
+  @apply border border-dark-grey rounded-md focus-within:border-active-orange;
+}
 
-  .ui-checkbox-styled-tick {
-    @apply hidden text-white;
-  }
+.ui-checkbox-styled-tick {
+  @apply hidden text-white;
+}
 
-  .ui-checkbox-label-p1 {
-    @apply select-none;
-    @apply text-p1 font-medium text-cool-black;
-  }
+.ui-checkbox-label-p1 {
+  @apply select-none;
+  @apply text-p1 font-medium text-cool-black;
+}
 
-  .ui-checkbox-label-p2 {
-    @apply select-none;
-    @apply text-p2 font-medium text-cool-black;
-  }
+.ui-checkbox-label-p2 {
+  @apply select-none;
+  @apply text-p2 font-medium text-cool-black;
+}
 
-  .ui-checkbox-input:disabled + .ui-checkbox-styled {
-    @apply bg-gui-unavailable border;
-  }
+.ui-checkbox-input:disabled + .ui-checkbox-styled {
+  @apply bg-gui-unavailable border;
+}
 
-  .ui-checkbox-input:focus + .ui-checkbox-styled {
-    border-width: 0.125rem;
-    @apply border-gui-focus;
-  }
+.ui-checkbox-input:focus + .ui-checkbox-styled {
+  border-width: 0.125rem;
+  @apply border-gui-focus;
+}
 
-  .ui-checkbox-input:checked + .ui-checkbox-styled {
-    @apply bg-active-orange border-dark-grey border;
-  }
+.ui-checkbox-input:checked + .ui-checkbox-styled {
+  @apply bg-active-orange border-dark-grey border;
+}
 
-  .ui-checkbox-input:checked + .ui-checkbox-styled svg {
-    @apply block;
-  }
+.ui-checkbox-input:checked + .ui-checkbox-styled svg {
+  @apply block;
+}
 
-  .ui-textarea {
-    @apply font-sans font-medium text-cool-black text-p1;
-    @apply p-input mb-16;
-    @apply bg-light-grey border-mid-grey transition-input border rounded block w-full;
-    @apply hover:bg-white hover:shadow-input hover:border-transparent;
-    @apply focus:bg-white focus:shadow-input focus:border-transparent focus:outline-gui-focus;
-  }
+.ui-textarea {
+  @apply font-sans font-medium text-cool-black text-p1;
+  @apply p-input mb-16;
+  @apply bg-light-grey border-mid-grey transition-input border rounded block w-full;
+  @apply hover:bg-white hover:shadow-input hover:border-transparent;
+  @apply focus:bg-white focus:shadow-input focus:border-transparent focus:outline-gui-focus;
+}
 
-  .ui-textarea::placeholder {
-    /* CSS vars don't work in ::placeholder in Webkit :( */
-    /* color: var(--text-dark-grey); */
-    color: #76767c;
-  }
+.ui-textarea::placeholder {
+  /* CSS vars don't work in ::placeholder in Webkit :( */
+  /* color: var(--text-dark-grey); */
+  color: #76767c;
 }