@simplybusiness/theme-simplybusiness 1.21.2 → 1.22.0

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 (5) hide show
  1. package/CHANGELOG.md +42 -0
  2. package/dist/index.css +70 -2
  3. package/package.json +8 -8
  4. package/src/index.css +2 -0
  5. package/src/variables.css +1 -0
package/CHANGELOG.md CHANGED
@@ -1,5 +1,47 @@
1
1
  # @simplybusiness/theme-simplybusiness
2
2
 
3
+ ## 1.22.0
4
+
5
+ ### Minor Changes
6
+
7
+ - 87f6d58: feat: add CTM Header component
8
+ - 3b00d19: Add CTM Footer variant
9
+ - a7cf0c0: Lowest Price UI added for experiment
10
+
11
+ ### Patch Changes
12
+
13
+ - Updated dependencies [9ae49d1]
14
+ - Updated dependencies [4577c67]
15
+ - Updated dependencies [3d28999]
16
+ - Updated dependencies [87f6d58]
17
+ - Updated dependencies [3b00d19]
18
+ - Updated dependencies [87f6d58]
19
+ - Updated dependencies [6ea6fec]
20
+ - Updated dependencies [5fd8a95]
21
+ - Updated dependencies [12305a5]
22
+ - Updated dependencies [a7cf0c0]
23
+ - @simplybusiness/mobius-interventions@1.61.0
24
+ - @simplybusiness/mobius-journey@8.33.0
25
+ - @simplybusiness/theme-core@7.8.0
26
+ - @simplybusiness/mobius@5.29.0
27
+ - @simplybusiness/mobius-chatbot@1.4.9
28
+ - @simplybusiness/mobius-datepicker@6.5.26
29
+
30
+ ## 1.21.3
31
+
32
+ ### Patch Changes
33
+
34
+ - Updated dependencies [d1250c5]
35
+ - Updated dependencies [3d1131f]
36
+ - Updated dependencies [716ae2e]
37
+ - Updated dependencies [5a71615]
38
+ - @simplybusiness/mobius-interventions@1.60.0
39
+ - @simplybusiness/mobius-journey@8.32.1
40
+ - @simplybusiness/mobius@5.28.3
41
+ - @simplybusiness/mobius-chatbot@1.4.8
42
+ - @simplybusiness/mobius-datepicker@6.5.25
43
+ - @simplybusiness/theme-core@7.7.3
44
+
3
45
  ## 1.21.2
4
46
 
5
47
  ### Patch Changes
package/dist/index.css CHANGED
@@ -876,7 +876,7 @@ a.mobius-button:focus-visible,
876
876
  box-sizing:border-box;
877
877
  font-family:var(--font-family);
878
878
  line-height:var(--line-height-normal);
879
- color:var(--color-secondary);
879
+ color:var(--color-link);
880
880
  outline:none;
881
881
  border-radius:var(--radius-1);
882
882
  }
@@ -896,6 +896,12 @@ a.mobius-button:focus-visible,
896
896
  pointer-events:none;
897
897
  cursor:not-allowed;
898
898
  }
