@ieeesa-npm/shared-styles 0.1.3 → 0.1.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ieeesa-npm/shared-styles",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "peerDependencies": {
     "@angular/common": "^16.1.0",
     "@angular/core": "^16.1.0"

package/styles/theme.scss

@@ -6,7 +6,8 @@
 .mat-mdc-button.mat-mdc-button-base {
   &.mat-primary-button,
   &.mat-secondary-button,
-  &.mat-tertiary-button {
+  &.mat-tertiary-button,
+  &.mat-text-button {
     min-width: 103px;
     width: auto;
     min-height: 40px;
@@ -16,7 +17,7 @@
     padding: 0.625em 1.5em;
     border: none;
     @include set-font-style(
-      $ieeesa-font-calibri-regular,
+      $ieeesa-font-calibri-bold,
       $ieeesa-font-style-normal,
       $ieeesa-font-wt-700,
       $ieeesa-font-size-16,
@@ -75,6 +76,20 @@
     color: $ieeesa-background-dark-color;
     opacity: $ieeesa-opacity-point-38;
   }
+
+  &.mat-text-button {
+    color: $ieeesa-blue;
+    &:hover {
+      background: $ieeesa-tertiary-btn-hover;
+    }
+    &:active {
+      background: $ieeesa-tertiary-btn-hover;
+    }
+    &:disabled {
+      color: $ieeesa-title-color;
+      opacity: $ieeesa-opacity-point-38;
+    }
+  }
 }
 .ieeesa-text-button {
   color: $ieeesa-outline-variant;
@@ -105,7 +120,7 @@
 .mat-button-toggle-group {
   .mat-button-toggle-label-content {
     @include set-font-style(
-      $ieeesa-font-calibri-regular,
+      $ieeesa-font-calibri-bold,
       $ieeesa-font-style-normal,
       $ieeesa-font-wt-700,
       $ieeesa-font-size-16,
@@ -134,15 +149,32 @@
     }
   }
 }
+.cdk-overlay-pane {
+  .mat-mdc-tooltip .mdc-tooltip__surface {
+    color: #525252;
+    padding: 6px 12px;
+    font-family: $ieeesa-font-calibri-regular;
+    font-size: $ieeesa-font-size-16;
+    border: 1px solid $ieeesa-outline-variant;
+    background: $ieeesa-white;
+    box-shadow: $ieeesa-box-shadow-11;
+    max-width: unset !important;
+  }
+}
+.cdk-overlay-pane {
+  .mat-mdc-option .mdc-list-item__primary-text {
+    font-family: $ieeesa-font-calibri-regular !important;
+  }
+}
 // Modal component styles
 .cdk-overlay-pane {
   &.ieeesa-modal-confirm-dialog,
   &.ieeesa-modal-dialog,
   &.ieeesa-alert-dialog {
-     width: 100%;
+    width: 100%;
     min-width: 312px;
- }
-}  
+  }
+}
 
 .mat-mdc-form-field {
   @include set-font-style(

package/styles/typography.scss

@@ -96,7 +96,7 @@
 }
 .ieeesa-title-lg-bold-24 {
   @include set-font-style(
-    $ieeesa-font-calibri-regular,
+    $ieeesa-font-calibri-bold,
     $ieeesa-font-style-normal,
     $ieeesa-font-wt-700,
     $ieeesa-font-size-24,
@@ -140,7 +140,7 @@
 }
 .ieeesa-label-lg-bold-16 {
   @include set-font-style(
-    $ieeesa-font-calibri-regular,
+    $ieeesa-font-calibri-bold,
     $ieeesa-font-style-normal,
     $ieeesa-font-wt-700,
     $ieeesa-font-size-16,
@@ -184,7 +184,7 @@
 }
 .ieeesa-body-lg-bold-18 {
   @include set-font-style(
-    $ieeesa-font-calibri-regular,
+    $ieeesa-font-calibri-bold,
     $ieeesa-font-style-normal,
     $ieeesa-font-wt-700,
     $ieeesa-font-size-18,
@@ -228,7 +228,7 @@
 }
 .ieeesa-body-sm-bold-14 {
   @include set-font-style(
-    $ieeesa-font-calibri-regular,
+    $ieeesa-font-calibri-bold,
     $ieeesa-font-style-normal,
     $ieeesa-font-wt-700,
     $ieeesa-font-size-14,

package/styles/variables.scss

@@ -117,6 +117,7 @@ $ieeesa-box-shadow-7: 0px 3px 0px 0px #11b7e5 inset,
   0px 4px 24px 0px rgba(0, 0, 0, 0.5);
 $ieeesa-box-shadow-9: 0px 0px 4px 0px rgba(0, 0, 0, 0.5) inset;
 $ieeesa-box-shadow-10: 0px 1px 0px 0px rgb(220, 227, 233) inset;
+$ieeesa-box-shadow-11: 0px 4px 8px 0px rgba(0, 0, 0, 0.25);
 // Angular Material mat-button styles
 $ieeesa-primary-btn-active: #00629b;
 $ieeesa-primary-btn-hover: #003e65;
@@ -138,6 +139,7 @@ $ieeesa-brand-grey-50: #777a7e;
 $ieeesa-brand-grey-70: #9ba0a6;
 $ieeesa-outline-variant: #cac4d0;
 $ieeesa-dark-grey: #63666a;
+$ieeesa-brand-dark-grey: #1c1d1e;
 $ieeesa-neutral-variant-50: #79747e;
 $ieeesa-success-color: #c0deef;
 $ieeesa-error-color: #f9dedc;
@@ -148,3 +150,5 @@ $ieeesa-form-field-background: linear-gradient(
     rgba(0, 98, 155, 0.05) 100%
   ),
   #fffbfe;
+$ieeesa-neutral-60: #939094;
+$ieeesa-revision-cycle-background: #f2f2f2;