scb-wc-test 0.1.341 → 0.1.343

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 (4) hide show
  1. package/mvc/components/scb-card/scb-card.js +14 -19
  2. package/package.json +2 -2
  3. package/scb-card/scb-card.js +14 -19
  4. package/scb-wc-test.bundle.js +14 -19
package/mvc/components/scb-card/scb-card.js CHANGED
@@ -603,6 +603,10 @@ import{_ as T}from"../../vendor/preload-helper.js";import{a as F,n as a,i as H,x
603
603
  }
604
604
  .scb-card.horizontal .media {
605
605
  align-self: flex-start;
606
+ flex: 0 1 var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
607
+ min-inline-size: 0;
608
+ max-inline-size: min(100%, var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px)));
609
+ inline-size: min(100%, var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px)));
606
610
  }
607
611
  .scb-card.horizontal .media ::slotted(scb-avatar) {
608
612
  margin: 0;
@@ -611,8 +615,8 @@ import{_ as T}from"../../vendor/preload-helper.js";import{a as F,n as a,i as H,x
611
615
  align-self: flex-start;
612
616
  padding: 0;
613
617
  inline-size: auto;
614
- min-inline-size: 0;
615
- flex: 1 1 auto;
618
+ min-inline-size: min(18ch, 100%);
619
+ flex: 1 1 0%;
616
620
  }
617
621
  .scb-card.horizontal .header {
618
622
  align-items: flex-start;
@@ -625,10 +629,7 @@ import{_ as T}from"../../vendor/preload-helper.js";import{a as F,n as a,i as H,x
625
629
  margin: 0;
626
630
  object-fit: var(--scb-card-media-fit, cover);
627
631
  aspect-ratio: var(--scb-card-horizontal-media-aspect, 16 / 9);
628
- flex: 0 1 var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
629
- min-inline-size: var(--scb-card-size-horizontal-media-min, var(--scb-card-horizontal-media-min, 96px));
630
- max-inline-size: var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
631
- inline-size: auto;
632
+ inline-size: 100%;
632
633
  block-size: auto;
633
634
  }
634
635
 
@@ -641,6 +642,10 @@ import{_ as T}from"../../vendor/preload-helper.js";import{a as F,n as a,i as H,x
641
642
  }
642
643
  .scb-card.dynamic-direction .media {
643
644
  align-self: flex-start;
645
+ flex: 0 1 var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
646
+ min-inline-size: 0;
647
+ max-inline-size: min(100%, var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px)));
648
+ inline-size: min(100%, var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px)));
644
649
  }
645
650
  .scb-card.dynamic-direction .media ::slotted(scb-avatar) {
646
651
  margin: 0;
@@ -649,8 +654,8 @@ import{_ as T}from"../../vendor/preload-helper.js";import{a as F,n as a,i as H,x
649
654
  align-self: flex-start;
650
655
  padding: 0;
651
656
  inline-size: auto;
652
- min-inline-size: 0;
653
- flex: 1 1 auto;
657
+ min-inline-size: min(18ch, 100%);
658
+ flex: 1 1 0%;
654
659
  }
655
660
  .scb-card.dynamic-direction .header {
656
661
  align-items: flex-start;
@@ -663,10 +668,7 @@ import{_ as T}from"../../vendor/preload-helper.js";import{a as F,n as a,i as H,x
663
668
  margin: 0;
664
669
  object-fit: var(--scb-card-media-fit, cover);
665
670
  aspect-ratio: var(--scb-card-horizontal-media-aspect, 16 / 9);
666
- flex: 0 1 var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
667
- min-inline-size: var(--scb-card-size-horizontal-media-min, var(--scb-card-horizontal-media-min, 96px));
668
- max-inline-size: var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
669
- inline-size: auto;
671
+ inline-size: 100%;
670
672
  block-size: auto;
671
673
  }
672
674
 
@@ -704,13 +706,6 @@ import{_ as T}from"../../vendor/preload-helper.js";import{a as F,n as a,i as H,x
704
706
  gap: var(--spacing-2, 4px);
705
707
  }
706
708
 
707
- /* .social-actions {
708
- display: flex;
709
- align-items: center;
710
- gap: var(--spacing-3, 8px);
711
- flex-wrap: wrap;
712
- } */
713
-
714
709
  .social-action {
715
710
  display: inline-flex;
716
711
  align-items: center;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "scb-wc-test",
3
- "version": "0.1.341",
3
+ "version": "0.1.343",
4
4
  "type": "module",
5
5
  "main": "index.js",
6
6
  "module": "index.js",
@@ -398,5 +398,5 @@
398
398
  },
399
399
  "./mvc/*": "./mvc/*"
400
400
  },
401
- "buildHash": "4727594C8075EF0C70874351D3C8EB168D39127F685122C5EBD4A3DEFA57DB85"
401
+ "buildHash": "4B48DA93DF75F41ECBEB2F1BD1871BA4D44FF0EB20F6B5A5D3F54F85BEFF572F"
402
402
  }
