@softheon/armature 17.31.2 → 17.31.3

package/assets/styles/material-override/_form-field.scss

@@ -3,7 +3,7 @@
 @use "../variables" as vars;
 
 mat-form-field.sof-form-field {
-  font-family: "Poppins" !important;
+  font-family: var(--sftn-font-family, sans-serif) !important;
 
   &.mat-form-field-invalid {
     .mat-mdc-form-field-flex>div.mdc-notched-outline>* {
@@ -42,7 +42,7 @@ mat-form-field.sof-form-field {
     .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__leading,
     .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__notch,
     .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__trailing {
-      border-width: 3px !important;
+      border-width: var(--sftn-input-border-width) !important;
     }
   }
 
@@ -66,12 +66,12 @@ mat-form-field.sof-form-field {
     top: 0em !important;
     color: mat.get-color-from-palette(theme.$arm-neutral, 300) !important;
     padding-right: 0.5em !important;
-    font-size: 1.5em !important;
+    font-size: var(--sftn-input-icon-font-size) !important;
   }
 
   .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-icon-suffix {
     top: 0em !important;
-    font-size: 1.5em !important;
+    font-size: var(--sftn-input-icon-font-size) !important;
     color: mat.get-color-from-palette(theme.$arm-neutral, 300) !important;
 
     .error {
@@ -89,7 +89,7 @@ mat-form-field.sof-form-field {
   }
 
   mat-error {
-    font-family: "Poppins" !important;
+    font-family: var(--sftn-font-family, sans-serif) !important;
     font-style: normal !important;
     font-weight: 500 !important;
     font-size: 12px !important;
@@ -98,7 +98,7 @@ mat-form-field.sof-form-field {
   }
 
   mat-hint {
-    font-family: "Poppins" !important;
+    font-family: var(--sftn-font-family, sans-serif) !important;
     font-style: normal !important;
     font-weight: 400 !important;
     font-size: 12px !important;
@@ -125,7 +125,7 @@ mat-form-field.sof-form-field {
   }
 }
 
-// dropdown specific style overrides 
+// dropdown specific style overrides
 
 .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled) .mdc-list-item__primary-text {
   color: mat.get-color-from-palette(theme.$arm-primary, 500) !important;
@@ -145,4 +145,4 @@ mat-form-field.sof-form-field {
 
 .mdc-form-field {
   letter-spacing: 0 !important;
-}
+}

package/assets/styles/material-override/_menu.scss

@@ -15,7 +15,7 @@
 ::ng-deep .mat-mdc-menu-item-text {
   font-weight: 500 !important;
   color: vars.$text-high-emphasis !important;
-  font-family: Poppins !important;
+  font-family: var(--sftn-font-family, sans-serif) !important;
   display: flex !important;
   align-items: center !important;
   letter-spacing: 0px !important;

package/assets/styles/material-override/_switch.scss

@@ -32,7 +32,7 @@ mat-slide-toggle {
     }
 
     label {
-      font-family: "Poppins" !important;
+      font-family: var(--sftn-font-family, sans-serif) !important;
       font-style: normal !important;
       font-weight: 400 !important;
       font-size: 14px !important;
@@ -45,7 +45,7 @@ mat-slide-toggle {
 
   &.sof-slide-toggle[size="large"] {
     label {
-      font-family: "Poppins" !important;
+      font-family: var(--sftn-font-family, sans-serif) !important;
       font-style: normal !important;
       font-weight: 400 !important;
       font-size: 16px !important;

package/assets/styles/material-override/_tooltip.scss

@@ -2,9 +2,9 @@
 @use "../arm-theme" as theme;
 @use "../variables" as vars;
 
-// Angular Material styles 
+// Angular Material styles
 
-// Base tooltip styles 
+// Base tooltip styles
 .mat-mdc-tooltip-panel {
   .mat-mdc-tooltip,
   .mdc-tooltip__surface {
@@ -13,7 +13,7 @@
     font-size: 14px !important;
     font-style: normal !important;
     font-weight: 100 !important;
-    font-family: Poppins !important;
+    font-family: var(--sftn-font-family, sans-serif) !important;
     line-height: normal !important;
     text-align: center !important;
     border-radius: 4px !important;
@@ -25,7 +25,7 @@
   }
 }
 
-// Position based styles 
+// Position based styles
 .mat-mdc-tooltip-panel {
   .mat-mdc-tooltip {
     &::after {
@@ -83,7 +83,7 @@
   }
 }
 
-// NGX_TIPPY styles 
+// NGX_TIPPY styles
 
 .tippy-box {
   border-radius: 8px !important;
@@ -113,7 +113,7 @@
       gap: 16px !important;
 
       &__content {
-        font-family: "Poppins", sans-serif !important;
+        font-family: var(--sftn-font-family, sans-serif) !important;
         line-height: normal !important;
         margin: 0 !important;
         padding: 0 !important;
@@ -173,7 +173,7 @@
   }
 }
 
-// Definition trigger button 
+// Definition trigger button
 
 .definition-trigger {
   cursor: pointer !important;

package/assets/styles/sof-styles-b2b.scss

@@ -0,0 +1,78 @@
+/**
+  'sof-styles-b2b.scss' is Armature's main B2B style file,
+  which serves as a centralized styling solution for applications that consume this library.
+
+  This file acts as an index,
+  Please do not include any actual css code in this file.
+
+  Note that any file with variables declared for export must be '@forward',
+  this will allow those variables to be accessed directly through 'sof-styles-b2b.scss' as well as by using that file directly.
+*/
+
+@use "@angular/material" as mat;
+
+/** Defines the main theme / color palettes for your app. */
+@use "./arm-theme";
+@forward "./arm-theme";
+
+/** Responsive design rules, ensuring styles adapt to different screen sizes. */
+@use "./responsive";
+
+/** Sets custom fonts, sizes, and styles to create a unified look across the library. */
+@use "./typography";
+
+/** Utility classes for spacing, alignment, and other common styles. */
+@use "./utility";
+
+/** SCSS variables (like colors, breakpoints, etc.) used throughout the library for easy customization and consistency. */
+@use "./variables" as vars;
+@forward "./variables";
+
+/** B2B specific variables */
+@use "./b2b-variables";
+@forward "./b2b-variables";
+
+/**
+  The 'material-override' folder contains overrides for specific Angular Material components.
+*/
+@use "./material-override/button";
+@use "./material-override/button-toggle-group";
+@use "./material-override/calendar";
+@use "./material-override/checkbox";
+@use "./material-override/expansion-panel";
+@use "./material-override/form-field";
+@use "./material-override/menu";
+@use "./material-override/radio-button";
+@use "./material-override/slider";
+@use "./material-override/switch";
+@use "./material-override/tooltip";
+
+/**
+  The 'deprecated' folder contains styles that are deprecated but still available for backward compatibility.
+  Comments indicate the preferred alternative, helping users transition away from deprecated classes in favor of newer components or styles.
+*/
+@use "./deprecated/button-deprecated"; // replace with "/material-override/button"
+@use "./deprecated/chip-deprecated"; // replace with "sof-chip" component
+@use "./deprecated/dialog-deprecated"; // replace with "sof-modal" component
+@use "./deprecated/material-override-deprecated"; // currently no replacement
+@use "./deprecated/table-deprecated"; // replace with ag-grid table component
+
+/** The B2B Overrides */
+@use "./b2b/b2b-inputs-override";
+@use "./b2b/b2b-spinner";
+@use "./b2b/b2b-tabs";
+@use "./b2b/b2b-buttons";
+@use "./b2b/b2b-override";
+
+/**
+  Angular Material core mix-in,
+  Since it's included in this main file, applications using this library do not need to include it separately.
+*/
+@include mat.core();
+
+@include mat.all-component-densities(-2);
+
+/**
+  This file acts as an index,
+  Please do not include any actual css code in this file.
+*/

package/assets/styles/sof-styles.scss

@@ -1,5 +1,5 @@
-/** 
-  'sof-styles.scss' is Armature's main style file,
+/**
+  'sof-styles.scss' is Armature's main B2C style file,
   which serves as a centralized styling solution for applications that consume this library.
 
   This file acts as an index,
@@ -28,7 +28,11 @@
 @use "./variables";
 @forward "./variables";
 
-/** 
+/** B2C specific variables */
+@use "./b2c-variables";
+@forward "./b2c-variables";
+
+/**
   The 'material-override' folder contains overrides for specific Angular Material components.
 */
 @use "./material-override/button";
@@ -43,8 +47,8 @@
 @use "./material-override/switch";
 @use "./material-override/tooltip";
 
-/** 
-  The 'deprecated' folder contains styles that are deprecated but still available for backward compatibility. 
+/**
+  The 'deprecated' folder contains styles that are deprecated but still available for backward compatibility.
   Comments indicate the preferred alternative, helping users transition away from deprecated classes in favor of newer components or styles.
 */
 @use "./deprecated/button-deprecated"; // replace with "/material-override/button"
@@ -53,13 +57,13 @@
 @use "./deprecated/material-override-deprecated"; // currently no replacement
 @use "./deprecated/table-deprecated"; // replace with ag-grid table component
 
-/** 
+/**
   Angular Material core mix-in,
   Since it's included in this main file, applications using this library do not need to include it separately.
 */
 @include mat.core();
 
-/** 
+/**
   This file acts as an index,
   Please do not include any actual css code in this file.
 */