@inspark/inspark-components 19.0.49 → 19.0.51

package/src/scss/settings/_settings.global.scss

@@ -0,0 +1,220 @@
+///* ========================================================================
+//   #GLOBAL
+//   ======================================================================== */
+// The global settings file contains any project-wide variables; things that
+// need to be made available to the entire codebase.
+
+@use "@inspark/components-web/src/variables" as *;
+
+//== Tabs
+$nav-tabs-border-color: $color-gray-40 !default;
+
+$nav-tabs-link-hover-border-color: $color-gray-20 !default;
+
+$nav-tabs-active-link-hover-bg: $body-bg !default;
+$nav-tabs-active-link-hover-color: $body-color !default;
+$nav-tabs-active-link-hover-border-color: $ids-theme-primary !default;
+
+$nav-tabs-justified-link-border-color: $color-gray-40 !default;
+$nav-tabs-justified-active-link-border-color: $body-bg !default;
+
+$nav-tabs-tab-pane-active-background: $color-gray-90 !default;
+
+//== Pills
+$nav-pills-border-radius: $global-radius !default;
+$nav-pills-active-link-hover-bg: $component-active-bg !default;
+$nav-pills-active-link-hover-color: $component-active-color !default;
+
+//== Dropdowns
+//
+//## Dropdown menu container and contents.
+
+//** Background for the dropdown menu.
+$dropdown-bg: $color-gray-35 !default;
+
+$dropdown-min-width: 230px !default;
+
+//** Dropdown menu `border-color`.
+$dropdown-border: transparent !default;
+
+$dropdown-focused-box-shadow: $component-active-box-shadow !default;
+//** Dropdown menu `border-color` **for IE8**.
+$dropdown-fallback-border: $color-gray-35 !default;
+//** Divider color for between dropdown items.
+$dropdown-divider-bg: #e5e5e5 !default;
+
+//** Dropdown link text color.
+$dropdown-link-color: $color-base-white !default;
+//** Hover color for dropdown links.
+$dropdown-link-hover-color: $color-base-white !default;
+//** Hover background for dropdown links.
+$dropdown-link-hover-bg: rgba($color-gray-20, 0.8) !default;
+
+//** Active dropdown menu item text color.
+$dropdown-link-active-color: $color-base-white !default;
+//** Active dropdown menu item background color.
+$dropdown-link-active-bg: rgba($component-active-bg, 0.3) !default;
+
+//** Disabled dropdown menu item background color.
+$dropdown-link-disabled-color: $color-gray-10 !default;
+$dropdown-link-disabled-bg: $color-gray-5 !default;
+
+//** Text color for headers within dropdown menus.
+$dropdown-header-color: $color-gray-10 !default;
+
+//** Deprecated `$dropdown-caret-color` as of v3.1.0
+$dropdown-caret-color: $color-base-white !default;
+
+$zindex-navbar: 1001 !default;
+$zindex-footer: 1000 !default;
+$zindex-login: 1000 !default;
+$zindex-sidebar: $zindex-footer !default;
+$zindex-dropdown: 1050 !default;
+$zindex-popover: 1060 !default;
+$zindex-tooltip: 1070 !default;
+$zindex-charts-tooltip: 1000 !default;
+$zindex-navbar-fixed: 1030 !default;
+$zindex-modal-background: 1040 !default;
+$zindex-modal: 1050 !default;
+$zindex-panel-absolute: 999 !default;
+$zindex-1: 1 !default;
+$zindex-panel-image-content: 2 !default;
+$zindex-login-form: $zindex-1 !default;
+
+// Main content
+$main-content-bg: $color-base-black !default;
+$main-content-padding-top: $navbar-height !default;
+$main-content-margin-left-collapsed: $sidebar-collapsed-width !default;
+$main-content-margin-left-expanded: $sidebar-open-width !default;
+$main-section-bg: $color-base-black !default;
+
+// Footer
+$footer-height: 40px !default;
+$footer-bg: $color-gray-40 !default;
+$footer-margin-left-collapsed: $sidebar-collapsed-width !default;
+$footer-margin-left-expanded: $sidebar-open-width !default;
+
+// Main Menu
+$main-menu__item-li-width: 220px !default;
+$main-menu-item-li-bg: $color-gray-40 !default;
+$main-menu-item-a-color: $color-gray-35 !default;
+$main-menu-item-symbol: $color-gray-10 !default;
+$menu-ddl-menu-bg: $color-gray-35 !default;
+$main-menu-item-a-color-hover: $color-base-white !default;
+$main-menu-submenu-item-bg: $color-black-tertiary !default;
+$main-menu-item-title-color: $color-gray-10 !default;
+$main-menu-item-symbol-color-active: $color-base-white !default;
+
+// Modal
+
+//** Padding applied to the modal body
+$modal-inner-padding: 15px !default;
+
+//** Padding applied to the modal title
+$modal-title-padding: 15px !default;
+//** Modal title line-height
+$modal-title-line-height: $line-height-computed !default;
+
+//** Background color of modal content area
+$modal-content-bg: $color-gray-80 !default;
+//** Modal content border color
+$modal-content-border-color: rgba(0, 0, 0, .2) !default;
+//** Modal content border color **for IE8**
+$modal-content-fallback-border-color: #999 !default;
+
+//** Modal backdrop background color
+$modal-backdrop-bg: #000 !default;
+//** Modal backdrop opacity
+$modal-backdrop-opacity: .5 !default;
+//** Modal header border color
+$modal-header-border-color: $color-gray-40 !default;
+//** Modal footer border color
+$modal-footer-border-color: $modal-header-border-color !default;
+
+$modal-lg: 900px !default;
+$modal-md: 600px !default;
+$modal-sm: 300px !default;
+
+// Spinner
+$spinner-loader-color: $color-gray-10 !default;
+
+// Login
+$login-form-bg: $color-gray-90;
+
+// Logout
+$logout-link-color: $dropdown-link-color !default;
+
+// PrimeNG tables
+
+$pm-table-padding-vertical: $unit-tiny !default;
+$pm-table-padding-horizontal: 12px !default;
+$pm-table-head-background: rgba($color-base-white, 0.2) !default;
+$pm-table-head-border: rgba($color-base-black, 0.5) !default;
+
+// PrimeNG treetables
+
+$pm-treetable-padding-vertical: $unit-tiny !default;
+$pm-treetable-padding-horizontal: 12px !default;
+$pm-treetable-head-background: rgba($color-base-white, 0.2) !default;
+$pm-treetable-head-border: rgba($color-base-black, 0.5) !default;
+
+// PrimeNG multiselect
+
+$pm-multiselect-panel-background: $color-gray-80 !default;
+
+// NGX-Bootstrap datepicker
+
+$bs-datepicker-main-bg:         $color-gray-35 !default;
+$bs-datepicker-custom-range-bg: #eee !default;
+
+$bs-datepicker-main-box-shadow: $component-active-box-shadow !default;
+
+$bs-datepicker-font-color-01:   $color-base-white !default;
+$bs-datepicker-font-color-02:   rgba($color-base-white, 0.5) !default;
+$bs-datepicker-font-color-03:   $color-base-white !default;
+$bs-datepicker-font-color-hover: $color-base-black !default;
+$bs-datepicker-font-color-secondary: rgba($color-base-white, 0.3) !default;
+$bs-datepicker-font-color-selected: rgba($color-base-white, 0.3) !default;
+//$bs-datepicker-font-color-disabled: rgba($color-base-white, 0.25) !default;
+
+$bs-datepicker-border-color:    $dropdown-border !default;
+$bs-datepicker-highlighted-color: $color-base-black !default;
+$bs-datepicker-highlighted-background: $color-gray-5 !default;
+
+$bs-datepicker-font-color-is-other-month: rgba($color-base-white, 0.3) !default;
+
+$bs-datepicker-btn-bg:          #e9edf0 !default;
+$bs-datepicker-btn-bg-hover:    #d5dadd !default;
+
+$bs-datepicker-btn-bg2:         #9aaec1 !default;
+$bs-datepicker-btn-bg2-hover:   #54708b !default;
+
+$bs-datepicker-selected-background: $ids-theme-primary !default;
+$bs-datepicker-selected-color:       $color-base-black !default;
+
+$bs-datepicker-disabled-color:  rgba($color-base-white, 0.6) !default;
+$bs-datepicker-disabled-background:       $color-gray-40 !default;
+
+// Datatime Picker
+
+//-- We want overlays to always appear over user content, so set a baseline
+//-- very high z-index for the overlay container, which is where we create the new
+//-- stacking context for all overlays.
+$cdk-z-index-overlay-container: 10001;
+$cdk-z-index-overlay: 5000;
+$cdk-z-index-overlay-backdrop: 5000;
+
+//-- Background color for all of the backdrops
+$cdk-overlay-dark-backdrop-background: rgba(0, 0, 0, 0.288);
+
+//-- Default backdrop animation is based on the Material Design swift-ease-out.
+$backdrop-animation-duration: 400ms !default;
+$backdrop-animation-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1) !default;
+
+$owl-dt-timer-input-border: 1px solid rgba($color-base-black, .1) !default;
+$owl-dt-container-bg: $color-gray-35 !default;
+$owl-theme-color: $ids-theme-primary !default;
+$owl-dt-calendar-cell-selected-color: rgba($color-base-black, .85) !default;
+
+// Map
+$map-tooolbar-bg: $color-gray-40 !default;