Create a palette mixin that override global color variables

This is widely used elsewhere and especially for all the state colors
This commit is contained in:
Jean-Baptiste Bellet
2022-12-01 11:30:24 +01:00
parent bf073599d7
commit ada76a9bf7
7 changed files with 27 additions and 12 deletions

View File

@@ -14,7 +14,10 @@
%link{:href => "https://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600,700&subset=latin,cyrillic,greek,vietnamese", :rel => "stylesheet", :type => "text/css"}
= stylesheet_pack_tag 'admin-styles', media: "screen, print"
- if feature?(:admin_style_v2, spree_current_user)
= stylesheet_pack_tag 'admin-styles-v2', media: "screen, print"
- else
= stylesheet_pack_tag 'admin-styles', media: "screen, print"
= render "layouts/bugsnag_js"
= javascript_include_tag 'admin/all'

View File

@@ -0,0 +1,16 @@
// Basic color palette for admin
$color-1: #FFFFFF !default; // White
$color-2: #9FC820 !default; // Green
$color-3: #5498DA !default; // Light Blue
$color-4: #6788A2 !default; // Dark Blue
$color-5: #C60F13 !default; // Red
$color-6: #FF9300 !default; // Yellow
@mixin basicColorPalette($color1, $color2, $color3, $color4, $color5, $color6) {
$color-1: $color1 !global;
$color-2: $color2 !global;
$color-3: $color3 !global;
$color-4: $color4 !global;
$color-5: $color5 !global;
$color-6: $color6 !global;
}

View File

@@ -9,14 +9,6 @@ $base-font-family: "Open Sans", "Helvetica Neue", "Helvetica", Helvetica, Arial,
// Colors
//--------------------------------------------------------------
// Basic color palette for admin
$color-1: #FFFFFF !default; // White
$color-2: #9FC820 !default; // Green
$color-3: #5498DA !default; // Light Blue
$color-4: #6788A2 !default; // Dark Blue
$color-5: #C60F13 !default; // Red
$color-6: #FF9300 !default; // Yellow
// Body base colors
$color-body-bg: $color-1 !default;
$color-body-text: $color-4 !default;

View File

@@ -10,8 +10,6 @@
}
body.admin.admin-v2 {
color: $v2-body-grey;
a:not(.button) {
@include v2-link-color();
}

View File

@@ -7,7 +7,7 @@ $v2-orange-lightest: #fcdbd4;
$v2-dark-grey: #333333;
$v2-medium-dark-grey: #444444;
$v2-body-grey: #666666;
$v2-body-grey: $color-4;
$v2-medium-grey: #717171;
$v2-medium-light-grey: #e6e6e6;
$v2-light-grey: #e7e7e7;

View File

@@ -0,0 +1,4 @@
@import '../css/admin/globals/palette';
@include basicColorPalette(#FFFFFF, #69A95D, #14B6CC, #484848, #C1122B, #F27052);
@import "../css/admin/all.scss";

View File

@@ -1 +1,3 @@
@import '../css/admin/globals/palette';
@import "../css/admin/all.scss";