add breakpoints, fix h1-h4 font-size, fix buttons styles

3 files changed, 28 insertions, 16 deletions

diff --git a/src/assets/styles/bmc/_sila/_base.scss b/src/assets/styles/bmc/_sila/_base.scss
index 40806995..6a8ead73 100644
--- a/src/assets/styles/bmc/_sila/_base.scss
+++ b/src/assets/styles/bmc/_sila/_base.scss
@@ -29,28 +29,28 @@
 //
 h1,
 .h1 {
-  font-size: 2.25rem !important;
+  font-size: 1.5rem !important;
   font-weight: 500;
   line-height: 1.2;
 }
 
 h2,
 .h2 {
-  font-size: 1.5rem !important;
+  font-size: 1.25rem !important;
   font-weight: 500;
   line-height: 1.2;
 }
 
 h3,
 .h3 {
-  font-size: 1.5rem !important;
+  font-size: 1.25rem !important;
   font-weight: 400;
   line-height: 1.2;
 }
 
 h4,
 .h4 {
-  font-size: 1.25rem !important;
+  font-size: 1.15rem !important;
   font-weight: 400;
   line-height: 1.2;
 }
diff --git a/src/assets/styles/bmc/_sila/_buttons.scss b/src/assets/styles/bmc/_sila/_buttons.scss
index b3a69757..b6062d84 100644
--- a/src/assets/styles/bmc/_sila/_buttons.scss
+++ b/src/assets/styles/bmc/_sila/_buttons.scss
@@ -47,34 +47,38 @@
 }
 
 .btn-secondary {
-  background-color: $dark;
-  color: $gray-2;
+  background-color: $gray-5;
+  color: $red;
   border-radius: $border-radius;
   border: none;
   box-shadow: 1px 2px 4px -1px rgb(79 37 37 / 10%) inset;
-  font-style: normal;
-  font-weight: 600;
-  font-size: 16px;
-  line-height: 20px;
   &:hover {
-    background-color: $dark-hover;
-    color: $gray-2;
+    background-color: $gray-5-hover;
+      color: $red;
   }
   &:focus {
     border: none;
     box-shadow: 0px 0px 0px 4px $red-shadow;
-    color: $gray-2;
-    background-color: $dark;
+    color: $red;
+    background-color: $gray-5-hover;
   }
   &:not(:disabled):not(.disabled):active:focus,
   &:focus-visible {
     border: none;
     box-shadow: none;
-    color: $gray-2;
-    background-color: $dark;
+    color: $red;
+    background-color: $gray-5-hover;
+  }
+  &:active {
+    background-color: $gray-5-hover;
   }
 }
 
+.btn-danger {
+  border: none;
+  border-radius: $border-radius;
+}
+
 .btn-unstiled {
   border: none;
   &:focus {
diff --git a/src/assets/styles/bmc/helpers/_variables.scss b/src/assets/styles/bmc/helpers/_variables.scss
index ba32e3bd..c87c4e0c 100644
--- a/src/assets/styles/bmc/helpers/_variables.scss
+++ b/src/assets/styles/bmc/helpers/_variables.scss
@@ -14,3 +14,11 @@ $form-line-height: 1.25rem;
 $box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.3);
 $focus-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
 border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+
+$grid-breakpoints: (
+  xs: 0,
+  sm: 480px,
+  md: 640px,
+  lg: 992px,
+  xl: 1920px
+);
\ No newline at end of file