package/scb-card/scb-card.js CHANGED
@@ -814,6 +814,10 @@ i.styles = H`
814
814
  }
815
815
  .scb-card.horizontal .media {
816
816
  align-self: flex-start;
817
+ flex: 0 1 var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
818
+ min-inline-size: 0;
819
+ max-inline-size: min(100%, var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px)));
820
+ inline-size: min(100%, var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px)));
817
821
  }
818
822
  .scb-card.horizontal .media ::slotted(scb-avatar) {
819
823
  margin: 0;
@@ -822,8 +826,8 @@ i.styles = H`
822
826
  align-self: flex-start;
823
827
  padding: 0;
824
828
  inline-size: auto;
825
- min-inline-size: 0;
826
- flex: 1 1 auto;
829
+ min-inline-size: min(18ch, 100%);
830
+ flex: 1 1 0%;
827
831
  }
828
832
  .scb-card.horizontal .header {
829
833
  align-items: flex-start;
@@ -836,10 +840,7 @@ i.styles = H`
836
840
  margin: 0;
837
841
  object-fit: var(--scb-card-media-fit, cover);
838
842
  aspect-ratio: var(--scb-card-horizontal-media-aspect, 16 / 9);
839
- flex: 0 1 var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
840
- min-inline-size: var(--scb-card-size-horizontal-media-min, var(--scb-card-horizontal-media-min, 96px));
841
- max-inline-size: var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
842
- inline-size: auto;
843
+ inline-size: 100%;
843
844
  block-size: auto;
844
845
  }
845
846
 
@@ -852,6 +853,10 @@ i.styles = H`
852
853
  }
853
854
  .scb-card.dynamic-direction .media {
854
855
  align-self: flex-start;
856
+ flex: 0 1 var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
857
+ min-inline-size: 0;
858
+ max-inline-size: min(100%, var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px)));
859
+ inline-size: min(100%, var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px)));
855
860
  }
856
861
  .scb-card.dynamic-direction .media ::slotted(scb-avatar) {
857
862
  margin: 0;
@@ -860,8 +865,8 @@ i.styles = H`
860
865
  align-self: flex-start;
861
866
  padding: 0;
862
867
  inline-size: auto;
863
- min-inline-size: 0;
864
- flex: 1 1 auto;
868
+ min-inline-size: min(18ch, 100%);
869
+ flex: 1 1 0%;
865
870
  }
866
871
  .scb-card.dynamic-direction .header {
867
872
  align-items: flex-start;
@@ -874,10 +879,7 @@ i.styles = H`
874
879
  margin: 0;
875
880
  object-fit: var(--scb-card-media-fit, cover);
876
881
  aspect-ratio: var(--scb-card-horizontal-media-aspect, 16 / 9);
877
- flex: 0 1 var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
878
- min-inline-size: var(--scb-card-size-horizontal-media-min, var(--scb-card-horizontal-media-min, 96px));
879
- max-inline-size: var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
880
- inline-size: auto;
882
+ inline-size: 100%;
881
883
  block-size: auto;
882
884
  }
883
885
 