899
+ .mobius-link--secondary{
900
+ color:var(--color-link-secondary);
901
+ }
902
+ .mobius-link--secondary:hover,.mobius-link--secondary:active{
903
+ color:var(--color-link-secondary);
904
+ }
899
905
  .mobius-list{
900
906
  box-sizing:border-box;
901
907
  font-family:var(--font-family);
@@ -2610,6 +2616,8 @@ svg:not(:host).svg-inline--mobius-icon{
2610
2616
  --switch-transition-duration:150ms;
2611
2617
  --table-border-width:1px;
2612
2618
  --title-decorator-width:8px;
2619
+ --color-link:var(--color-secondary);
2620
+ --color-link-secondary:var(--color-link);
2613
2621
  }
2614
2622
  :root{
2615
2623
  --color-pulse:var(--color-focus);
@@ -3034,6 +3042,28 @@ svg:not(:host).svg-inline--mobius-icon{
3034
3042
  text-decoration:underline;
3035
3043
  color:var(--color-text-inverted);
3036
3044
  }
3045
+ .mobius-footer-ctm{
3046
+ background-color:#f3f4f4;
3047
+ padding:var(--size-lg) var(--size-sm);
3048
+ }
3049
+ .mobius-footer-ctm__content{
3050
+ color:var(--color-text-medium);
3051
+ font-size:13px;
3052
+ line-height:19px;
3053
+ letter-spacing:0.13px;
3054
+ }
3055
+ .mobius-footer-ctm__content h2.mobius-text.--is-h2{
3056
+ font-size:var(--font-size-small-paragraph);
3057
+ font-weight:700;
3058
+ line-height:20px;
3059
+ letter-spacing:0.17px;
3060
+ }
3061
+ .mobius-footer-ctm__content p{
3062
+ margin:1.4em 0;
3063
+ }
3064
+ .mobius-footer-ctm__content a.mobius-link{
3065
+ color:var(--color-focus);
3066
+ }
3037
3067
  .mobius-sticky-footer{
3038
3068
  box-sizing:border-box;
3039
3069
  position:fixed;
@@ -3150,7 +3180,7 @@ svg:not(:host).svg-inline--mobius-icon{
3150
3180
  display:flex;
3151
3181
  align-items:center;
3152
3182
  justify-content:space-between;
3153
- gap:var(--size-xs);
3183
+ gap:var(--header-gap, var(--size-xs));
3154
3184
  }
3155
3185
  .mobius-header__logo{
3156
3186
  display:block;
@@ -3169,6 +3199,19 @@ svg:not(:host).svg-inline--mobius-icon{
3169
3199
  margin-left:0;
3170
3200
  }
3171
3201
  }
3202
+ .mobius-header__provided-by{
3203
+ color:var(--color-primary);
3204
+ font-size:13px;
3205
+ display:flex;
3206
+ align-items:center;
3207
+ gap:var(--size-xs);
3208
+ }
3209
+ .mobius-header__product-title{
3210
+ margin-right:auto;
3211
+ border-left:1px solid #C8CAD4;
3212
+ padding:var(--size-xs) var(--size-md);
3213
+ color:var(--color-primary);
3214
+ }
3172
3215
  .mobius-header__phone-number{
3173
3216
  font-size:var(--font-size-lead);
3174
3217
  color:var(--header-text-color);
@@ -4149,6 +4192,30 @@ svg:not(:host).svg-inline--mobius-icon{
4149
4192
  width:100%;
4150
4193
  height:auto;
4151
4194
  }
4195
+ .mobius-quote-card__top_header.lowest-price-label{
4196
+ background:var(--color-azure-600);
4197
+ padding:var(--size-xs);
4198
+ text-align:center;
4199
+ color:var(--color-neutral-100);
4200
+ border-radius:8px 8px 0 0;
4201
+ font-size:var(--font-size-2);
4202
+ line-height:120%;
4203
+ letter-spacing:0;
4204
+ display:flex;
4205
+ justify-content:center;
4206
+ align-items:center;
4207
+ padding-bottom:6px;
4208
+ gap:var(--size-xs);
4209
+ }
4210
+ .mobius-quote-card__top_header.lowest-price-label svg{
4211
+ width:20px;
4212
+ height:20px;
4213
+ color:var(--color-bubblegum-500);
4214
+ }
4215
+ .mobius-quote-card__top_header.lowest-price-label + .mobius-quote-card{
4216
+ border-radius:0 0 8px 8px;
4217
+ border:1px solid var(--color-azure-600);
4218
+ }
4152
4219
  @media(min-width: 850px){
4153
4220
  .mobius-quote-cards__grid.--is-grid .mobius-quote-card{
4154
4221
  grid-template-areas:"header" "pricing" "actions" "coverage";
@@ -7484,6 +7551,7 @@ svg:not(:host).svg-inline--mobius-icon{
7484
7551
  --header-link-color:var(--color-secondary);
7485
7552
  --header-phone-icon-color:var(--color-secondary);
7486
7553
  --header-powered-by-icon-color:var(--color-text-medium);
7554
+ --header-gap:24px;
7487
7555
  --progress-steps-shape-size:44px;
7488
7556
  --progress-steps-shape-size-lg:64px;
7489
7557
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@simplybusiness/theme-simplybusiness",
3
- "version": "1.21.2",
3
+ "version": "1.22.0",
4
4
  "main": "dist/index.css",
5
5
  "simplyBusiness": {
6
6
  "publishToPublicNpm": true
@@ -26,12 +26,12 @@
26
26
  "./fonts": "./dist/fonts.css"
27
27
  },
28
28
  "dependencies": {
29
- "@simplybusiness/mobius": "^5.28.2",
30
- "@simplybusiness/mobius-chatbot": "^1.4.7",
31
- "@simplybusiness/mobius-datepicker": "^6.5.24",
32
- "@simplybusiness/mobius-interventions": "^1.59.1",
33
- "@simplybusiness/mobius-journey": "^8.32.0",
34
- "@simplybusiness/theme-core": "^7.7.2"
29
+ "@simplybusiness/mobius": "^5.29.0",
30
+ "@simplybusiness/mobius-chatbot": "^1.4.9",
31
+ "@simplybusiness/mobius-datepicker": "^6.5.26",
32
+ "@simplybusiness/mobius-interventions": "^1.61.0",
33
+ "@simplybusiness/mobius-journey": "^8.33.0",
34
+ "@simplybusiness/theme-core": "^7.8.0"
35
35
  },
36
36
  "devDependencies": {
37
37
  "css-loader": "^7.1.2",
@@ -48,7 +48,7 @@
48
48
  "resolve-url-loader": "^5.0.0",
49
49
  "sass": "^1.85.1",
50
50
  "sass-loader": "^14.2.1",
51
- "webpack": "^5.99.4",
51
+ "webpack": "^5.99.7",
52
52
  "webpack-cli": "^5.1.4"
53
53
  }
54
54
  }
package/src/index.css CHANGED
@@ -13,6 +13,7 @@
13
13
  @import "@simplybusiness/mobius-journey/src/components/ErrorBoundary/ErrorBoundary.css";
14
14
  @import "@simplybusiness/mobius-journey/src/components/Footer/Footer.css";
15
15
  @import "@simplybusiness/mobius-journey/src/components/Footer/MoneySuperMarketFooter/Footer.css";
16
+ @import "@simplybusiness/mobius-journey/src/components/Footer/CompareTheMarketFooter/Footer.css";
16
17
  @import "@simplybusiness/mobius-journey/src/components/Footer/StickyFooter.css";
17
18
  @import "@simplybusiness/mobius-journey/src/components/Header/Header.css";
18
19
  @import "@simplybusiness/mobius-journey/src/components/Headline/ExperimentIteratedQCP/EditLimitsExperimentIteratedQCP.css";
@@ -37,6 +38,7 @@
37
38
  @import "@simplybusiness/mobius-journey/src/components/Questionnaire/Section/Section.css";
38
39
  @import "@simplybusiness/mobius-journey/src/components/Questionnaire/Section/Submission.css";
39
40
  @import "@simplybusiness/mobius-journey/src/components/Questionnaire/SecurityLocks/SecurityLocks.css";
41
+ @import "@simplybusiness/mobius-journey/src/components/QuoteCards/LowestPrice/QuoteCard/LowestPriceHeader/LowestPriceHeader.css";
40
42
  @import "@simplybusiness/mobius-journey/src/components/QuoteCards/QuoteCard/ExperimentGridView/QuoteCard.css";
41
43
  @import "@simplybusiness/mobius-journey/src/components/QuoteCards/QuoteCard/ExperimentGridView/Coverage/Coverage.css";
42
44
  @import "@simplybusiness/mobius-journey/src/components/QuoteCards/QuoteCard/ExperimentGridView/Header/Header.css";
package/src/variables.css CHANGED
@@ -11,6 +11,7 @@
11
11
  --header-link-color: var(--color-secondary);
12
12
  --header-phone-icon-color: var(--color-secondary);
13
13
  --header-powered-by-icon-color: var(--color-text-medium);
14
+ --header-gap: 24px;
14
15
 
15
16
  /* Progress Steps */
16
17
  --progress-steps-shape-size: 44px;