gatsby-matrix-theme 19.0.7 → 19.0.9

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.
Files changed (10) hide show
  1. package/CHANGELOG.md +24 -0
  2. package/package.json +2 -2
  3. package/src/components/molecules/header/variants/operator/template-four/template-four.module.scss +2 -2
  4. package/src/components/molecules/header/variants/operator/template-three/template-three.module.scss +2 -2
  5. package/src/gatsby-core-theme/styles/utils/variables/_main.scss +160 -152
  6. package/storybook/public/{627.44a6c91f.iframe.bundle.js → 627.2614b905.iframe.bundle.js} +3 -3
  7. package/storybook/public/{627.44a6c91f.iframe.bundle.js.map → 627.2614b905.iframe.bundle.js.map} +1 -1
  8. package/storybook/public/iframe.html +1 -1
  9. package/storybook/public/{main.c96ee0d7.iframe.bundle.js → main.c9976d2e.iframe.bundle.js} +1 -1
  10. /package/storybook/public/{627.44a6c91f.iframe.bundle.js.LICENSE.txt → 627.2614b905.iframe.bundle.js.LICENSE.txt} +0 -0
package/CHANGELOG.md CHANGED
@@ -1,3 +1,27 @@
1
+ ## [19.0.9](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v19.0.8...v19.0.9) (2023-04-19)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * conflict ([e347608](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/e347608660aa22c0c208839505e9b96a1ba637c8))
7
+ * conflict ([26c1bbe](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/26c1bbe9af7d3ff03f9d43efe4c44dd41c1262ff))
8
+ * styling fixes ([ad62e3c](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/ad62e3c1b8408200b19beba27e2a8c7d06f88e34))
9
+ * update core version ([53b7613](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/53b76138c9c6756f76f2a1f73ea5791515fa6020))
10
+ * updated the theme and small styling fixes ([397cb15](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/397cb15fa167384c4bfae73a9161566afdb36d82))
11
+
12
+
13
+ * Merge branch 'master' of git.ilcd.rocks:team-floyd/themes/matrix-theme ([336a963](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/336a9631f396d4d85f9e40e63572dddd653c3145))
14
+
15
+ ## [19.0.8](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v19.0.7...v19.0.8) (2023-04-17)
16
+
17
+
18
+ ### Bug Fixes
19
+
20
+ * updated to latest core version ([299d6eb](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/299d6eb365f8661e3d14ce464293699c35e609d9))
21
+
22
+
23
+ * Merge branch 'master' of git.ilcd.rocks:team-floyd/themes/matrix-theme ([c613bde](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/commit/c613bdebc90c49d95eb89187bbd198d49346bcdf))
24
+
1
25
  ## [19.0.7](https://git.ilcd.rocks/team-floyd/themes/matrix-theme/compare/v19.0.6...v19.0.7) (2023-04-17)
2
26
 
3
27
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "gatsby-matrix-theme",
3
- "version": "19.0.7",
3
+ "version": "19.0.9",
4
4
  "main": "index.js",
5
5
  "description": "Matrix Theme NPM Package",
6
6
  "author": "",
@@ -25,7 +25,7 @@
25
25
  "dependencies": {
26
26
  "@react-icons/all-files": "^4.1.0",
27
27
  "gatsby": "^4.20.0",
28
- "gatsby-core-theme": "20.0.3",
28
+ "gatsby-core-theme": "20.0.9",
29
29
  "gatsby-plugin-sharp": "^4.10.2",
30
30
  "gatsby-plugin-sitemap": "^3.3.0",
31
31
  "gatsby-transformer-sharp": "^4.10.0",
package/src/components/molecules/header/variants/operator/template-four/template-four.module.scss CHANGED
@@ -18,8 +18,8 @@
18
18
  margin: 0 auto;
19
19
  margin-top: var(--operator-template-four-margin-top-desktop, 1.6rem);
20
20
  margin-bottom: var(--operator-template-four-margin-bottom-desktop, 1.6rem);
21
- margin-left: var(--operator-template-four-margin-left-desktop, 1.6rem);
22
- margin-right: var(--operator-template-four-margin-right-desktop, 1.6rem);
21
+ margin-left: var(--operator-template-four-margin-left-desktop, auto);
22
+ margin-right: var(--operator-template-four-margin-right-desktop, auto);
23
23
  }
24
24
  }
25
25
 
