You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
121 lines
3.2 KiB
121 lines
3.2 KiB
// Quasar Sass (& SCSS) Variables
|
|
// --------------------------------------------------
|
|
// To customize the look and feel of this app, you can override
|
|
// the Sass/SCSS variables found in Quasar's source Sass/SCSS files.
|
|
|
|
// Check documentation for full list of Quasar variables
|
|
|
|
// Your own variables (that are declared here) and Quasar's own
|
|
// ones will be available out of the box in your .vue/.scss/.sass files
|
|
|
|
// It's highly recommended to change the default colors
|
|
// to match your app's branding.
|
|
// Tip: Use the "Theme Builder" on Quasar's documentation website.
|
|
|
|
@use "sass:color"
|
|
|
|
$darkBase: #151d30
|
|
|
|
$primary: #40cc3d
|
|
$secondary: #3b3440
|
|
$tertiary: #6e747f
|
|
$accent: #9C27B0
|
|
|
|
$neutral: #E0E1E2
|
|
$positive: $primary
|
|
$negative: #de2a2a
|
|
$info: #38c7ce
|
|
$warning: #ffcc24
|
|
$faded: #999999
|
|
$dark: rgba($darkBase, 80%)
|
|
$white: #ffffff
|
|
$light: #cccccc
|
|
|
|
$main-menu-background: $dark
|
|
$main-menu-background-light: rgba($primary, 10%)
|
|
|
|
$main-menu-item-hover-background: color.adjust($main-menu-background, $lightness: 12%)
|
|
$main-menu-title-color: $white
|
|
$main-menu-title-hover-color: $white
|
|
$main-menu-title-active-color: $primary
|
|
$main-menu-subtitle-color: $white
|
|
$main-menu-subtitle-hover-color: $white
|
|
$main-menu-subtitle-active-color: $primary
|
|
$main-menu-icon-color: $white
|
|
$main-menu-icon-hover-color: $white
|
|
$main-menu-icon-active-color: $primary
|
|
|
|
$main-menu-minimized-width: 56px
|
|
|
|
$call-minimized-background: $main-menu-background
|
|
|
|
$body-background: $secondary
|
|
$body-color: $secondary
|
|
|
|
$header-height: 60px
|
|
$header-height-mobile: 60px
|
|
|
|
$space-base : 16px !default
|
|
$flex-gutter-sm : ($space-base * .5) !default
|
|
$flex-gutter-xs : ($space-base * .25) !default
|
|
|
|
$logo-margin: $flex-gutter-sm
|
|
$logo-margin-mobile: $flex-gutter-xs
|
|
$logo-min-width: 84px
|
|
$logo-max-width: 100px
|
|
$logo-max-height: $header-height
|
|
|
|
$csc-label: rgba(0,0,0,0.46)
|
|
|
|
$alert-color: $dark
|
|
|
|
$toolbar-background: $primary
|
|
$toolbar-min-height: 60px
|
|
|
|
$layout-aside-background: $main-menu-background
|
|
$layout-aside-left-width: 280px
|
|
$layout-aside-right-width: 320px
|
|
|
|
$tooltip-background: $primary
|
|
|
|
$csc-subtitle-font-size: 18px
|
|
$csc-subtitle-line-height: 2rem
|
|
|
|
$item-stripe-color: rgba(white, 6%)
|
|
$item-highlight-color: rgba(white, 10%)
|
|
$item-content-secondary-text-color: rgba($white, 70%)
|
|
|
|
$typography-font-family: 'Muli', '-apple-system', 'Helvetica Neue', Helvetica, Arial, sans-serif
|
|
|
|
$popover-background: rgba($dark, 90%)
|
|
|
|
$modal-background: $body-background
|
|
$modal-body-color: $body-color
|
|
|
|
$call-footer-height: $toolbar-min-height
|
|
$call-footer-height-big: $call-footer-height * 2
|
|
$call-footer-action-margin: 27px
|
|
$call-footer-height-mobile: $call-footer-height * 1.4
|
|
|
|
$shadow-color: #000 !default
|
|
|
|
$elevation-umbra: rgba($shadow-color, .2) !default
|
|
$elevation-penumbra: rgba($shadow-color, .14) !default
|
|
$elevation-ambient: rgba($shadow-color, .12) !default
|
|
|
|
$shadow-1: 0 1px 3px $elevation-umbra, 0 1px 1px $elevation-penumbra, 0 2px 1px -1px $elevation-ambient !default
|
|
|
|
$popover-box-shadow: $shadow-1
|
|
|
|
$loading-background: $main-menu-background
|
|
|
|
$chip-color: $dark
|
|
|
|
$conf-participant-icon-color: rgba(255, 255, 255, 0.6)
|
|
$conf-participant-box-color: rgba(21,29,48,0.8)
|
|
|
|
$cf-disabled-label: color.adjust($white, $lightness: -35%)
|
|
$cf-disabled-link: color.adjust($primary, $lightness: -35%)
|
|
$cf-disabled-btn: color.adjust($negative, $lightness: -35%)
|
|
|