| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235 |
- // Common
- // *******************************************************************************
-
- $ui-star-size: 1.1em !default;
- $ui-stars-spacer: -.1em !default;
- $ui-star-filled-color: $yellow !default;
-
- // Navbar (custom navbar)
- // *******************************************************************************
- $navbar-height: 4rem !default;
- $navbar-suggestion-width: 100% !default;
- $navbar-suggestion-height: 28rem !default;
- $navbar-suggestion-border-radius: .5rem !default;
- $navbar-dropdown-width: 22rem !default;
- $navbar-dropdown-content-height: 30rem !default;
- $navbar-dropdown-hover-bg: var(--#{$prefix}gray-60) !default;
- $navbar-dropdown-icon-bg: var(--#{$prefix}gray-80) !default;
- $navbar-notifications-dropdown-item-padding-y: .75rem !default;
- $navbar-notifications-dropdown-item-padding-x: 1rem !default;
-
- // Menu
- // *******************************************************************************
-
- $menu-width: 16.25rem !default;
- $menu-collapsed-width: 5.25rem !default;
- $menu-collapsed-layout-breakpoint: xl !default;
- $menu-font-size: $font-size-base !default;
-
- $menu-item-spacer: .125rem !default;
- $menu-link-spacer-x: .5rem !default;
-
- $menu-vertical-link-margin-x: 1rem !default;
- $menu-vertical-link-padding-y: .3125rem !default;
- $menu-vertical-link-padding-x: .9375rem !default;
- $menu-vertical-header-margin-y: 1rem !default;
- $menu-vertical-header-margin-x: 0 !default;
- $menu-vertical-menu-link-padding-y: .3125rem !default;
- $menu-vertical-menu-level-spacer: .65rem !default;
-
- $menu-horizontal-spacer-x: .375rem !default;
- $menu-horizontal-item-spacer: .5rem !default;
- $menu-horizontal-link-padding-y: .625rem !default;
- $menu-horizontal-link-padding-x: 1rem !default;
- $menu-horizontal-menu-link-padding-y: .625rem !default;
- $menu-horizontal-menu-level-spacer: 2rem !default;
- $menu-horizontal-menu-box-shadow: $dropdown-box-shadow !default;
-
- $menu-sub-width: $menu-width !default;
- $menu-control-width: 2.25rem !default;
- $menu-control-arrow-size: .5rem !default;
-
- $menu-icon-expanded-width: 1.5rem !default;
- $menu-icon-expanded-left-spacer: 1.675rem !default;
- $menu-icon-expanded-font-size: 1.375rem !default;
- $menu-icon-expanded-spacer: .5rem !default;
-
- $menu-animation-duration: .3s !default;
-
- $menu-bg: var(--#{$prefix}paper-bg) !default;
- $menu-bg-rgb: var(--#{$prefix}paper-bg-rgb) !default;
- $menu-color: $headings-color !default;
- $menu-color-rgb: #{to-rgb($menu-color)} !default;
- $menu-hover-bg: $gray-60 !default;
- $menu-hover-color: $headings-color !default;
- $menu-active-bg: var(--#{$prefix}primary-bg-subtle) !default;
- $menu-active-color: var(--#{$prefix}primary) !default;
- $menu-active-toggle-bg: $gray-80 !default;
- $menu-box-shadow: $box-shadow-sm !default;
- $menu-divider-color: transparent !default;
-
-
- $menu-max-levels: 5 !default;
-
- // Footer
- // *******************************************************************************
-
-
- $footer-bg: var(--#{$prefix}paper-bg) !default;
- $footer-color: var(--#{$prefix}body-color) !default;
- $footer-border-width: 0 !default;
- $footer-border-color: var(--#{$prefix}border-color) !default;
- $footer-link-color: var(--#{$prefix}primary) !default;
- $footer-link-hover-color: rgba(var(--#{$prefix}primary-rgb), .8) !default;
- $footer-link-disabled-color: var(--#{$prefix}gray-300) !default;
- $footer-link-active-color: var(--#{$prefix}primary) !default;
- $footer-brand-color: $footer-link-active-color !default;
- $footer-brand-hover-color: color-mix(in sRGB, #{$footer-link-active-color} #{$bg-label-tint-amount}, var(--#{$prefix}paper-bg)) !default;
- $footer-box-shadow: var(--#{$prefix}box-shadow-lg) !default;
-
- // Custom Options
- // *******************************************************************************
-
- $custom-option-padding: 1.065em !default;
- $custom-option-cursor: pointer !default;
- $custom-option-border-color: var(--#{$prefix}border-color) !default;
- $custom-option-border-width: var(--#{$prefix}border-width) !default;
- $custom-option-image-border-width: 2px !default;
- $custom-option-border-hover-color: $input-hover-border-color !default;
-
- // Switches
- // *******************************************************************************
-
- $switch-font-size: .625rem !default;
- $switch-border-radius: 30rem !default;
-
- $switch-width: 2.5rem !default;
- $switch-width-sm: 1.875rem !default;
- $switch-width-lg: 3.25rem !default;
-
- $switch-height: 1.35rem !default;
- $switch-height-sm: 1.125rem !default;
- $switch-height-lg: 1.75rem !default;
-
- $switch-label-font-size: $font-size-base !default;
- $switch-label-font-size-sm: $font-size-xs !default;
- $switch-label-font-size-lg: $font-size-lg !default;
-
- $switch-label-line-height: 1.4 !default;
- $switch-label-line-height-sm: 1.6 !default;
- $switch-label-line-height-lg: 1.47 !default;
-
- $switch-spacer-x: .75rem !default;
- $switch-spacer-y: .75rem !default;
- $switch-gutter: .5rem !default;
- $switch-inner-spacer: .25rem !default;
- $switch-inner-spacer-sm: .17rem !default;
-
- $switch-square-border-radius: $border-radius !default;
-
- $switch-label-color: var(--#{$prefix}heading-color) !default;
- $switch-label-disabled-color: var(--#{$prefix}secondary-color) !default;
- $switch-disabled-opacity: .45 !default;
-
- $switch-off-color: rgba(var(--#{$prefix}base-color), .4) !default;
- $switch-off-bg: var(--#{$prefix}gray-100) !default;
- $switch-off-border: var(--#{$prefix}gray-100) !default;
- $switch-holder-bg: var(--#{$prefix}white) !default;
- $switch-holder-shadow: var(--#{$prefix}box-shadow-xs) !default;
- $switch-focus-box-shadow: $input-btn-focus-box-shadow !default;
-
- // Avatars
- // *******************************************************************************
-
- // (Height & Width, Font Size, status indicator position)
-
- $avatar-size: 2.375rem !default; /* Default */
- $avatar-sizes: (
- xs: (1.5rem, .625rem, 1px),
- sm: (2rem, .8125rem, 2px),
- md: (3rem, 1.125rem, 3px),
- lg: (3.5rem, 1.5rem, 4px),
- xl: (4rem, 1.875rem, 5px)
- ) !default;
-
- $avatar-group-border: var(--#{$prefix}paper-bg) !default;
- $avatar-initial-bg: #eeedf0 !default;
-
- // Timeline
- // *******************************************************************************
- $timeline-line-border-styles: (
- solid: solid,
- dotted: dotted,
- dashed: dashed,
- hidden: none
- ) !default;
-
- $timeline-border-color: var(--#{$prefix}border-color) !default;
-
- $timeline-indicator-size: 2rem !default;
- $timeline-point-size: .75rem !default;
- $timeline-point-color: var(--#{$prefix}primary) !default;
- $timeline-point-indicator-color: var(--#{$prefix}primary) !default;
- $timeline-end-indicator-font-size: 1.5rem !default;
- $timeline-point-indicator-bg-scale: 88% !default;
-
- $timeline-item-icon-font-size: .85rem !default;
- $timeline-item-min-height: 4rem !default;
- $timeline-item-padding-x: 0 !default;
- $timeline-item-padding-y: .5rem !default;
- $timeline-item-bg-color: var(--#{$prefix}paper-bg) !default;
- $timeline-item-border-radius: var(--#{$prefix}border-radius) !default;
-
- $timeline-event-time-size: .8125rem !default;
- $timeline-event-time-color: var(--#{$prefix}secondary-color) !default;
-
- // Text Divider
- // *******************************************************************************
- $divider-color: var(--#{$prefix}gray-200) !default;
- $divider-text-color: var(--#{$prefix}heading-color) !default;
-
- $divider-margin-y: 1rem !default;
- $divider-margin-x: 0 !default;
- $divider-text-padding-y: 0 !default;
- $divider-text-padding-x: .677rem !default;
-
- $divider-font-size: $font-size-base !default;
- $divider-icon-size: 1rem !default;
-
- // Pickers - for all the pickers
- // *******************************************************************************
-
- $picker-bg: var(--#{$prefix}paper-bg) !default;
- $picker-color: var(--#{$prefix}heading-color) !default;
- $picker-box-shadow: var(--#{$prefix}box-shadow) !default;
- $picker-padding: .5rem !default;
- $picker-spacer: .125rem !default;
- $picker-border-radius: $border-radius !default;
- $picker-border-width: $dropdown-border-width !default;
- $picker-border-color: var(--#{$prefix}border-color) !default;
- $picker-arrow-wrapper-size: 1.875rem !default;
- $picker-arrow-size: .45rem !default;
- $picker-arrow-bg: rgba(var(--#{$prefix}base-color-rgb), .08) !default;
- $picker-arrow-color: var(--#{$prefix}body-color) !default;
- $picker-header-size: 3.25rem !default;
- $picker-header-padding-y: .5rem !default;
- $picker-header-color: var(--#{$prefix}heading-color) !default;
- $picker-select-bg: var(--#{$prefix}gray-100) !default;
- $picker-select-width: 3.125rem !default;
- $picker-select-timer-radius: $border-radius-sm !default;
- $picker-disabled-color: var(--#{$prefix}secondary-color) !default;
- $picker-timer-border-width: 1px !default;
- $picker-timer-border-color: var(--#{$prefix}border-color) !default;
- $picker-cell-size: 2.25rem !default;
- $picker-cell-padding: .5rem !default;
- $picker-cell-border-radius: var(--#{$prefix}border-radius) !default;
- $picker-cell-active-bg: var(--#{$prefix}primary) !default;
- $picker-cell-active-color: var(--#{$prefix}primary-contrast) !default;
- $picker-cell-active-shadow: 0 .125rem .25rem 0 rgba(var(--#{$prefix}primary-rgb), .4) !default;
- $picker-cell-hover-bg: rgba(var(--#{$prefix}base-color-rgb), .1) !default;
- $picker-cell-today-bg: var(--#{$prefix}primary-bg-subtle) !default;
- $picker-cell-today-color: var(--#{$prefix}primary) !default;
- $picker-range-active-bg: var(--#{$prefix}primary-bg-subtle) !default;
- $picker-range-active-color: var(--#{$prefix}primary) !default;
- $picker-width: ($picker-cell-size * 7) + ($picker-padding * 2) !default;
- $picker-zindex: $zindex-menu-fixed - 6 !default;
|