@@ -915,13 +917,6 @@ i.styles = H`
915
917
  gap: var(--spacing-2, 4px);
916
918
  }
917
919
 
918
- /* .social-actions {
919
- display: flex;
920
- align-items: center;
921
- gap: var(--spacing-3, 8px);
922
- flex-wrap: wrap;
923
- } */
924
-
925
920
  .social-action {
926
921
  display: inline-flex;
927
922
  align-items: center;
package/scb-wc-test.bundle.js CHANGED
@@ -6474,6 +6474,10 @@
6474
6474
  }
6475
6475
  .scb-card.horizontal .media {
6476
6476
  align-self: flex-start;
6477
+ flex: 0 1 var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
6478
+ min-inline-size: 0;
6479
+ max-inline-size: min(100%, var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px)));
6480
+ inline-size: min(100%, var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px)));
6477
6481
  }
6478
6482
  .scb-card.horizontal .media ::slotted(scb-avatar) {
6479
6483
  margin: 0;
@@ -6482,8 +6486,8 @@
6482
6486
  align-self: flex-start;
6483
6487
  padding: 0;
6484
6488
  inline-size: auto;
6485
- min-inline-size: 0;
6486
- flex: 1 1 auto;
6489
+ min-inline-size: min(18ch, 100%);
6490
+ flex: 1 1 0%;
6487
6491
  }
6488
6492
  .scb-card.horizontal .header {
6489
6493
  align-items: flex-start;
@@ -6496,10 +6500,7 @@
6496
6500
  margin: 0;
6497
6501
  object-fit: var(--scb-card-media-fit, cover);
6498
6502
  aspect-ratio: var(--scb-card-horizontal-media-aspect, 16 / 9);
6499
- flex: 0 1 var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
6500
- min-inline-size: var(--scb-card-size-horizontal-media-min, var(--scb-card-horizontal-media-min, 96px));
6501
- max-inline-size: var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
6502
- inline-size: auto;
6503
+ inline-size: 100%;
6503
6504
  block-size: auto;
6504
6505
  }
6505
6506
 
@@ -6512,6 +6513,10 @@
6512
6513
  }
6513
6514
  .scb-card.dynamic-direction .media {
6514
6515
  align-self: flex-start;
6516
+ flex: 0 1 var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
6517
+ min-inline-size: 0;
6518
+ max-inline-size: min(100%, var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px)));
6519
+ inline-size: min(100%, var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px)));
6515
6520
  }
6516
6521
  .scb-card.dynamic-direction .media ::slotted(scb-avatar) {
6517
6522
  margin: 0;
@@ -6520,8 +6525,8 @@
6520
6525
  align-self: flex-start;
6521
6526
  padding: 0;
6522
6527
  inline-size: auto;
6523
- min-inline-size: 0;
6524
- flex: 1 1 auto;
6528
+ min-inline-size: min(18ch, 100%);
6529
+ flex: 1 1 0%;
6525
6530
  }
6526
6531
  .scb-card.dynamic-direction .header {
6527
6532
  align-items: flex-start;
@@ -6534,10 +6539,7 @@
6534
6539
  margin: 0;
6535
6540
  object-fit: var(--scb-card-media-fit, cover);
6536
6541
  aspect-ratio: var(--scb-card-horizontal-media-aspect, 16 / 9);
6537
- flex: 0 1 var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
6538
- min-inline-size: var(--scb-card-size-horizontal-media-min, var(--scb-card-horizontal-media-min, 96px));
6539
- max-inline-size: var(--scb-card-size-horizontal-media-max, var(--scb-card-horizontal-media-max, 176px));
6540
- inline-size: auto;
6542
+ inline-size: 100%;
6541
6543
  block-size: auto;
6542
6544
  }
6543
6545
 
@@ -6575,13 +6577,6 @@
6575
6577
  gap: var(--spacing-2, 4px);
6576
6578
  }
6577
6579
 
6578
- /* .social-actions {
6579
- display: flex;
6580
- align-items: center;
6581
- gap: var(--spacing-3, 8px);
6582
- flex-wrap: wrap;
6583
- } */
6584
-
6585
6580
  .social-action {
6586
6581
  display: inline-flex;
6587
6582
  align-items: center;