quasar.variables.scss

// 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: #78c0a8;
$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-bg-light: rgba(120, 192, 168, 0.136);
.bg-primary-bg-light {
  background: $primary-bg-light;
}

$border-color: rgba(0, 0, 0, 0.12);

$gray-text: rgba(0, 0, 0, 0.871);
$gray-light-text: rgba(0, 0, 0, 0.596);

$header-heigyht: 50px;

:root {
  --my-ag-grid-primary: rgb(165, 189, 22);
  --my-ag-grid-primary-light: rgba(165, 189, 22, 0.05);
  --my-ag-grid-primary-1: rgba(165, 189, 22, 0.1);
  --my-ag-grid-primary-2: rgba(165, 189, 22, 0.2);
  --my-ag-grid-primary-5: rgba(165, 189, 22, 0.5);

  --my-ag-grid-active: rgb(97, 112, 17);
  --my-ag-grid-text: #fff7f7;
}