@fundamental-styles/theming-preview 0.22.1-rc.1 → 0.23.0-rc.2

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.
@@ -1,6 +1,6 @@
1
1
  @charset "UTF-8";
2
2
  /*!
3
- * Fundamental Library Styles v0.22.1-rc.1
3
+ * Fundamental Library Styles v0.23.0-rc.2
4
4
  * Copyright (c) 2022 SAP SE or an SAP affiliate company.
5
5
  * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)
6
6
  */
@@ -12385,12 +12385,23 @@ fd-carousel:focus {
12385
12385
  padding: 0;
12386
12386
  margin: 0;
12387
12387
  border: 0;
12388
+ margin-left: -1rem;
12388
12389
  display: -webkit-box;
12389
12390
  display: -ms-flexbox;
12390
12391
  display: flex;
12391
- -webkit-box-pack: center;
12392
- -ms-flex-pack: center;
12393
- justify-content: center
12392
+ -webkit-box-pack: start;
12393
+ -ms-flex-pack: start;
12394
+ justify-content: flex-start;
12395
+ -webkit-box-align: center;
12396
+ -ms-flex-align: center;
12397
+ align-items: center;
12398
+ -ms-flex-wrap: wrap;
12399
+ flex-wrap: wrap;
12400
+ -webkit-box-orient: vertical;
12401
+ -webkit-box-direction: normal;
12402
+ -ms-flex-direction: column;
12403
+ flex-direction: column;
12404
+ margin-top: -1rem
12394
12405
  }
12395
12406
  .fd-fixed-card-layout__card-layout::after,
