@asante-org/atlascopco-vt-litesitegenerator 3.0.20 → 3.0.21
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/dist/index.esm.js +82 -23
- package/dist/index.esm.js.map +1 -1
- package/dist/index.esm.scss +302 -80
- package/dist/index.js +82 -23
- package/dist/index.js.map +1 -1
- package/dist/index.scss +302 -80
- package/dist/src/components/lsg/LsgBanner/LsgBanner.d.ts +30 -2
- package/dist/src/components/lsg/LsgBanner/LsgBanner.stories.d.ts +9 -2
- package/dist/src/components/lsg/LsgBanner/index.d.ts +1 -1
- package/dist/src/components/lsg/index.d.ts +1 -1
- package/dist/src/index.d.ts +1 -1
- package/dist/themes/theme-1.css +417 -40
- package/dist/themes/theme-1.css.map +1 -1
- package/dist/themes/theme-2.css +488 -40
- package/dist/themes/theme-2.css.map +1 -1
- package/dist/themes/theme-3.css +515 -40
- package/dist/themes/theme-3.css.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
package/dist/themes/theme-2.css
CHANGED
|
@@ -343,62 +343,173 @@
|
|
|
343
343
|
pointer-events: none;
|
|
344
344
|
}
|
|
345
345
|
|
|
346
|
+
.lsg-banner,
|
|
347
|
+
.lsg-banner * {
|
|
348
|
+
box-sizing: border-box;
|
|
349
|
+
}
|
|
350
|
+
|
|
346
351
|
.lsg-banner {
|
|
347
352
|
position: relative;
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
min-height: 400px;
|
|
351
|
-
padding: 72px 24px;
|
|
352
|
-
background-color: var(--lsg-color-dark);
|
|
353
|
-
color: var(--lsg-color-white);
|
|
353
|
+
width: 100%;
|
|
354
|
+
margin: 0;
|
|
354
355
|
overflow: hidden;
|
|
356
|
+
background: var(--lsg-color-light);
|
|
357
|
+
color: var(--lsg-color-black);
|
|
358
|
+
font-family: var(--lsg-font-family-primary);
|
|
355
359
|
}
|
|
356
|
-
.lsg-
|
|
357
|
-
position:
|
|
358
|
-
|
|
360
|
+
.lsg-banner__shell {
|
|
361
|
+
position: relative;
|
|
362
|
+
width: 100%;
|
|
363
|
+
min-width: 0;
|
|
359
364
|
}
|
|
360
|
-
.lsg-
|
|
365
|
+
.lsg-banner__media {
|
|
366
|
+
position: relative;
|
|
367
|
+
min-width: 0;
|
|
368
|
+
overflow: hidden;
|
|
369
|
+
}
|
|
370
|
+
.lsg-banner__image, .lsg-banner__video {
|
|
371
|
+
display: block;
|
|
361
372
|
width: 100%;
|
|
362
373
|
height: 100%;
|
|
363
374
|
object-fit: cover;
|
|
364
|
-
display: block;
|
|
365
|
-
}
|
|
366
|
-
.lsg-banner__background::after {
|
|
367
|
-
content: "";
|
|
368
|
-
position: absolute;
|
|
369
|
-
inset: 0;
|
|
370
|
-
background: linear-gradient(to right, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.15) 100%);
|
|
371
375
|
}
|
|
372
|
-
.lsg-
|
|
376
|
+
.lsg-banner__content {
|
|
373
377
|
position: relative;
|
|
374
378
|
z-index: 1;
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
padding: 0 24px;
|
|
379
|
+
display: flex;
|
|
380
|
+
flex-direction: column;
|
|
381
|
+
min-width: 0;
|
|
379
382
|
}
|
|
380
|
-
.lsg-
|
|
381
|
-
display:
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
383
|
+
.lsg-banner__pre-title {
|
|
384
|
+
display: inline-flex;
|
|
385
|
+
align-items: center;
|
|
386
|
+
align-self: flex-start;
|
|
387
|
+
gap: 8px;
|
|
388
|
+
max-width: 100%;
|
|
389
|
+
font-size: var(--lsg-size-Pretitle, 18px);
|
|
390
|
+
font-weight: 600;
|
|
391
|
+
line-height: 1.2;
|
|
385
392
|
text-transform: uppercase;
|
|
386
|
-
|
|
387
|
-
|
|
393
|
+
}
|
|
394
|
+
.lsg-banner__pre-title-marker {
|
|
395
|
+
display: none;
|
|
396
|
+
flex: 0 0 auto;
|
|
397
|
+
width: 10px;
|
|
398
|
+
height: 10px;
|
|
399
|
+
border-radius: 50%;
|
|
400
|
+
background: currentColor;
|
|
401
|
+
}
|
|
402
|
+
.lsg-banner__pre-title-text {
|
|
403
|
+
min-width: 0;
|
|
404
|
+
}
|
|
405
|
+
.lsg-banner__heading, .lsg-banner__body p {
|
|
406
|
+
margin: 0;
|
|
407
|
+
word-break: break-word;
|
|
388
408
|
}
|
|
389
409
|
.lsg-banner__heading {
|
|
390
|
-
font-
|
|
391
|
-
font-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
max-width: 720px;
|
|
410
|
+
font-family: var(--lsg-font-family-primary);
|
|
411
|
+
font-size: var(--lsg-size-H1, 45px);
|
|
412
|
+
font-weight: 600;
|
|
413
|
+
line-height: 1.1;
|
|
395
414
|
}
|
|
396
|
-
.lsg-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
415
|
+
.lsg-banner__body {
|
|
416
|
+
min-width: 0;
|
|
417
|
+
font-size: var(--lsg-size-body, 18px);
|
|
418
|
+
font-weight: 400;
|
|
419
|
+
line-height: 1.5;
|
|
420
|
+
}
|
|
421
|
+
.lsg-banner__actions {
|
|
422
|
+
display: flex;
|
|
423
|
+
flex-wrap: wrap;
|
|
424
|
+
align-items: center;
|
|
425
|
+
gap: 16px;
|
|
426
|
+
}
|
|
427
|
+
.lsg-banner__cta {
|
|
428
|
+
flex: 0 0 auto;
|
|
429
|
+
}
|
|
430
|
+
.lsg-banner--text-only .lsg-banner__media {
|
|
431
|
+
display: none;
|
|
432
|
+
}
|
|
433
|
+
|
|
434
|
+
@media (min-width: 768px) {
|
|
435
|
+
.lsg-banner--media-left .lsg-banner__shell, .lsg-banner--media-right .lsg-banner__shell, .lsg-banner--media-left-compact .lsg-banner__shell, .lsg-banner--media-right-compact .lsg-banner__shell {
|
|
436
|
+
display: grid;
|
|
437
|
+
align-items: stretch;
|
|
438
|
+
}
|
|
439
|
+
.lsg-banner--media-left .lsg-banner__shell, .lsg-banner--media-left-compact .lsg-banner__shell {
|
|
440
|
+
grid-template-areas: "media content";
|
|
441
|
+
}
|
|
442
|
+
.lsg-banner--media-right .lsg-banner__shell, .lsg-banner--media-right-compact .lsg-banner__shell {
|
|
443
|
+
grid-template-areas: "content media";
|
|
444
|
+
}
|
|
445
|
+
.lsg-banner--media-left .lsg-banner__media, .lsg-banner--media-right .lsg-banner__media, .lsg-banner--media-left-compact .lsg-banner__media, .lsg-banner--media-right-compact .lsg-banner__media {
|
|
446
|
+
grid-area: media;
|
|
447
|
+
}
|
|
448
|
+
.lsg-banner--media-left .lsg-banner__content, .lsg-banner--media-right .lsg-banner__content, .lsg-banner--media-left-compact .lsg-banner__content, .lsg-banner--media-right-compact .lsg-banner__content {
|
|
449
|
+
grid-area: content;
|
|
450
|
+
}
|
|
451
|
+
.lsg-banner--media-left .lsg-banner__shell, .lsg-banner--media-right .lsg-banner__shell {
|
|
452
|
+
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
|
|
453
|
+
}
|
|
454
|
+
.lsg-banner--media-left-compact .lsg-banner__shell {
|
|
455
|
+
grid-template-columns: minmax(280px, 0.7fr) minmax(0, 1.3fr);
|
|
456
|
+
}
|
|
457
|
+
.lsg-banner--media-right-compact .lsg-banner__shell {
|
|
458
|
+
grid-template-columns: minmax(0, 1.3fr) minmax(280px, 0.7fr);
|
|
459
|
+
}
|
|
460
|
+
.lsg-banner--overlay .lsg-banner__shell, .lsg-banner--overlay-transparent .lsg-banner__shell {
|
|
461
|
+
display: grid;
|
|
462
|
+
place-items: stretch;
|
|
463
|
+
}
|
|
464
|
+
.lsg-banner--overlay .lsg-banner__media, .lsg-banner--overlay-transparent .lsg-banner__media, .lsg-banner--overlay .lsg-banner__content, .lsg-banner--overlay-transparent .lsg-banner__content {
|
|
465
|
+
grid-area: 1/1;
|
|
466
|
+
}
|
|
467
|
+
.lsg-banner--overlay .lsg-banner__media, .lsg-banner--overlay-transparent .lsg-banner__media {
|
|
468
|
+
z-index: 0;
|
|
469
|
+
min-height: inherit;
|
|
470
|
+
}
|
|
471
|
+
.lsg-banner--overlay .lsg-banner__content, .lsg-banner--overlay-transparent .lsg-banner__content {
|
|
472
|
+
align-self: center;
|
|
473
|
+
}
|
|
474
|
+
}
|
|
475
|
+
@media (max-width: 767px) {
|
|
476
|
+
.lsg-banner__heading {
|
|
477
|
+
font-size: 30px;
|
|
478
|
+
line-height: 1.2;
|
|
479
|
+
}
|
|
480
|
+
.lsg-banner__pre-title {
|
|
481
|
+
font-size: 16px;
|
|
482
|
+
}
|
|
483
|
+
.lsg-banner__body {
|
|
484
|
+
font-size: 18px;
|
|
485
|
+
line-height: 1.5;
|
|
486
|
+
}
|
|
487
|
+
.lsg-banner--media-left .lsg-banner__shell, .lsg-banner--media-right .lsg-banner__shell, .lsg-banner--media-left-compact .lsg-banner__shell, .lsg-banner--media-right-compact .lsg-banner__shell {
|
|
488
|
+
display: flex;
|
|
489
|
+
flex-direction: column;
|
|
490
|
+
}
|
|
491
|
+
.lsg-banner--mobile-media-top .lsg-banner__media {
|
|
492
|
+
order: 1;
|
|
493
|
+
}
|
|
494
|
+
.lsg-banner--mobile-media-top .lsg-banner__content {
|
|
495
|
+
order: 2;
|
|
496
|
+
}
|
|
497
|
+
.lsg-banner--mobile-media-bottom .lsg-banner__content {
|
|
498
|
+
order: 1;
|
|
499
|
+
}
|
|
500
|
+
.lsg-banner--mobile-media-bottom .lsg-banner__media {
|
|
501
|
+
order: 2;
|
|
502
|
+
}
|
|
503
|
+
.lsg-banner--overlay .lsg-banner__shell, .lsg-banner--overlay-transparent .lsg-banner__shell {
|
|
504
|
+
display: grid;
|
|
505
|
+
place-items: stretch;
|
|
506
|
+
}
|
|
507
|
+
.lsg-banner--overlay .lsg-banner__media, .lsg-banner--overlay-transparent .lsg-banner__media, .lsg-banner--overlay .lsg-banner__content, .lsg-banner--overlay-transparent .lsg-banner__content {
|
|
508
|
+
grid-area: 1/1;
|
|
509
|
+
}
|
|
510
|
+
.lsg-banner--overlay .lsg-banner__content, .lsg-banner--overlay-transparent .lsg-banner__content {
|
|
511
|
+
align-self: center;
|
|
512
|
+
}
|
|
402
513
|
}
|
|
403
514
|
.lsg-card,
|
|
404
515
|
.lsg-card *,
|
|
@@ -5159,6 +5270,343 @@
|
|
|
5159
5270
|
line-height: 1.2;
|
|
5160
5271
|
}
|
|
5161
5272
|
|
|
5273
|
+
:root[data-lsg-theme=theme-2] .lsg-banner,
|
|
5274
|
+
.lsg-themed-component--theme-2 .lsg-banner {
|
|
5275
|
+
background: var(--lsg-color-light);
|
|
5276
|
+
color: var(--lsg-color-black);
|
|
5277
|
+
}
|
|
5278
|
+
:root[data-lsg-theme=theme-2] .lsg-banner__media, :root[data-lsg-theme=theme-2] .lsg-banner__image, :root[data-lsg-theme=theme-2] .lsg-banner__video,
|
|
5279
|
+
.lsg-themed-component--theme-2 .lsg-banner__media,
|
|
5280
|
+
.lsg-themed-component--theme-2 .lsg-banner__image,
|
|
5281
|
+
.lsg-themed-component--theme-2 .lsg-banner__video {
|
|
5282
|
+
border-radius: 10px;
|
|
5283
|
+
}
|
|
5284
|
+
:root[data-lsg-theme=theme-2] .lsg-banner__pre-title,
|
|
5285
|
+
.lsg-themed-component--theme-2 .lsg-banner__pre-title {
|
|
5286
|
+
width: 100%;
|
|
5287
|
+
padding-bottom: 16px;
|
|
5288
|
+
color: var(--lsg-color-black);
|
|
5289
|
+
border-bottom: 4px solid var(--lsg-color-primary);
|
|
5290
|
+
}
|
|
5291
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left .lsg-banner__shell, :root[data-lsg-theme=theme-2] .lsg-banner--media-right .lsg-banner__shell,
|
|
5292
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left .lsg-banner__shell,
|
|
5293
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right .lsg-banner__shell {
|
|
5294
|
+
min-height: 600px;
|
|
5295
|
+
grid-template-columns: minmax(0, 480px) minmax(0, 480px);
|
|
5296
|
+
justify-content: center;
|
|
5297
|
+
gap: 80px;
|
|
5298
|
+
padding: 64px 32px;
|
|
5299
|
+
}
|
|
5300
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left .lsg-banner__media, :root[data-lsg-theme=theme-2] .lsg-banner--media-right .lsg-banner__media,
|
|
5301
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left .lsg-banner__media,
|
|
5302
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right .lsg-banner__media {
|
|
5303
|
+
height: 379px;
|
|
5304
|
+
}
|
|
5305
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left .lsg-banner__content, :root[data-lsg-theme=theme-2] .lsg-banner--media-right .lsg-banner__content,
|
|
5306
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left .lsg-banner__content,
|
|
5307
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right .lsg-banner__content {
|
|
5308
|
+
min-height: 379px;
|
|
5309
|
+
gap: 32px;
|
|
5310
|
+
}
|
|
5311
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left .lsg-banner__actions, :root[data-lsg-theme=theme-2] .lsg-banner--media-right .lsg-banner__actions,
|
|
5312
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left .lsg-banner__actions,
|
|
5313
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right .lsg-banner__actions {
|
|
5314
|
+
position: absolute;
|
|
5315
|
+
right: 0;
|
|
5316
|
+
bottom: -66px;
|
|
5317
|
+
}
|
|
5318
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left .lsg-banner__actions::before, :root[data-lsg-theme=theme-2] .lsg-banner--media-right .lsg-banner__actions::before,
|
|
5319
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left .lsg-banner__actions::before,
|
|
5320
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right .lsg-banner__actions::before {
|
|
5321
|
+
content: "";
|
|
5322
|
+
position: absolute;
|
|
5323
|
+
top: 50%;
|
|
5324
|
+
right: calc(100% + 64px);
|
|
5325
|
+
width: min(72vw, 1023px);
|
|
5326
|
+
border-top: 4px solid var(--lsg-color-primary);
|
|
5327
|
+
transform: translateY(-50%);
|
|
5328
|
+
}
|
|
5329
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-right .lsg-banner__actions,
|
|
5330
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right .lsg-banner__actions {
|
|
5331
|
+
right: auto;
|
|
5332
|
+
left: 0;
|
|
5333
|
+
}
|
|
5334
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-right .lsg-banner__actions::before,
|
|
5335
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right .lsg-banner__actions::before {
|
|
5336
|
+
right: auto;
|
|
5337
|
+
left: calc(100% + 64px);
|
|
5338
|
+
}
|
|
5339
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left-compact, :root[data-lsg-theme=theme-2] .lsg-banner--media-right-compact,
|
|
5340
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left-compact,
|
|
5341
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right-compact {
|
|
5342
|
+
background: var(--lsg-color-secondary);
|
|
5343
|
+
}
|
|
5344
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left-compact .lsg-banner__shell, :root[data-lsg-theme=theme-2] .lsg-banner--media-right-compact .lsg-banner__shell,
|
|
5345
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left-compact .lsg-banner__shell,
|
|
5346
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right-compact .lsg-banner__shell {
|
|
5347
|
+
min-height: 600px;
|
|
5348
|
+
grid-template-columns: minmax(0, 344px) minmax(0, 1fr);
|
|
5349
|
+
gap: 80px;
|
|
5350
|
+
padding: 96px clamp(120px, 13.89vw, 200px);
|
|
5351
|
+
isolation: isolate;
|
|
5352
|
+
}
|
|
5353
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left-compact .lsg-banner__shell::before, :root[data-lsg-theme=theme-2] .lsg-banner--media-right-compact .lsg-banner__shell::before,
|
|
5354
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left-compact .lsg-banner__shell::before,
|
|
5355
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right-compact .lsg-banner__shell::before {
|
|
5356
|
+
content: "";
|
|
5357
|
+
position: absolute;
|
|
5358
|
+
z-index: -1;
|
|
5359
|
+
inset: 64px 100px;
|
|
5360
|
+
background: var(--lsg-color-white);
|
|
5361
|
+
border-radius: 10px;
|
|
5362
|
+
}
|
|
5363
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left-compact .lsg-banner__media, :root[data-lsg-theme=theme-2] .lsg-banner--media-right-compact .lsg-banner__media,
|
|
5364
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left-compact .lsg-banner__media,
|
|
5365
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right-compact .lsg-banner__media {
|
|
5366
|
+
height: 408px;
|
|
5367
|
+
}
|
|
5368
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left-compact .lsg-banner__content, :root[data-lsg-theme=theme-2] .lsg-banner--media-right-compact .lsg-banner__content,
|
|
5369
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left-compact .lsg-banner__content,
|
|
5370
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right-compact .lsg-banner__content {
|
|
5371
|
+
justify-content: space-between;
|
|
5372
|
+
gap: 24px;
|
|
5373
|
+
}
|
|
5374
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left-compact .lsg-banner__pre-title, :root[data-lsg-theme=theme-2] .lsg-banner--media-right-compact .lsg-banner__pre-title,
|
|
5375
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left-compact .lsg-banner__pre-title,
|
|
5376
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right-compact .lsg-banner__pre-title {
|
|
5377
|
+
padding: 0;
|
|
5378
|
+
border: 0;
|
|
5379
|
+
}
|
|
5380
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left-compact .lsg-banner__heading, :root[data-lsg-theme=theme-2] .lsg-banner--media-right-compact .lsg-banner__heading,
|
|
5381
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left-compact .lsg-banner__heading,
|
|
5382
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right-compact .lsg-banner__heading {
|
|
5383
|
+
padding: 24px;
|
|
5384
|
+
background: var(--lsg-color-tertiary);
|
|
5385
|
+
border-radius: 10px;
|
|
5386
|
+
color: var(--lsg-color-white);
|
|
5387
|
+
}
|
|
5388
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left-compact .lsg-banner__body, :root[data-lsg-theme=theme-2] .lsg-banner--media-right-compact .lsg-banner__body,
|
|
5389
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left-compact .lsg-banner__body,
|
|
5390
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right-compact .lsg-banner__body {
|
|
5391
|
+
padding-top: 24px;
|
|
5392
|
+
border-top: 4px solid var(--lsg-color-tertiary);
|
|
5393
|
+
}
|
|
5394
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left-compact .lsg-banner__cta.lsg-button--primary, :root[data-lsg-theme=theme-2] .lsg-banner--media-right-compact .lsg-banner__cta.lsg-button--primary,
|
|
5395
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left-compact .lsg-banner__cta.lsg-button--primary,
|
|
5396
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right-compact .lsg-banner__cta.lsg-button--primary {
|
|
5397
|
+
background: transparent;
|
|
5398
|
+
border-color: var(--lsg-color-dark);
|
|
5399
|
+
color: var(--lsg-color-black);
|
|
5400
|
+
}
|
|
5401
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-right-compact .lsg-banner__shell,
|
|
5402
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right-compact .lsg-banner__shell {
|
|
5403
|
+
grid-template-columns: minmax(0, 1fr) minmax(0, 344px);
|
|
5404
|
+
}
|
|
5405
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay, :root[data-lsg-theme=theme-2] .lsg-banner--overlay-transparent,
|
|
5406
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay,
|
|
5407
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay-transparent {
|
|
5408
|
+
background: var(--lsg-color-light);
|
|
5409
|
+
}
|
|
5410
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay .lsg-banner__shell,
|
|
5411
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay .lsg-banner__media, :root[data-lsg-theme=theme-2] .lsg-banner--overlay-transparent .lsg-banner__shell,
|
|
5412
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay-transparent .lsg-banner__media,
|
|
5413
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay .lsg-banner__shell,
|
|
5414
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay .lsg-banner__media,
|
|
5415
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay-transparent .lsg-banner__shell,
|
|
5416
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay-transparent .lsg-banner__media {
|
|
5417
|
+
min-height: 624px;
|
|
5418
|
+
}
|
|
5419
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay .lsg-banner__content, :root[data-lsg-theme=theme-2] .lsg-banner--overlay-transparent .lsg-banner__content,
|
|
5420
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay .lsg-banner__content,
|
|
5421
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay-transparent .lsg-banner__content {
|
|
5422
|
+
display: grid;
|
|
5423
|
+
grid-template-columns: minmax(0, 1fr) auto;
|
|
5424
|
+
gap: 56px 32px;
|
|
5425
|
+
width: min(1000px, 100% - 64px);
|
|
5426
|
+
margin: auto;
|
|
5427
|
+
padding: 44px 64px;
|
|
5428
|
+
background: var(--lsg-color-secondary);
|
|
5429
|
+
border-radius: 10px;
|
|
5430
|
+
color: var(--lsg-color-white);
|
|
5431
|
+
}
|
|
5432
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay .lsg-banner__pre-title, :root[data-lsg-theme=theme-2] .lsg-banner--overlay-transparent .lsg-banner__pre-title,
|
|
5433
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay .lsg-banner__pre-title,
|
|
5434
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay-transparent .lsg-banner__pre-title {
|
|
5435
|
+
display: none;
|
|
5436
|
+
}
|
|
5437
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay .lsg-banner__heading, :root[data-lsg-theme=theme-2] .lsg-banner--overlay-transparent .lsg-banner__heading,
|
|
5438
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay .lsg-banner__heading,
|
|
5439
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay-transparent .lsg-banner__heading {
|
|
5440
|
+
grid-column: 1/-1;
|
|
5441
|
+
max-width: 700px;
|
|
5442
|
+
padding-bottom: 56px;
|
|
5443
|
+
border-bottom: 4px solid var(--lsg-color-white);
|
|
5444
|
+
}
|
|
5445
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay .lsg-banner__body, :root[data-lsg-theme=theme-2] .lsg-banner--overlay-transparent .lsg-banner__body,
|
|
5446
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay .lsg-banner__body,
|
|
5447
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay-transparent .lsg-banner__body {
|
|
5448
|
+
align-self: center;
|
|
5449
|
+
}
|
|
5450
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay .lsg-banner__actions, :root[data-lsg-theme=theme-2] .lsg-banner--overlay-transparent .lsg-banner__actions,
|
|
5451
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay .lsg-banner__actions,
|
|
5452
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay-transparent .lsg-banner__actions {
|
|
5453
|
+
justify-self: end;
|
|
5454
|
+
}
|
|
5455
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay .lsg-banner__cta, :root[data-lsg-theme=theme-2] .lsg-banner--overlay-transparent .lsg-banner__cta,
|
|
5456
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay .lsg-banner__cta,
|
|
5457
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay-transparent .lsg-banner__cta {
|
|
5458
|
+
background: transparent;
|
|
5459
|
+
border-color: var(--lsg-color-white);
|
|
5460
|
+
color: var(--lsg-color-white);
|
|
5461
|
+
}
|
|
5462
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay-transparent .lsg-banner__content,
|
|
5463
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay-transparent .lsg-banner__content {
|
|
5464
|
+
background: color-mix(in srgb, var(--lsg-color-secondary) 82%, transparent);
|
|
5465
|
+
}
|
|
5466
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--text-only,
|
|
5467
|
+
.lsg-themed-component--theme-2 .lsg-banner--text-only {
|
|
5468
|
+
background: var(--lsg-color-tertiary);
|
|
5469
|
+
}
|
|
5470
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--text-only .lsg-banner__content,
|
|
5471
|
+
.lsg-themed-component--theme-2 .lsg-banner--text-only .lsg-banner__content {
|
|
5472
|
+
display: grid;
|
|
5473
|
+
grid-template-columns: minmax(0, 1fr) auto;
|
|
5474
|
+
gap: 48px 32px;
|
|
5475
|
+
padding: 64px clamp(32px, 13.89vw, 200px);
|
|
5476
|
+
color: var(--lsg-color-white);
|
|
5477
|
+
}
|
|
5478
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--text-only .lsg-banner__pre-title,
|
|
5479
|
+
.lsg-themed-component--theme-2 .lsg-banner--text-only .lsg-banner__pre-title {
|
|
5480
|
+
display: none;
|
|
5481
|
+
}
|
|
5482
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--text-only .lsg-banner__heading,
|
|
5483
|
+
.lsg-themed-component--theme-2 .lsg-banner--text-only .lsg-banner__heading {
|
|
5484
|
+
grid-column: 1/-1;
|
|
5485
|
+
max-width: 700px;
|
|
5486
|
+
padding-bottom: 48px;
|
|
5487
|
+
border-bottom: 4px solid var(--lsg-color-white);
|
|
5488
|
+
}
|
|
5489
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--text-only .lsg-banner__actions,
|
|
5490
|
+
.lsg-themed-component--theme-2 .lsg-banner--text-only .lsg-banner__actions {
|
|
5491
|
+
grid-column: 1;
|
|
5492
|
+
}
|
|
5493
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--text-only .lsg-banner__body,
|
|
5494
|
+
.lsg-themed-component--theme-2 .lsg-banner--text-only .lsg-banner__body {
|
|
5495
|
+
grid-column: 2;
|
|
5496
|
+
align-self: center;
|
|
5497
|
+
}
|
|
5498
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--text-only .lsg-banner__cta,
|
|
5499
|
+
.lsg-themed-component--theme-2 .lsg-banner--text-only .lsg-banner__cta {
|
|
5500
|
+
background: transparent;
|
|
5501
|
+
border-color: var(--lsg-color-white);
|
|
5502
|
+
color: var(--lsg-color-white);
|
|
5503
|
+
}
|
|
5504
|
+
@media (max-width: 767px) {
|
|
5505
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left .lsg-banner__shell, :root[data-lsg-theme=theme-2] .lsg-banner--media-right .lsg-banner__shell,
|
|
5506
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left .lsg-banner__shell,
|
|
5507
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right .lsg-banner__shell {
|
|
5508
|
+
min-height: 0;
|
|
5509
|
+
gap: 22px;
|
|
5510
|
+
padding: 64px 16px;
|
|
5511
|
+
}
|
|
5512
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left .lsg-banner__media, :root[data-lsg-theme=theme-2] .lsg-banner--media-right .lsg-banner__media,
|
|
5513
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left .lsg-banner__media,
|
|
5514
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right .lsg-banner__media {
|
|
5515
|
+
width: 100%;
|
|
5516
|
+
height: auto;
|
|
5517
|
+
aspect-ratio: 1/1;
|
|
5518
|
+
}
|
|
5519
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left .lsg-banner__content, :root[data-lsg-theme=theme-2] .lsg-banner--media-right .lsg-banner__content,
|
|
5520
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left .lsg-banner__content,
|
|
5521
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right .lsg-banner__content {
|
|
5522
|
+
min-height: 0;
|
|
5523
|
+
gap: 32px;
|
|
5524
|
+
padding: 0 8px;
|
|
5525
|
+
}
|
|
5526
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left .lsg-banner__actions, :root[data-lsg-theme=theme-2] .lsg-banner--media-right .lsg-banner__actions,
|
|
5527
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left .lsg-banner__actions,
|
|
5528
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right .lsg-banner__actions {
|
|
5529
|
+
position: relative;
|
|
5530
|
+
right: auto;
|
|
5531
|
+
bottom: auto;
|
|
5532
|
+
left: auto;
|
|
5533
|
+
margin-top: 8px;
|
|
5534
|
+
}
|
|
5535
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left .lsg-banner__actions::before, :root[data-lsg-theme=theme-2] .lsg-banner--media-right .lsg-banner__actions::before,
|
|
5536
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left .lsg-banner__actions::before,
|
|
5537
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right .lsg-banner__actions::before {
|
|
5538
|
+
top: 50%;
|
|
5539
|
+
right: auto;
|
|
5540
|
+
left: calc(100% + 16px);
|
|
5541
|
+
width: 100vw;
|
|
5542
|
+
}
|
|
5543
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left-compact .lsg-banner__shell, :root[data-lsg-theme=theme-2] .lsg-banner--media-right-compact .lsg-banner__shell,
|
|
5544
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left-compact .lsg-banner__shell,
|
|
5545
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right-compact .lsg-banner__shell {
|
|
5546
|
+
min-height: 0;
|
|
5547
|
+
gap: 22px;
|
|
5548
|
+
padding: 64px 16px;
|
|
5549
|
+
}
|
|
5550
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left-compact .lsg-banner__shell::before, :root[data-lsg-theme=theme-2] .lsg-banner--media-right-compact .lsg-banner__shell::before,
|
|
5551
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left-compact .lsg-banner__shell::before,
|
|
5552
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right-compact .lsg-banner__shell::before {
|
|
5553
|
+
inset: 48px 8px;
|
|
5554
|
+
}
|
|
5555
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left-compact .lsg-banner__media, :root[data-lsg-theme=theme-2] .lsg-banner--media-right-compact .lsg-banner__media,
|
|
5556
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left-compact .lsg-banner__media,
|
|
5557
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right-compact .lsg-banner__media {
|
|
5558
|
+
width: 100%;
|
|
5559
|
+
height: auto;
|
|
5560
|
+
aspect-ratio: 1/1;
|
|
5561
|
+
}
|
|
5562
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--media-left-compact .lsg-banner__content, :root[data-lsg-theme=theme-2] .lsg-banner--media-right-compact .lsg-banner__content,
|
|
5563
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-left-compact .lsg-banner__content,
|
|
5564
|
+
.lsg-themed-component--theme-2 .lsg-banner--media-right-compact .lsg-banner__content {
|
|
5565
|
+
gap: 24px;
|
|
5566
|
+
padding: 24px 16px;
|
|
5567
|
+
}
|
|
5568
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay .lsg-banner__shell,
|
|
5569
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay .lsg-banner__media, :root[data-lsg-theme=theme-2] .lsg-banner--overlay-transparent .lsg-banner__shell,
|
|
5570
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay-transparent .lsg-banner__media,
|
|
5571
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay .lsg-banner__shell,
|
|
5572
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay .lsg-banner__media,
|
|
5573
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay-transparent .lsg-banner__shell,
|
|
5574
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay-transparent .lsg-banner__media {
|
|
5575
|
+
min-height: 761px;
|
|
5576
|
+
}
|
|
5577
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay .lsg-banner__content, :root[data-lsg-theme=theme-2] .lsg-banner--overlay-transparent .lsg-banner__content,
|
|
5578
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay .lsg-banner__content,
|
|
5579
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay-transparent .lsg-banner__content {
|
|
5580
|
+
display: flex;
|
|
5581
|
+
width: calc(100% - 32px);
|
|
5582
|
+
flex-direction: column;
|
|
5583
|
+
gap: 32px;
|
|
5584
|
+
margin: 64px 16px;
|
|
5585
|
+
padding: 40px 24px;
|
|
5586
|
+
}
|
|
5587
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay .lsg-banner__heading, :root[data-lsg-theme=theme-2] .lsg-banner--overlay-transparent .lsg-banner__heading,
|
|
5588
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay .lsg-banner__heading,
|
|
5589
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay-transparent .lsg-banner__heading {
|
|
5590
|
+
padding-bottom: 32px;
|
|
5591
|
+
}
|
|
5592
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--overlay .lsg-banner__actions, :root[data-lsg-theme=theme-2] .lsg-banner--overlay-transparent .lsg-banner__actions,
|
|
5593
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay .lsg-banner__actions,
|
|
5594
|
+
.lsg-themed-component--theme-2 .lsg-banner--overlay-transparent .lsg-banner__actions {
|
|
5595
|
+
align-self: flex-start;
|
|
5596
|
+
}
|
|
5597
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--text-only .lsg-banner__content,
|
|
5598
|
+
.lsg-themed-component--theme-2 .lsg-banner--text-only .lsg-banner__content {
|
|
5599
|
+
display: flex;
|
|
5600
|
+
flex-direction: column;
|
|
5601
|
+
gap: 32px;
|
|
5602
|
+
padding: 64px 16px;
|
|
5603
|
+
}
|
|
5604
|
+
:root[data-lsg-theme=theme-2] .lsg-banner--text-only .lsg-banner__heading,
|
|
5605
|
+
.lsg-themed-component--theme-2 .lsg-banner--text-only .lsg-banner__heading {
|
|
5606
|
+
padding-bottom: 32px;
|
|
5607
|
+
}
|
|
5608
|
+
}
|
|
5609
|
+
|
|
5162
5610
|
:root {
|
|
5163
5611
|
--lsg-color-primary: #0f766e;
|
|
5164
5612
|
--lsg-color-secondary: #334155;
|