package/src/components/molecules/header/variants/operator/template-three/template-three.module.scss CHANGED
@@ -46,8 +46,8 @@
46
46
  margin: 0 auto;
47
47
  margin-top: var(--operator-template-three-margin-top-desktop, 1.6rem);
48
48
  margin-bottom: var(--operator-template-three-margin-bottom-desktop, 1.6rem);
49
- margin-left: var(--operator-template-three-margin-left-desktop, 1.6rem);
50
- margin-right: var(--operator-template-three-margin-right-desktop, 1.6rem);
49
+ margin-left: var(--operator-template-three-margin-left-desktop, auto);
50
+ margin-right: var(--operator-template-three-margin-right-desktop, auto);
51
51
  }
52
52
  }
53
53
 
package/src/gatsby-core-theme/styles/utils/variables/_main.scss CHANGED
@@ -1,192 +1,200 @@
1
1
  :root {
2
- --primary-color: #5545A9;
3
- --color-27: #5545A9;
4
- --color-28: #5545A9;
5
- --secondary-color: #ff003d;
6
- --primary-text-color: black;
7
- --secondary-text-color: #fff;
8
- --heading-base-color: #08202e;
2
+ // Colors - site
3
+ --primary-color: #5545a9;
4
+ --color-27: #5545a9;
5
+ --color-28: #5545a9;
6
+ --secondary-color: var(--color-2);
7
+ --primary-hover-color: var(--color-7);
8
+ --secondary-hover-color: var(--color-8);
9
+ --tertiary-hover-color: var(--color-9);
10
+ --primary-text-color: var(--color-6);
11
+ --secondary-text-color: var(--color-4);
12
+ --heading-base-color: var(--color-12);
13
+ --text-link-color: var(--color-13);
14
+ --full-star-fill-color: #ffdb20;
15
+ --full-star-border-color: #ffdb20;
16
+ --halfFull-star-fill-color: #ffdb20;
17
+ --halfEmpty-star-fill-color: #e9e9e9;
18
+ --half-star-border-color: #ffdb20;
19
+ --empty-star-fill-color: #e9e9e9;
20
+ --empty-star-border-color: #e9e9e9;
21
+ --main-star-wrapper-color: #a5bcf0;
9
22
 
10
23
  --nav-background-color: #efefef;
11
24
  --nav-icon-color: black;
12
25
  --nav-height: 6rem;
13
26
 
14
- --exc-operator-height: 4.1rem;
27
+ // author
28
+ --author-link-text-color: #165AF8;
29
+ --author-fontweight:700;
30
+ --author-primary-text-color: #3e3c47;
31
+
32
+ // Font
33
+ --main-font: 'Plus Jakarta Sans';
34
+
35
+ // Body Background Color
36
+ --body-background-color: var(--color-5);
37
+
38
+ // Spacing and sizes - site
39
+ --module-bottom-spacing: 2rem;
40
+ --side-container: 30rem;
41
+ --main-container-max: 96rem;
42
+ --border-radius: 0.6rem;
43
+ --h1-size: 3.2rem;
44
+ --h2-size: 2.4rem;
45
+ --h3-size: 2rem;
46
+ --h4-size: 1.8rem;
47
+ --h5-size: 1.6rem;
48
+ --h6-size: 1.5rem;
49
+ --text-size: 1.6rem;
50
+ --h1-mobile-size: 3.2rem;
51
+ --h2-mobile-size: 2.4rem;
52
+ --h3-mobile-size: 2rem;
53
+ --h4-mobile-size: 1.8rem;
54
+ --h5-mobile-size: 1.6rem;
55
+ --h6-mobile-size: 1.5rem;
56
+
57
+ // Line heights - site
58
+ --h1-line-height: 4.2rem;
59
+ --h2-line-height: 3.4rem;
60
+ --h3-line-height: 3.2rem;
61
+ --h4-line-height: 3rem;
62
+ --h5-line-height: 2.8rem;
63
+ --h6-line-height: 2.7rem;
64
+
65
+ --h1-mobile-line-height: 3.5rem;
66
+ --h2-mobile-line-height: 3.1rem;
67
+ --h3-mobile-line-height: 3rem;
68
+ --h4-mobile-line-height: 2.8rem;
69
+ --h5-mobile-line-height: 2.4rem;
70
+ --h6-mobile-line-height: 1.8rem;
71
+
72
+ //font-weights
73
+ --h1-font-weight: 700;
74
+ --h2-font-weight: 700;
75
+ --h3-font-weight: 700;
76
+ --h4-font-weight: 700;
77
+ --h5-font-weight: 700;
78
+ --h6-font-weight: 700;
79
+
80
+ --h1-mobile-font-weight: 700;
81
+ --h2-mobile-font-weight: 700;
82
+ --h3-mobile-font-weight: 700;
83
+ --h4-mobile-font-weight: 700;
84
+ --h5-mobile-font-weight: 700;
85
+ --h6-mobile-font-weight: 700;
86
+
87
+ // Z-index
88
+ --modal-index: 30;
89
+ --navigation-index: 20;
90
+ --scroll-to-top-index: 10;
91
+ --cookie-consent-index: 20;
92
+ --search-form-index: 15;
93
+ --above-search-form-index: 16;
94
+
95
+ // Components
96
+ --nav-background-color: var(--color-4);
97
+ --nav-icon-color: var(--color-19);
15
98
 
16
99
  --modal-overlay-color: rgba(0, 0, 0, 0.6);
17
100
  --modal-background-color: white;
18
101
 
19
- --template-two-bg-colour: linear-gradient(148.34deg, #4D80F7 14.79%, #7BA0F5 84.97%);
20
-
21
- --star-rating-color: #FFDB20;
22
- --full-star-fill-color: #FFDB20;
23
- --full-star-border-color: #FFDB20;
24
- --halfFull-star-fill-color: #FFDB20;
25
- --halfEmpty-star-fill-color: #E9E9E9;
26
- --half-star-border-color: #FFDB20;
27
- --empty-star-fill-color: #E9E9E9;
28
- --empty-star-border-color: #E9E9E9;
102
+ --star-rating-color: orange;
29
103
  --selling-point-icon-color: #00889e;
30
104
 
31
- --main-font: Roboto, sans-serif;
32
-
33
- --module-bottom-spacing: 2rem;
34
- --side-container: 30rem;
35
- --main-container-max: 99rem;
105
+ --scroll-to-top-background-color: var(--color-1);
36
106
 
37
107
  --footer-background-color: var(--secondary-text-color);
38
108
  --footer-text-color: var(--color-50);
109
+ --footer-socials-background-color: var(--color-49);
39
110
  --footer-security-background-color: #9defb4;
40
111
  --footer-security-text-color: var(--color-49);
41
112
  --footer-links-heading-color: var(--color-49);
42
113
  --footer-helpline-background-color: var(--color-51);
43
114
  --footer-helpline-text-color: var(--color-49);
44
115
  --footer-helpline-icon-color: var(--color-32);
45
- --footer-helpline-font-weight: 900;
46
116
  --footer-asSeenOn-background-color: var(--color-4);
47
117
  --footer-asSeenOn-text-color: var(--color-49);
48
118
  --footer-asSeenOn-border: 1.5px solid var(--color-52);
49
119
 
50
- --cookie-consent-overlay-color: #150e06;
51
- --cookie-consent-overlay-opacity: 0.4;
52
- --cookie-consent-background-color: #000;
53
- --cookie-consent-text-color: #fff;
54
- --cookie-consent-text-size: 1.3rem;
55
-
56
- --toplist-ranking-first-color: #FFC740;
57
- --toplist-ranking-second-color: #E1DBDB;
58
- --toplist-ranking-third-color: #B87968;
59
- --toplist-ranking-base-color: #FF893F;
120
+ --link-menu-background-color: var(--color-9);
60
121
 
61
- --module-intro-margin: 2rem;
122
+ --cookie-consent-background-color: var(--color-4);
123
+ --cookie-consent-text-color: var(--color-18);
124
+ --cookie-consent-text-size: 1.4rem;
62
125
 
63
- --h1-size: 2.5rem;
64
- --h2-size: 3rem;
65
- --h3-size: 2rem;
66
- --h4-size: 1.8rem;
67
- --h5-size: 1.6rem;
68
- --h6-size: 1.5rem;
69
- --text-size: 1.6rem;
70
- --h1-mobile-size: 1.8rem;
71
- --h2-mobile-size: 2.6rem;
72
- --h3-mobile-size: 2rem;
73
- --h4-mobile-size: 1.8rem;
74
- --h5-mobile-size: 1.6rem;
75
- --h6-mobile-size: 1.5rem;
126
+ --scroll-to-top-bottom-offset: 2rem;
76
127
 
77
- // Z-index
78
- --modal-index: 1002;
79
- --navigation-index: 20;
80
- --scroll-to-top-index: 10;
81
- --cookie-consent-index: 20;
82
- --search-form-index: 15;
83
- --above-search-form-index: 16;
128
+ --toplist-ranking-first-color: var(--color-14);
129
+ --toplist-ranking-second-color: var(--color-8);
130
+ --toplist-ranking-third-color: var(--color-15);
131
+ --toplist-ranking-base-color: var(--color-2);
84
132
 
85
- --table-background: white;
86
- --table-highlight: #fff7f2;
133
+ --table-background: var(--color-4);
134
+ --table-highlight: var(--color-16);
87
135
  --table-border-radius: 0.75rem;
88
- --table-head-background: #ff893f;
89
- --table-head-text: #fff;
90
- --second-table-background: #ffefe6;
136
+ --table-head-background: var(--color-2);
137
+ --table-head-text: var(--color-4);
138
+ --second-table-background: var(--color-17);
139
+ --secondary-module-background: var(--color-42);
140
+
141
+ --pagination-with-midpoints-color: #ccc;
91
142
 
92
143
  // HTML Sitemap
93
- --template-name-icon-background: #FF893F;
144
+ --template-name-icon-color: #ffffff;
145
+ --template-name-icon-background: #ff893f;
94
146
  --page-number-background: #393939;
95
147
  --page-number-color: #fff;
96
- --sitemap-background-color: #fff;
97
-
98
- // Comparison Table
99
- --comparison-header-border-color: #D0C0AD;
100
- --comparison-header-text-color: #171F49;
101
- --comparison-header-background-color: #F9F6F3;
102
- --comparison-body-border-color: #F3F2F2;
103
- --comparison-body-background-color: #ffffff;
104
- --comparison-top-features-icon-color: #04D68B;
105
- --comparison-currencies-text-color: #000;
106
- --comparison-currencies-background-color: #fff;
107
- --comparison-header-text-transform: uppercase;
108
-
109
-
110
- // Spotlight
111
- --spotlight-testimonials-border: 1px solid #000;
112
- --spotlight-testimonials-border-radius: .8rem;
113
- --spotlight-testimonials-background-color: #fff;
114
- --spotlight-testimonials-label-color: #ff893f;
115
- --spotlight-testimonials-label-size: 2rem;
116
- --spotlight-testimonials-subtitle-color: #000;
117
- --spotlight-testimonials-subtitle-size: 1.4rem;
118
- --spotlight-testimonials-text-color: #000;
119
- --spotlight-testimonials-text-size: 1.6rem;
120
-
121
- --spotlight-boxes-border: 1px solid #000;
122
- --spotlight-boxes-border-radius: 1.6rem;
123
- --spotlight-boxes-background-color: #fff;
124
- --spotlight-boxes-label-color: #000;
125
- --spotlight-boxes-label-line-height: 3rem;
126
- --spotlight-boxes-label-size: 1.8rem;
127
- --spotlight-boxes-label-padding: 0;
128
- --spotlight-boxes-text-color: #000;
129
- --spotlight-boxes-text-size: 1.4rem;
130
-
131
- // Popup
132
- --popup-backgorund-color: #fff;
133
- --overlay-backgorund-color: rgba(0, 0, 0, 0.4);
134
- --toggle-backgorund-color: #fff;
135
-
136
- --primaryText-bonus: '#e00028'
137
- --secondaryText-bonus: '#17182f';
138
-
139
- // Extended Header Part - Author -
140
- --author-text-fontSize: 1.4rem;
141
- --author-primary-text-color: #151824;
142
- --author-link-text-color: #151824;
143
- --author-fontweight: 100;
144
- --author-card-text-color: #151824;
145
-
146
- // Horse Race Calculator
147
- --horse-calc-background-color: #fff;
148
- --horse-calc-border-radius: 1.6rem;
149
- --horse-calc-border-color: transparent;
150
- --horse-calc-shadow: 0px -3px 14px rgba(0, 0, 0, 0.09);
151
- --horse-calc-label-color: #150E06;
152
- --horse-calc-totals-table-header-background: #17D670;
153
- --horse-calc-outcome-table-header-border-color: #DCD9D3;
154
- --horse-calc-outcome-table-header-border-width: 1.5px;
155
- --horse-calc-input-background: #F3F2F2;
156
- --horse-calc-input-border-radius: .4rem;
157
-
158
- // Tooltip
159
- --tooltip-text-color: white;
160
- --tooltip-background-color: black;
161
- --tooltip-margin: 4rem;
162
- --tooltip-arrow-size: 6px;
163
- --tooltip-icon-color: #858487;
164
-
165
- //Operator-Header-template
166
-
167
- //Template One
168
- --operator-template-one-margin-mobile: 0rem;
169
- --operator-template-one-margin-top-desktop: 1.6rem;
170
- --operator-template-one-margin-bottom-desktop: 1.6rem;
171
- //Template Two
172
- --operator-template-two-margin-mobile: 0rem;
173
- --operator-template-two-margin-top-desktop: 0rem;
174
- --operator-template-two-margin-bottom-desktop: 1.6rem;
175
- //Template Three
176
- --operator-template-three-margin-mobile: 1.6rem;
177
- --operator-template-three-margin-top-desktop: 0rem;
178
- --operator-template-three-margin-bottom-desktop: 1.6rem;
179
- --operator-template-three-margin-left-desktop: auto;
180
- --operator-template-three-margin-right-desktop: auto;
181
- //Template Four
182
- --operator-template-four-margin-mobile: 1.6rem;
183
- --operator-template-four-margin-top-desktop: 0rem;
184
- --operator-template-four-margin-bottom-desktop: 1.6rem;
185
- --operator-template-four-margin-left-desktop: auto;
186
- --operator-template-four-margin-right-desktop: auto;
148
+ --page-number-border: 0.2rem solid white;
149
+ --sitemap-background-color: #fafafa;
150
+ --sitemap-connector-border: dashed 1px #e3e6ef;
151
+ --container-border: none;
152
+ --container-background-color: transparent;
153
+ --container-padding-mobile: 0 2.4rem 2rem 2.4rem;
154
+ --container-padding-desktop: 0 1.6rem 2rem 1.6rem;
155
+ --container-margin-mobile: 0;
156
+ --container-margin-desktop: 0;
157
+ --template-name-color: #000000;
158
+ --template-name-font-size: 2rem;
159
+ --icon-color: #ffffff;
160
+ --icon-background-color: #6e6e84;
161
+ --sitemap-link-text-decoration: none;
162
+ --sitemap-link-text-font-weight: normal;
163
+
164
+ --storybook-soccer: var(--color-45);
165
+ --storybook-tennis: var(--color-46);
166
+ --storybook-handball: var(--color-47);
187
167
 
188
168
  // cards
189
169
  --cards-border-radius: 1.6rem;
190
170
  --cards-border: 1.5px solid var(--color-52);
191
171
  --cards-background-color: var(--color-4);
172
+
173
+ // feedbacl module
174
+ --feedbackModule-main-border-radius: 8px;
175
+ --feedbackModule-background-color: white;
176
+ --feedbackModule-container-radius: 8px;
177
+ --feedbackModule-container-border: ;
178
+ --feedbackModule-firstText-font-size: 20px;
179
+ --feedbackModule-firstText-line-height: 20px;
180
+ --feedbackModule-secondText-line-height: 26px;
181
+ --feedbackModule-secondText-anchor-line-height: 26px;
182
+ --feedbackModule-buttons-border-style: 2.2px solid #2e3337;
183
+ --feedbackModule-buttons-border-radius: 8px;
184
+ --feedbackModule-buttons-font-size: 18px;
185
+ --feedbackModule-buttons-line-height: 20px;
186
+ --feedbackModule-buttons-width: 167.5px;
187
+ --feedbackModule-first-button-border: 2.2px solid var(--color-75);
188
+ --feedbackModule-second-button-border: 2.2px solid var(--color-76);
189
+ --feedbackModule-container-gap: 4rem;
190
+ --feedbackModule-buttons-height: 6rem;
191
+ --feedbackModule-buttons-background: none;
192
+ --feedbackModule-here-underline: none;
193
+
194
+ //Feedback module mobile
195
+ --feedbackModule-firstText-font-size-mobile: 18px;
196
+ --feedbackModule-firstText-line-height-mobile: 28px;
197
+ --feedbackModule-container-gap-mobile: 2.2rem;
198
+ --feedbackModule-buttons-height-mobile: 4.8rem;
199
+ --feedbackModule-buttons-width-mobile: 151.5px;
192
200
  }