12396
12407
  .fd-fixed-card-layout__card-layout::before {
@@ -12398,45 +12409,310 @@ fd-carousel:focus {
12398
12409
  box-sizing: inherit;
12399
12410
  font-size: inherit
12400
12411
  }
12401
- .fd-fixed-card-layout__card-layout-column {
12402
- font-size: .875rem;
12403
- font-size: var(--sapFontSize,.875rem);
12404
- line-height: 1.4;
12405
- line-height: var(--sapContent_LineHeight,1.4);
12406
- color: #32363a;
12407
- color: var(--sapTextColor,#32363a);
12408
- font-family: "72","72full",Arial,Helvetica,sans-serif;
12409
- font-family: var(--sapFontFamily, "72", "72full", Arial, Helvetica, sans-serif);
12410
- font-weight: 400;
12411
- -webkit-box-sizing: border-box;
12412
- box-sizing: border-box;
12413
- padding: 0;
12414
- margin: 0;
12415
- border: 0;
12416
- -webkit-box-flex: 1;
12417
- -ms-flex: 1;
12418
- flex: 1;
12419
- margin-right: 1rem
12412
+ .fd-fixed-card-layout__card-layout[dir=rtl],
12413
+ [dir=rtl] .fd-fixed-card-layout__card-layout {
12414
+ margin-right: -1rem;
12415
+ margin-left: 0
12420
12416
  }
12421
- .fd-fixed-card-layout__card-layout-column::after,
12422
- .fd-fixed-card-layout__card-layout-column::before {
12423
- -webkit-box-sizing: inherit;
12424
- box-sizing: inherit;
12425
- font-size: inherit
12417
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-2 .fd-fixed-card-layout__card {
12418
+ width: 50%
12426
12419
  }
12427
- .fd-fixed-card-layout__card-layout-column:last-child {
12428
- margin-right: 0
12420
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-2 .fd-fixed-card-layout__card:nth-of-type(2n) {
12421
+ -webkit-box-ordinal-group: 3;
12422
+ -ms-flex-order: 2;
12423
+ order: 2
12429
12424
  }
12430
- .fd-fixed-card-layout__card-layout-column:last-child[dir=rtl],
12431
- [dir=rtl] .fd-fixed-card-layout__card-layout-column:last-child {
12432
- margin-left: 0
12425
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-2 .fd-fixed-card-layout__card:nth-of-type(2n+1) {
12426
+ -webkit-box-ordinal-group: 2;
12427
+ -ms-flex-order: 1;
12428
+ order: 1
12433
12429
  }
12434
- .fd-fixed-card-layout__card-layout-column[dir=rtl],
12435
- [dir=rtl] .fd-fixed-card-layout__card-layout-column {
12436
- margin-left: 1rem;
12437
- margin-right: 0
12430
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-3 .fd-fixed-card-layout__card {
12431
+ width: 33.3333333333%
12438
12432
  }
12439
- .fd-fixed-card-layout__card {
12433
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-3 .fd-fixed-card-layout__card:nth-of-type(3n) {
12434
+ -webkit-box-ordinal-group: 4;
12435
+ -ms-flex-order: 3;
12436
+ order: 3
12437
+ }
12438
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-3 .fd-fixed-card-layout__card:nth-of-type(3n+1) {
12439
+ -webkit-box-ordinal-group: 2;
12440
+ -ms-flex-order: 1;
12441
+ order: 1
12442
+ }
12443
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-3 .fd-fixed-card-layout__card:nth-of-type(3n+2) {
12444
+ -webkit-box-ordinal-group: 3;
12445
+ -ms-flex-order: 2;
12446
+ order: 2
12447
+ }
12448
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-4 .fd-fixed-card-layout__card {
12449
+ width: 25%
12450
+ }
12451
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-4 .fd-fixed-card-layout__card:nth-of-type(4n) {
12452
+ -webkit-box-ordinal-group: 5;
12453
+ -ms-flex-order: 4;
12454
+ order: 4
12455
+ }
12456
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-4 .fd-fixed-card-layout__card:nth-of-type(4n+1) {
12457
+ -webkit-box-ordinal-group: 2;
12458
+ -ms-flex-order: 1;
12459
+ order: 1
12460
+ }
12461
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-4 .fd-fixed-card-layout__card:nth-of-type(4n+2) {
12462
+ -webkit-box-ordinal-group: 3;
12463
+ -ms-flex-order: 2;
12464
+ order: 2
12465
+ }
12466
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-4 .fd-fixed-card-layout__card:nth-of-type(4n+3) {
12467
+ -webkit-box-ordinal-group: 4;
12468
+ -ms-flex-order: 3;
12469
+ order: 3
12470
+ }
12471
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-5 .fd-fixed-card-layout__card {
12472
+ width: 20%
12473
+ }
12474
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-5 .fd-fixed-card-layout__card:nth-of-type(5n) {
12475
+ -webkit-box-ordinal-group: 6;
12476
+ -ms-flex-order: 5;
12477
+ order: 5
12478
+ }
12479
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-5 .fd-fixed-card-layout__card:nth-of-type(5n+1) {
12480
+ -webkit-box-ordinal-group: 2;
12481
+ -ms-flex-order: 1;
12482
+ order: 1
12483
+ }
12484
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-5 .fd-fixed-card-layout__card:nth-of-type(5n+2) {
12485
+ -webkit-box-ordinal-group: 3;
12486
+ -ms-flex-order: 2;
12487
+ order: 2
12488
+ }
12489
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-5 .fd-fixed-card-layout__card:nth-of-type(5n+3) {
12490
+ -webkit-box-ordinal-group: 4;
12491
+ -ms-flex-order: 3;
12492
+ order: 3
12493
+ }
12494
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-5 .fd-fixed-card-layout__card:nth-of-type(5n+4) {
12495
+ -webkit-box-ordinal-group: 5;
12496
+ -ms-flex-order: 4;
12497
+ order: 4
12498
+ }
12499
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-6 .fd-fixed-card-layout__card {
12500
+ width: 16.6666666667%
12501
+ }
12502
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-6 .fd-fixed-card-layout__card:nth-of-type(6n) {
12503
+ -webkit-box-ordinal-group: 7;
12504
+ -ms-flex-order: 6;
12505
+ order: 6
12506
+ }
12507
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-6 .fd-fixed-card-layout__card:nth-of-type(6n+1) {
12508
+ -webkit-box-ordinal-group: 2;
12509
+ -ms-flex-order: 1;
12510
+ order: 1
12511
+ }
12512
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-6 .fd-fixed-card-layout__card:nth-of-type(6n+2) {
12513
+ -webkit-box-ordinal-group: 3;
12514
+ -ms-flex-order: 2;
12515
+ order: 2
12516
+ }
12517
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-6 .fd-fixed-card-layout__card:nth-of-type(6n+3) {
12518
+ -webkit-box-ordinal-group: 4;
12519
+ -ms-flex-order: 3;
12520
+ order: 3
12521
+ }
12522
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-6 .fd-fixed-card-layout__card:nth-of-type(6n+4) {
12523
+ -webkit-box-ordinal-group: 5;
12524
+ -ms-flex-order: 4;
12525
+ order: 4
12526
+ }
12527
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-6 .fd-fixed-card-layout__card:nth-of-type(6n+5) {
12528
+ -webkit-box-ordinal-group: 6;
12529
+ -ms-flex-order: 5;
12530
+ order: 5
12531
+ }
12532
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-7 .fd-fixed-card-layout__card {
12533
+ width: 14.2857142857%
12534
+ }
12535
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-7 .fd-fixed-card-layout__card:nth-of-type(7n) {
12536
+ -webkit-box-ordinal-group: 8;
12537
+ -ms-flex-order: 7;
12538
+ order: 7
12539
+ }
12540
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-7 .fd-fixed-card-layout__card:nth-of-type(7n+1) {
12541
+ -webkit-box-ordinal-group: 2;
12542
+ -ms-flex-order: 1;
12543
+ order: 1
12544
+ }
12545
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-7 .fd-fixed-card-layout__card:nth-of-type(7n+2) {
12546
+ -webkit-box-ordinal-group: 3;
12547
+ -ms-flex-order: 2;
12548
+ order: 2
12549
+ }
12550
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-7 .fd-fixed-card-layout__card:nth-of-type(7n+3) {
12551
+ -webkit-box-ordinal-group: 4;
12552
+ -ms-flex-order: 3;
12553
+ order: 3
12554
+ }
12555
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-7 .fd-fixed-card-layout__card:nth-of-type(7n+4) {
12556
+ -webkit-box-ordinal-group: 5;
12557
+ -ms-flex-order: 4;
12558
+ order: 4
12559
+ }
12560
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-7 .fd-fixed-card-layout__card:nth-of-type(7n+5) {
12561
+ -webkit-box-ordinal-group: 6;
12562
+ -ms-flex-order: 5;
12563
+ order: 5
12564
+ }
12565
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-7 .fd-fixed-card-layout__card:nth-of-type(7n+6) {
12566
+ -webkit-box-ordinal-group: 7;
12567
+ -ms-flex-order: 6;
12568
+ order: 6
12569
+ }
12570
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card {
12571
+ width: 12.5%
12572
+ }
12573
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card:nth-of-type(8n) {
12574
+ -webkit-box-ordinal-group: 9;
12575
+ -ms-flex-order: 8;
12576
+ order: 8
12577
+ }
12578
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card:nth-of-type(8n+1) {
12579
+ -webkit-box-ordinal-group: 2;
12580
+ -ms-flex-order: 1;
12581
+ order: 1
12582
+ }
12583
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card:nth-of-type(8n+2) {
12584
+ -webkit-box-ordinal-group: 3;
12585
+ -ms-flex-order: 2;
12586
+ order: 2
12587
+ }
12588
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card:nth-of-type(8n+3) {
12589
+ -webkit-box-ordinal-group: 4;
12590
+ -ms-flex-order: 3;
12591
+ order: 3
12592
+ }
12593
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card:nth-of-type(8n+4) {
12594
+ -webkit-box-ordinal-group: 5;
12595
+ -ms-flex-order: 4;
12596
+ order: 4
12597
+ }
12598
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card:nth-of-type(8n+5) {
12599
+ -webkit-box-ordinal-group: 6;
12600
+ -ms-flex-order: 5;
12601
+ order: 5
12602
+ }
12603
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card:nth-of-type(8n+6) {
12604
+ -webkit-box-ordinal-group: 7;
12605
+ -ms-flex-order: 6;
12606
+ order: 6
12607
+ }
12608
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card:nth-of-type(8n+7) {
12609
+ -webkit-box-ordinal-group: 8;
12610
+ -ms-flex-order: 7;
12611
+ order: 7
12612
+ }
12613
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card {
12614
+ width: 11.1111111111%
12615
+ }
12616
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n) {
12617
+ -webkit-box-ordinal-group: 10;
12618
+ -ms-flex-order: 9;
12619
+ order: 9
12620
+ }
12621
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n+1) {
12622
+ -webkit-box-ordinal-group: 2;
12623
+ -ms-flex-order: 1;
12624
+ order: 1
12625
+ }
12626
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n+2) {
12627
+ -webkit-box-ordinal-group: 3;
12628
+ -ms-flex-order: 2;
12629
+ order: 2
12630
+ }
12631
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n+3) {
12632
+ -webkit-box-ordinal-group: 4;
12633
+ -ms-flex-order: 3;
12634
+ order: 3
12635
+ }
12636
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n+4) {
12637
+ -webkit-box-ordinal-group: 5;
12638
+ -ms-flex-order: 4;
12639
+ order: 4
12640
+ }
12641
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n+5) {
12642
+ -webkit-box-ordinal-group: 6;
12643
+ -ms-flex-order: 5;
12644
+ order: 5
12645
+ }
12646
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n+6) {
12647
+ -webkit-box-ordinal-group: 7;
12648
+ -ms-flex-order: 6;
12649
+ order: 6
12650
+ }
12651
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n+7) {
12652
+ -webkit-box-ordinal-group: 8;
12653
+ -ms-flex-order: 7;
12654
+ order: 7
12655
+ }
12656
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n+8) {
12657
+ -webkit-box-ordinal-group: 9;
12658
+ -ms-flex-order: 8;
12659
+ order: 8
12660
+ }
12661
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card {
12662
+ width: 10%
12663
+ }
12664
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n) {
12665
+ -webkit-box-ordinal-group: 11;
12666
+ -ms-flex-order: 10;
12667
+ order: 10
12668
+ }
12669
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+1) {
12670
+ -webkit-box-ordinal-group: 2;
12671
+ -ms-flex-order: 1;
12672
+ order: 1
12673
+ }
12674
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+2) {
12675
+ -webkit-box-ordinal-group: 3;
12676
+ -ms-flex-order: 2;
12677
+ order: 2
12678
+ }
12679
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+3) {
12680
+ -webkit-box-ordinal-group: 4;
12681
+ -ms-flex-order: 3;
12682
+ order: 3
12683
+ }
12684
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+4) {
12685
+ -webkit-box-ordinal-group: 5;
12686
+ -ms-flex-order: 4;
12687
+ order: 4
12688
+ }
12689
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+5) {
12690
+ -webkit-box-ordinal-group: 6;
12691
+ -ms-flex-order: 5;
12692
+ order: 5
12693
+ }
12694
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+6) {
12695
+ -webkit-box-ordinal-group: 7;
12696
+ -ms-flex-order: 6;
12697
+ order: 6
12698
+ }
12699
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+7) {
12700
+ -webkit-box-ordinal-group: 8;
12701
+ -ms-flex-order: 7;
12702
+ order: 7
12703
+ }
12704
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+8) {
12705
+ -webkit-box-ordinal-group: 9;
12706
+ -ms-flex-order: 8;
12707
+ order: 8
12708
+ }
12709
+ .fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+9) {
12710
+ -webkit-box-ordinal-group: 10;
12711
+ -ms-flex-order: 9;
12712
+ order: 9
12713
+ }
12714
+ .fd-fixed-card-layout__card,
12715
+ .fd-fixed-card-layout__card-placeholder {
12440
12716
  font-size: .875rem;
12441
12717
  font-size: var(--sapFontSize,.875rem);
12442
12718
  line-height: 1.4;
@@ -12451,19 +12727,44 @@ fd-carousel:focus {
12451
12727
  padding: 0;
12452
12728
  margin: 0;
12453
12729
  border: 0;
12454
- margin-bottom: 1rem;
12455
- min-width: 20rem
12730
+ min-width: 20rem;
12731
+ min-height: .0625rem
12456
12732
  }
12733
+ .fd-fixed-card-layout__card-placeholder::after,
12734
+ .fd-fixed-card-layout__card-placeholder::before,
12457
12735
  .fd-fixed-card-layout__card::after,
12458
12736
  .fd-fixed-card-layout__card::before {
12459
12737
  -webkit-box-sizing: inherit;
12460
12738
  box-sizing: inherit;
12461
12739
  font-size: inherit
12462
12740
  }
12463
- .fd-fixed-card-layout__card:last-child {
12464
- margin-bottom: 0
12741
+ .fd-fixed-card-layout__card {
12742
+ padding-left: 1rem;
12743
+ -webkit-box-ordinal-group: 2;
12744
+ -ms-flex-order: 1;
12745
+ order: 1;
12746
+ padding-top: 1rem
12747
+ }
12748
+ .fd-fixed-card-layout__card[dir=rtl],
12749
+ [dir=rtl] .fd-fixed-card-layout__card {
12750
+ padding-right: 1rem;
12751
+ padding-left: 0
12752
+ }
12753
+ .fd-fixed-card-layout__card--single {
12754
+ -ms-flex-preferred-size: 100%;
12755
+ flex-basis: 100%
12756
+ }
12757
+ .fd-fixed-card-layout__card:empty {
12758
+ padding-top: 0
12465
12759
  }
12466
12760
  .fd-fixed-card-layout__card-placeholder {
12761
+ opacity: .3;
12762
+ border: .125rem dashed #0854a0;
12763
+ border: .125rem dashed var(--sapContent_DragAndDropActiveColor,#0854a0);
12764
+ cursor: -webkit-grabbing;
12765
+ cursor: grabbing
12766
+ }
12767
+ .fd-fixed-card-layout__card-preview {
12467
12768
  font-size: .875rem;
12468
12769
  font-size: var(--sapFontSize,.875rem);
12469
12770
  line-height: 1.4;
@@ -12478,20 +12779,21 @@ fd-carousel:focus {
12478
12779
  padding: 0;
12479
12780
  margin: 0;
12480
12781
  border: 0;
12481
- opacity: .3;
12482
- border: .125rem dashed #0854a0;
12483
- border: .125rem dashed var(--sapContent_DragAndDropActiveColor,#0854a0);
12484
- cursor: -webkit-grabbing;
12485
- cursor: grabbing;
12486
- margin-bottom: 1rem
12782
+ box-sizing: border-box;
12783
+ border-radius: .25rem;
12784
+ border-radius: var(--sapElement_BorderCornerRadius,.25rem);
12785
+ -webkit-box-shadow: 0 0 0 .0625rem rgba(0,0,0,.42),0 .625rem 1.875rem 0 rgba(0,0,0,.3);
12786
+ -webkit-box-shadow: var(--sapContent_Shadow2,0 0 0 .0625rem rgba(0,0,0,.42),0 .625rem 1.875rem 0 rgba(0,0,0,.3));
12787
+ box-shadow: 0 0 0 .0625rem rgba(0,0,0,.42),0 .625rem 1.875rem 0 rgba(0,0,0,.3);
12788
+ box-shadow: var(--sapContent_Shadow2,0 0 0 .0625rem rgba(0,0,0,.42),0 .625rem 1.875rem 0 rgba(0,0,0,.3))
12487
12789
  }
12488
- .fd-fixed-card-layout__card-placeholder::after,
12489
- .fd-fixed-card-layout__card-placeholder::before {
12790
+ .fd-fixed-card-layout__card-preview::after,
12791
+ .fd-fixed-card-layout__card-preview::before {
12490
12792
  -webkit-box-sizing: inherit;
12491
12793
  box-sizing: inherit;
12492
12794
  font-size: inherit
12493
12795
  }
12494
- .fd-fixed-card-layout__card-preview {
12796
+ .fd-fixed-card-layout__clearfix {
12495
12797
  font-size: .875rem;
12496
12798
  font-size: var(--sapFontSize,.875rem);
12497
12799
  line-height: 1.4;
@@ -12506,16 +12808,12 @@ fd-carousel:focus {
12506
12808
  padding: 0;
12507
12809
  margin: 0;
12508
12810
  border: 0;
12509
- box-sizing: border-box;
12510
- border-radius: .25rem;
12511
- border-radius: var(--sapElement_BorderCornerRadius,.25rem);
12512
- -webkit-box-shadow: 0 0 0 .0625rem rgba(0,0,0,.42),0 .625rem 1.875rem 0 rgba(0,0,0,.3);
12513
- -webkit-box-shadow: var(--sapContent_Shadow2,0 0 0 .0625rem rgba(0,0,0,.42),0 .625rem 1.875rem 0 rgba(0,0,0,.3));
12514
- box-shadow: 0 0 0 .0625rem rgba(0,0,0,.42),0 .625rem 1.875rem 0 rgba(0,0,0,.3);
12515
- box-shadow: var(--sapContent_Shadow2,0 0 0 .0625rem rgba(0,0,0,.42),0 .625rem 1.875rem 0 rgba(0,0,0,.3))
12811
+ width: 0;
12812
+ -ms-flex-preferred-size: 100%;
12813
+ flex-basis: 100%
12516
12814
  }
12517
- .fd-fixed-card-layout__card-preview::after,
12518
- .fd-fixed-card-layout__card-preview::before {
12815
+ .fd-fixed-card-layout__clearfix::after,
12816
+ .fd-fixed-card-layout__clearfix::before {
12519
12817
  -webkit-box-sizing: inherit;
12520
12818
  box-sizing: inherit;
12521
12819
  font-size: inherit
@@ -24968,8 +25266,9 @@ fd-carousel:focus {
24968
25266
  border-width: var(--fdMessageStrip_Border_Width,.0625rem);
24969
25267
  border-style: solid;
24970
25268
  border-color: #6a6d70;
24971
- border-color: var(--sapNeutralBorderColor,#6a6d70);
25269
+ border-color: var(--fdMessageStrip_Border_Color_Neutral,var(--sapNeutralBorderColor,#6a6d70));
24972
25270
  border-radius: .25rem;
25271
+ border-radius: var(--fdMessageStrip_Border_Radius,var(--sapElement_BorderCornerRadius,.25rem));
24973
25272
  padding: .4375rem 1rem;
24974
25273
  display: -webkit-box;
24975
25274
  display: -ms-flexbox;
@@ -25079,12 +25378,12 @@ fd-carousel:focus {
25079
25378
  background-color: #fef7f1;
25080
25379
  background-color: var(--sapWarningBackground,#fef7f1);
25081
25380
  border-color: #df6e0c;
25082
- border-color: var(--sapWarningBorderColor,#df6e0c)
25381
+ border-color: var(--fdMessageStrip_Border_Color_Warning,var(--sapWarningBorderColor,#df6e0c))
25083
25382
  }
25084
25383
  .fd-message-strip--warning::after,
25085
25384
  .fd-message-strip--warning::before {
25086
25385
  color: #df6e0c;
25087
- color: var(--sapWarningBorderColor,#df6e0c)
25386
+ color: var(--fdMessageStrip_Icon_Color_Warning,var(--sapCriticalElementColor,#df6e0c))
25088
25387
  }
25089
25388
  .fd-message-strip--warning::before {
25090
25389
  font-family: SAP-icons;
@@ -25116,12 +25415,12 @@ fd-carousel:focus {
25116
25415
  background-color: #ffebeb;
25117
25416
  background-color: var(--sapErrorBackground,#ffebeb);
25118
25417
  border-color: #b00;
25119
- border-color: var(--sapErrorBorderColor,#b00)
25418
+ border-color: var(--fdMessageStrip_Border_Color_Error,var(--sapErrorBorderColor,#b00))
25120
25419
  }
25121
25420
  .fd-message-strip--error::after,
25122
25421
  .fd-message-strip--error::before {
25123
25422
  color: #b00;
25124
- color: var(--sapErrorBorderColor,#b00)
25423
+ color: var(--fdMessageStrip_Icon_Color_Error,var(--sapNegativeElementColor,#b00))
25125
25424
  }
25126
25425
  .fd-message-strip--error::before {
25127
25426
  font-family: SAP-icons;
@@ -25149,12 +25448,12 @@ fd-carousel:focus {
25149
25448
  background-color: #f1fdf6;
25150
25449
  background-color: var(--sapSuccessBackground,#f1fdf6);
25151
25450
  border-color: #107e3e;
25152
- border-color: var(--sapSuccessBorderColor,#107e3e)
25451
+ border-color: var(--fdMessageStrip_Border_Color_Success,var(--sapSuccessBorderColor,#107e3e))
25153
25452
  }
25154
25453
  .fd-message-strip--success::after,
25155
25454
  .fd-message-strip--success::before {
25156
25455
  color: #107e3e;
25157
- color: var(--sapSuccessBorderColor,#107e3e)
25456
+ color: var(--fdMessageStrip_Icon_Color_Success,var(--sapPositiveElementColor,#107e3e))
25158
25457
  }
25159
25458
  .fd-message-strip--success::before {
25160
25459
  font-family: SAP-icons;
@@ -25181,13 +25480,13 @@ fd-carousel:focus {
25181
25480
  .fd-message-strip--information {
25182
25481
  background-color: #f5faff;
25183
25482
  background-color: var(--sapInformationBackground,#f5faff);
25184
- border-color: #0a6ed1;
25185
- border-color: var(--sapInformationBorderColor,#0a6ed1)
25483
+ border-color: var(--sapInformativeBorderColor);
25484
+ border-color: var(--fdMessageStrip_Border_Color_Informative,var(--sapInformativeBorderColor))
25186
25485
  }
25187
25486
  .fd-message-strip--information::after,
25188
25487
  .fd-message-strip--information::before {
25189
25488
  color: #0a6ed1;
25190
- color: var(--sapInformationBorderColor,#0a6ed1)
25489
+ color: var(--fdMessageStrip_Icon_Color_Information,var(--sapInformativeElementColor,#0a6ed1))
25191
25490
  }
25192
25491
  .fd-message-strip--information::before {
25193
25492
  font-family: SAP-icons;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fundamental-styles/theming-preview",
3
- "version": "0.22.1-rc.1",
3
+ "version": "0.23.0-rc.2",
4
4
  "license": "Apache-2.0",
5
5
  "homepage": "https://sap.github.io/fundamental-styles/",
6
6
  "description": "Fundamental Library Styles - Theming Package Preview",
@@ -9,7 +9,7 @@
9
9
  "url": "https://github.com/SAP/fundamental-styles"
10
10
  },
11
11
  "dependencies": {
12
- "fundamental-styles": "0.22.1-rc.1"
12
+ "fundamental-styles": "0.23.0-rc.2"
13
13
  }
14
14
  }
15
15