// Quasar SCSS (& Sass) 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. $space-base: 16px !default; $padding-xs: ($space-base * 0.25); $padding-sm: ($space-base * 0.5); $padding-md: $space-base; $padding-lg: ($space-base * 1.5); $padding-xl: ($space-base * 3); // $primary: #87a44f; $primary: #87a44f; $primary-bg-light: rgba(136, 164, 79, 0.125); $primary-focus-shadow: rgba(136, 164, 79, 0.35); $secondary: #26a69a; $accent: #9c27b0; $dark: #1d1d1d; $positive: #81c784; $negative: #dd4a48; $info: #a696c8; $warning: #ffb200; $--color-white: #fff; $--color-dark: #000; $primary-10: mix($--color-dark, $primary, 50%); $primary-9: mix($--color-dark, $primary, 40%); $primary-8: mix($--color-dark, $primary, 30%); $primary-7: mix($--color-dark, $primary, 20%); $primary-6: mix($--color-dark, $primary, 10%); $primary-5: mix($--color-white, $primary, 5%); $primary-4: mix($--color-white, $primary, 10%); $primary-3: mix($--color-white, $primary, 20%); $primary-2: mix($--color-white, $primary, 30%); $primary-1: mix($--color-white, $primary, 50%); $primary-light-1: mix($--color-white, $primary, 60%); $primary-light-2: mix($--color-white, $primary, 70%); $primary-light-3: mix($--color-white, $primary, 80%); $primary-light-4: mix($--color-white, $primary, 90%); .bg-primary-bg-light { background: $primary-bg-light; } $border-color: rgba(0, 0, 0, 0.12); $header-heigyht: 50px; $gray-light-text: rgba(0, 0, 0, 0.596); $text-color: #474747; $font-family: Roboto, -apple-system, Avenir, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif;