sempli-website-lib 5.2.3 → 5.3.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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sempli-website-lib",
3
- "version": "5.2.3",
3
+ "version": "5.3.0",
4
4
  "peerDependencies": {
5
5
  "@angular/common": "~13.3.4",
6
6
  "@angular/core": "~13.3.4",
@@ -12003,7 +12003,7 @@ $breakPoints: (
12003
12003
  .container {
12004
12004
  max-width: 1200px;
12005
12005
  margin: 0 auto;
12006
- padding: 0 10px;
12006
+ padding: 20px 10px;
12007
12007
 
12008
12008
  @include responsive($breakpoint-medium) {
12009
12009
  padding: 0 20px;
@@ -15104,7 +15104,8 @@ ul.list-view {
15104
15104
  }
15105
15105
  }
15106
15106
 
15107
- .credit-simulation-table {
15107
+ .credit-simulation-table,
15108
+ .costs-table {
15108
15109
 
15109
15110
  @include responsive-max($breakpoint-small) {
15110
15111
  max-width: 100%;
@@ -15150,7 +15151,15 @@ ul.list-view {
15150
15151
  display: grid;
15151
15152
  grid-template-columns: repeat(5, 1fr);
15152
15153
  border-bottom: 1px solid $color-secondary-light;
15153
-
15154
+ &.4-column {
15155
+ grid-template-columns: repeat(4, 1fr);
15156
+ }
15157
+ &.3-column {
15158
+ grid-template-columns: repeat(3, 1fr);
15159
+ }
15160
+ &.2-column {
15161
+ grid-template-columns: repeat(2, 1fr);
15162
+ }
15154
15163
  .table-cell {
15155
15164
  color: $color-secondary;
15156
15165
  font-size: rem-calc(13px);
@@ -12003,7 +12003,7 @@ $breakPoints: (
12003
12003
  .container {
12004
12004
  max-width: 1200px;
12005
12005
  margin: 0 auto;
12006
- padding: 0 10px;
12006
+ padding: 20px 10px;
12007
12007
 
12008
12008
  @include responsive($breakpoint-medium) {
12009
12009
  padding: 0 20px;
@@ -13994,7 +13994,7 @@ header#main-header {
13994
13994
 
13995
13995
  a {
13996
13996
  display: block;
13997
- background: url("/assets/swl/interface/sempli-logo-black.svg") no-repeat 50% 50%;
13997
+ background: url("/assets/swl/interface/sempli-logo.svg") no-repeat 50% 50%;
13998
13998
  background-size: 100px 26px;
13999
13999
  height: 0;
14000
14000
  width: 100px;
@@ -15909,10 +15909,6 @@ section.hero-wrapper {
15909
15909
  padding: 100px 0;
15910
15910
  }
15911
15911
 
15912
- // @include responsive($breakpoint-xmedium) {
15913
- // padding: 200px 0;
15914
- // }
15915
-
15916
15912
  // Compact Layout Option
15917
15913
  &.compact {
15918
15914
  @include background-image(linear-gradient(#ffffff, #f5f6fa));
@@ -16178,6 +16174,21 @@ section.hero-wrapper {
16178
16174
  }
16179
16175
  }
16180
16176
 
16177
+ &.sempli-how,
16178
+ &.sempli-comfama {
16179
+ @include responsive($breakpoint-large) {
16180
+ background: url("/assets/swl/interface/illustration-10.webp") no-repeat 110% 50%;
16181
+ @include background-retina("/assets/swl/interface/illustration-10.webp", 400px, 370px);
16182
+ background-size: auto 450px;
16183
+ margin-bottom: 40px;
16184
+ }
16185
+
16186
+ @include responsive($breakpoint-xlarge) {
16187
+ background-position: 90% 60%;
16188
+ background-size: auto 500px;
16189
+ }
16190
+ }
16191
+
16181
16192
  // Confirmación de Email
16182
16193
  &.email-confirmation.index,
16183
16194
  &.legal-authorization.index,
@@ -16377,6 +16388,21 @@ section.hero-wrapper {
16377
16388
  }
16378
16389
  }
16379
16390
 
16391
+ &.sempli-how,
16392
+ &.sempli-comfama {
16393
+ @include responsive($breakpoint-large) {
16394
+ background: url("/assets/swl/interface/illustration-10.png") no-repeat 110% 50%;
16395
+ @include background-retina("/assets/swl/interface/illustration-10.webp", 400px, 370px);
16396
+ background-size: auto 450px;
16397
+ margin-bottom: 40px;
16398
+ }
16399
+
16400
+ @include responsive($breakpoint-xlarge) {
16401
+ background-position: 90% 60%;
16402
+ background-size: auto 500px;
16403
+ }
16404
+ }
16405
+
16380
16406
  // Confirmación de Email
16381
16407
  &.email-confirmation.index,
16382
16408
  &.legal-authorization.index,
@@ -18131,7 +18157,8 @@ ul.list-view {
18131
18157
  }
18132
18158
  }
18133
18159
 
18134
- .credit-simulation-table {
18160
+ .credit-simulation-table,
18161
+ .costs-table {
18135
18162
 
18136
18163
  @include responsive-max($breakpoint-small) {
18137
18164
  max-width: 100%;
@@ -18177,7 +18204,15 @@ ul.list-view {
18177
18204
  display: grid;
18178
18205
  grid-template-columns: repeat(5, 1fr);
18179
18206
  border-bottom: 1px solid $color-secondary-light;
18180
-
18207
+ &.4-column {
18208
+ grid-template-columns: repeat(4, 1fr);
18209
+ }
18210
+ &.3-column {
18211
+ grid-template-columns: repeat(3, 1fr);
18212
+ }
18213
+ &.2-column {
18214
+ grid-template-columns: repeat(2, 1fr);
18215
+ }
18181
18216
  .table-cell {
18182
18217
  color: $color-secondary;
18183
18218
  font-size: rem-calc(13px);
@@ -91,7 +91,7 @@ $breakPoints: (
91
91
  .container {
92
92
  max-width: 1200px;
93
93
  margin: 0 auto;
94
- padding: 0 10px;
94
+ padding: 20px 10px;
95
95
 
96
96
  @include responsive($breakpoint-medium) {
97
97
  padding: 0 20px;
@@ -657,7 +657,8 @@ ul.list-view {
657
657
  }
658
658
  }
659
659
 
660
- .credit-simulation-table {
660
+ .credit-simulation-table,
661
+ .costs-table {
661
662
 
662
663
  @include responsive-max($breakpoint-small) {
663
664
  max-width: 100%;
@@ -703,7 +704,15 @@ ul.list-view {
703
704
  display: grid;
704
705
  grid-template-columns: repeat(5, 1fr);
705
706
  border-bottom: 1px solid $color-secondary-light;
706
-
707
+ &.4-column {
708
+ grid-template-columns: repeat(4, 1fr);
709
+ }
710
+ &.3-column {
711
+ grid-template-columns: repeat(3, 1fr);
712
+ }
713
+ &.2-column {
714
+ grid-template-columns: repeat(2, 1fr);
715
+ }
707
716
  .table-cell {
708
717
  color: $color-secondary;
709
718
  font-size: rem-calc(13px);
@@ -33,7 +33,7 @@ header#main-header {
33
33
 
34
34
  a {
35
35
  display: block;
36
- background: url("/assets/swl/interface/sempli-logo-black.svg") no-repeat 50% 50%;
36
+ background: url("/assets/swl/interface/sempli-logo.svg") no-repeat 50% 50%;
37
37
  background-size: 100px 26px;
38
38
  height: 0;
39
39
  width: 100px;
@@ -12,10 +12,6 @@ section.hero-wrapper {
12
12
  padding: 100px 0;
13
13
  }
14
14
 
15
- // @include responsive($breakpoint-xmedium) {
16
- // padding: 200px 0;
17
- // }
18
-
19
15
  // Compact Layout Option
20
16
  &.compact {
21
17
  @include background-image(linear-gradient(#ffffff, #f5f6fa));
@@ -281,6 +277,21 @@ section.hero-wrapper {
281
277
  }
282
278
  }
283
279
 
280
+ &.sempli-how,
281
+ &.sempli-comfama {
282
+ @include responsive($breakpoint-large) {
283
+ background: url("/assets/swl/interface/illustration-10.webp") no-repeat 110% 50%;
284
+ @include background-retina("/assets/swl/interface/illustration-10.webp", 400px, 370px);
285
+ background-size: auto 450px;
286
+ margin-bottom: 40px;
287
+ }
288
+
289
+ @include responsive($breakpoint-xlarge) {
290
+ background-position: 90% 60%;
291
+ background-size: auto 500px;
292
+ }
293
+ }
294
+
284
295
  // Confirmación de Email
285
296
  &.email-confirmation.index,
286
297
  &.legal-authorization.index,
@@ -480,6 +491,21 @@ section.hero-wrapper {
480
491
  }
481
492
  }
482
493
 
494
+ &.sempli-how,
495
+ &.sempli-comfama {
496
+ @include responsive($breakpoint-large) {
497
+ background: url("/assets/swl/interface/illustration-10.png") no-repeat 110% 50%;
498
+ @include background-retina("/assets/swl/interface/illustration-10.webp", 400px, 370px);
499
+ background-size: auto 450px;
500
+ margin-bottom: 40px;
501
+ }
502
+
503
+ @include responsive($breakpoint-xlarge) {
504
+ background-position: 90% 60%;
505
+ background-size: auto 500px;
506
+ }
507
+ }
508
+
483
509
  // Confirmación de Email
484
510
  &.email-confirmation.index,
485
511
  &.legal-authorization.index,