Merge pull request #895 from mobi/BUGFIX_TIME_PICKER_ALIGNMENT-CHORE_…

…BACKGROUND_COLOR_CHANGE BUGFIX_TIME_PICKER_ALIGNMENT-CHORE_BACKGROUND_COLOR_CHANGE
mobi · Mar 30, 2023 · c8f8712 · c8f8712
2 parents bb0ec2d + 4c80153
commit c8f8712
Show file tree

Hide file tree

Showing 5 changed files with 11 additions and 3 deletions.
diff --git a/projects/go-lib/src/lib/components/go-modal/go-modal.component.scss b/projects/go-lib/src/lib/components/go-modal/go-modal.component.scss
@@ -6,7 +6,7 @@
   @include z-index(modal);
 
   align-items: center;
-  background: transparentize($base-dark, .1);
+  background: rgba($base-color, .5);
   display: flex;
   height: 100%;
   justify-content: center;

diff --git a/projects/go-lib/src/lib/components/go-off-canvas/go-off-canvas.component.scss b/projects/go-lib/src/lib/components/go-off-canvas/go-off-canvas.component.scss
@@ -4,7 +4,7 @@
 .go-off-canvas-backdrop {
   @include z-index(off-canvas);
 
-  background: rgba($base-dark, .5);
+  background: rgba($base-color, .5);
   height: 100vh;
   left: 0;
   position: fixed;

diff --git a/projects/go-lib/src/lib/components/go-timepicker/go-time.component.html b/projects/go-lib/src/lib/components/go-timepicker/go-time.component.html
@@ -8,7 +8,8 @@
       'go-time--dark': theme === 'dark'
     }"
   >
-  <div class="go-time-column">
+  <div class="go-time--width">
+   <div class="go-time-column">
       <go-icon-button
         buttonIcon="keyboard_arrow_up"
         (click)="increaseHour()"
@@ -55,6 +56,7 @@
        {{ format ? 'AM' : 'PM' }}
       </go-button>
     </div>
+  </div>  
     <!-- Action Button Group -->
     <div>
       <ul class="go-button-group go-time-action">

diff --git a/projects/go-lib/src/lib/components/go-timepicker/go-time.component.scss b/projects/go-lib/src/lib/components/go-timepicker/go-time.component.scss
@@ -25,6 +25,10 @@
   &--wrapper {
     display: flex;
   }
+
+  &--width {
+    min-width: 9.813rem;
+  }
 
   &--dark {
     background: $theme-dark-bg;
@@ -64,6 +68,7 @@
   padding-left: $column-gutter--half;
 }
 
+
 :host ::ng-deep .go-time-button {
   // scss-lint:disable SelectorDepth
   .go-button {

diff --git a/projects/go-lib/styles/_variables.scss b/projects/go-lib/styles/_variables.scss
@@ -80,6 +80,7 @@ $base-light: #fff;
 $base-light-secondary: #b1b1b1;
 $base-light-tertiary: #d3d3d3;
 $base-primary: #65b360;
+$base-color: #00000080;
 
 $base-primary-hover: darken($base-primary, 10%);
 $base-primary-gradient: linear-gradient(to right, $base-primary, $base-primary-hover);