wickes-css2 2.103.0-0.5.0-icons.2 → 2.103.0-0.5.0-icons.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/Readme.md CHANGED
@@ -279,3 +279,8 @@ For activation sticky functionality in checkout-right-aside, please do next step
279
279
  1) please wrap right aside content by <div class=“right-aside-sticky”></div>;
280
280
  2) if page contains "recently viewed" component, please wrap it by <div class="footer_sticky-right-aside">
281
281
 
282
+ ## Husky pre-commit lint
283
+ To configure pre-commit lint run:
284
+ ```
285
+ yarn setup:husky
286
+ ```
package/package.json CHANGED
@@ -1,11 +1,23 @@
1
1
  {
2
2
  "name": "wickes-css2",
3
- "version": "2.103.0-0.5.0-icons.2",
3
+ "version": "2.103.0-0.5.0-icons.4",
4
4
  "description": "CSS and JS and page templates in use by Wickes",
5
5
  "main": "index.js",
6
6
  "scripts": {
7
7
  "lint:fix": "sass-lint-auto-fix",
8
- "build": "gulp build"
8
+ "build": "gulp build",
9
+ "prepare": "husky install",
10
+ "setup:husky": "yarn prepare && npx husky add .husky/pre-commit \"yarn lint-staged\" && git add .husky/pre-commit"
11
+ },
12
+ "lint-staged": {
13
+ "src/js/**/*.js": [
14
+ "eslint --fix",
15
+ "prettier --write"
16
+ ],
17
+ "src/scss/**/*.{scss,css}": [
18
+ "prettier --write",
19
+ "sass-lint-auto-fix"
20
+ ]
9
21
  },
10
22
  "keywords": [
11
23
  "css",
@@ -48,11 +60,14 @@
48
60
  "gulp-uglify": "^3.0.2",
49
61
  "gulp-watch": "^5.0.0",
50
62
  "handlebars-layouts": "^3.1.4",
63
+ "husky": "8.0.3",
64
+ "lint-staged": "13.2.3",
51
65
  "mocha": "^6.2.2",
52
66
  "node-sass": "^4.0.0",
53
67
  "postcss": "^8.4.16",
54
68
  "postcss-combine-duplicated-selectors": "^10.0.3",
55
69
  "postcss-combine-media-query": "^1.0.1",
70
+ "prettier": "^3.7.4",
56
71
  "pug": "2.0.4",
57
72
  "sass": "^1.54.9",
58
73
  "sass-lint-auto-fix": "^0.21.2",
@@ -0,0 +1,120 @@
1
+ // --------------------------------------------------------------------------
2
+ // Surfaces
3
+ // --------------------------------------------------------------------------
4
+ $surface-surf-primary: $white; // #ffffff
5
+
6
+ // --------------------------------------------------------------------------
7
+ // Containers
8
+ // --------------------------------------------------------------------------
9
+ $container-cont-01: $white; // #ffffff
10
+ $container-cont-02: $gray-bg; // #f8f8f8
11
+ $container-cont-03: $gray-light; // #eeeeee
12
+ $container-cont-04: $warm-grey; // #8b8b8b
13
+
14
+ $container-cont-brand: $blue-dark; // #0a3055
15
+ $container-cont-brand-light: $ma-white; // #f4f9fe
16
+ $container-cont-action: $blue; // #0277bd
17
+ $container-cont-checkout: $green; // #67a509
18
+ $container-cont-offer: $red; // #cf000f
19
+
20
+ // --------------------------------------------------------------------------
21
+ // Borders
22
+ // --------------------------------------------------------------------------
23
+ $border-brand: $blue-dark; // #0a3055
24
+ $border-bold: $gray-dark; // #3e3e3e
25
+ $border-default: $gray; // #cccccc
26
+ $border-secondary: $gray-light; // #eeeeee
27
+ $border-focus: $blue; // #0277bd
28
+ $border-error: $red; // #cf000f
29
+ $border-inverted: $white; // #ffffff
30
+
31
+ // --------------------------------------------------------------------------
32
+ // Text
33
+ // --------------------------------------------------------------------------
34
+ $text-body: $gray-dark; // #3e3e3e
35
+ $text-secondary: $squant; // #666666
36
+ $text-tertiary: $warm-grey; // #8b8b8b
37
+ $text-quinary: $gray-wait; // #9d9d9c
38
+ $text-inverted: $white; // #ffffff
39
+ $text-brand: $blue-dark; // #0a3055
40
+ $text-link: $blue; // #0277bd
41
+ $text-offer: $red; // #cf000f
42
+ $text-success: $green; // #67a509
43
+ $text-error: $red; // #cf000f
44
+
45
+ // --------------------------------------------------------------------------
46
+ // Icons
47
+ // --------------------------------------------------------------------------
48
+ $icon-brand: $blue-dark; // #0a3055
49
+ $icon-primary: $gray-dark; // #3e3e3e
50
+ $icon-secondary: $warm-grey; // #8b8b8b
51
+ $icon-tertiary: $gray; // #cccccc
52
+ $icon-inverted: $white; // #ffffff
53
+ $icon-action: $blue; // #0277bd
54
+ $icon-checkout: $green; // #67a509
55
+ $icon-success: $green; // #67a509
56
+ $icon-warning: $orange; // #ffc439
57
+ $icon-error: $red; // #cf000f
58
+ $icon-brand-light: $blue-satin; // #99b5cf
59
+
60
+ // --------------------------------------------------------------------------
61
+ // Labels / Badges
62
+ // --------------------------------------------------------------------------
63
+ $label-offer: $red; // #cf000f
64
+ $label-new: $green-light; // #9acd32
65
+ $label-clearance: $yellow; // #f7ca18
66
+
67
+ // --------------------------------------------------------------------------
68
+ // Logos
69
+ // --------------------------------------------------------------------------
70
+ $logo-main: $pacific-depths; // #004587
71
+ $logo-stroke-text: $white; // #ffffff
72
+ $logo-tradepro: $gray-wait; // #9d9d9c
73
+
74
+ // --------------------------------------------------------------------------
75
+ // Notifications
76
+ // --------------------------------------------------------------------------
77
+ $notification-success-bg: rgba($green, .05); // #67a5090d
78
+ $notification-warning-bg: rgba($orange, .05); // #ffc4390d
79
+ $notification-error-bg: rgba($red, .05); // #cf000f0d
80
+
81
+ // --------------------------------------------------------------------------
82
+ // State overlays (generic)
83
+ // --------------------------------------------------------------------------
84
+ $state-overlay-hover: rgba($black, .2); // #00000033
85
+ $state-overlay-pressed: rgba($black, .4); // #00000066
86
+ $state-overlay-disabled: rgba($white, .6); // #ffffff99
87
+
88
+ // --------------------------------------------------------------------------
89
+ // Additional (brand / payments / design usage)
90
+ // --------------------------------------------------------------------------
91
+ $additional-design-appointment: #2d8093;
92
+ $additional-review-star-pdp: #f7941d;
93
+ $additional-paypal: $orange; // #ffc439
94
+ $additional-klarna: #ffb3c7;
95
+ $additional-finance: $virid-darker; // #205c56
96
+ $additional-events: $virid-darkest; // #00857c
97
+
98
+ // --------------------------------------------------------------------------
99
+ // Button overlays (primary action = blue)
100
+ // --------------------------------------------------------------------------
101
+ $button-overlay-action-default: $blue; // #0277bd
102
+ $button-overlay-action-hover: rgba($blue, .2); // 20% opacity
103
+ $button-overlay-action-pressed: rgba($blue, .4); // 40% opacity
104
+ $button-overlay-action-disabled: rgba($blue, .6); // 60% opacity
105
+
106
+ // --------------------------------------------------------------------------
107
+ // Checkout overlays (success / checkout = green)
108
+ // --------------------------------------------------------------------------
109
+ $checkout-overlay-action-default: $green; // #67a509
110
+ $checkout-overlay-action-hover: rgba($green, .2); // 20% opacity
111
+ $checkout-overlay-action-pressed: rgba($green, .4); // 40% opacity
112
+ $checkout-overlay-action-disabled: rgba($green, .6); // 60% opacity
113
+
114
+ // --------------------------------------------------------------------------
115
+ // Offer overlays (error / offer = red)
116
+ // --------------------------------------------------------------------------
117
+ $offer-overlay-action-default: $red; // #cf000f
118
+ $offer-overlay-action-hover: rgba($red, .2); // 20% opacity
119
+ $offer-overlay-action-pressed: rgba($red, .4); // 40% opacity
120
+ $offer-overlay-action-disabled: rgba($red, .6); // 60% opacity
@@ -400,3 +400,5 @@ $christine: #ec6608;
400
400
  $monza: #e30613;
401
401
  $downriver: #0c3153;
402
402
  $rose-pink: #ff858d;
403
+
404
+ @import 'colors-semantic';