@chinggis.systems/collection-ui 1.0.6 → 1.0.7

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 (2) hide show
  1. package/dist/styles.css +22 -32
  2. package/package.json +1 -1
package/dist/styles.css CHANGED
@@ -524,17 +524,6 @@
524
524
  height: var(--spine-height, 132px) !important;
525
525
  --book-depth: clamp(2px, calc(var(--spine-height, 132px) * 0.012), 4px);
526
526
  --book-page-line: 1px;
527
- --book-spine-left: clamp(4px, calc(var(--spine-height, 132px) * 0.026), 7px);
528
- --book-spine-width: clamp(
529
- 8px,
530
- calc(var(--spine-height, 132px) * 0.065),
531
- 14px
532
- );
533
- --book-spine-hover-width: clamp(
534
- 14px,
535
- calc(var(--spine-height, 132px) * 0.1),
536
- 22px
537
- );
538
527
  overflow: visible;
539
528
  padding-right: var(--book-depth);
540
529
  width: var(--spine-measured-width, var(--spine-width, auto));
@@ -624,17 +613,6 @@
624
613
  .collection-ui-book-media {
625
614
  --book-depth: clamp(3px, calc(var(--spine-height, 266px) * 0.018), 7px);
626
615
  --book-page-line: clamp(1px, calc(var(--spine-height, 266px) * 0.006), 2px);
627
- --book-spine-left: clamp(5px, calc(var(--spine-height, 266px) * 0.03), 10px);
628
- --book-spine-width: clamp(
629
- 12px,
630
- calc(var(--spine-height, 266px) * 0.09),
631
- 24px
632
- );
633
- --book-spine-hover-width: clamp(
634
- 20px,
635
- calc(var(--spine-height, 266px) * 0.14),
636
- 38px
637
- );
638
616
  --book-shadow-x: clamp(10px, calc(var(--spine-height, 266px) * 0.08), 22px);
639
617
  --book-shadow-y: clamp(16px, calc(var(--spine-height, 266px) * 0.14), 36px);
640
618
  --book-shadow-blur: clamp(
@@ -710,24 +688,36 @@
710
688
  }
711
689
 
712
690
  .collection-ui-book-media__spine {
713
- background-image: linear-gradient(
714
- 90deg,
715
- rgb(255 255 255 / 24%) 0,
716
- rgb(255 255 255 / 0%) 100%
691
+ background: linear-gradient(
692
+ to right,
693
+ rgb(0 0 0 / 2%) 0%,
694
+ rgb(0 0 0 / 5%) 0.75%,
695
+ rgb(255 255 255 / 50%) 1%,
696
+ rgb(255 255 255 / 60%) 1.3%,
697
+ rgb(255 255 255 / 50%) 1.4%,
698
+ rgb(255 255 255 / 30%) 1.5%,
699
+ rgb(255 255 255 / 30%) 2.4%,
700
+ rgb(0 0 0 / 5%) 2.7%,
701
+ rgb(0 0 0 / 5%) 3.5%,
702
+ rgb(255 255 255 / 30%) 4%,
703
+ rgb(255 255 255 / 30%) 4.5%,
704
+ rgb(244 244 244 / 10%) 5.4%,
705
+ rgb(244 244 244 / 10%) 99%,
706
+ rgb(144 144 144 / 20%) 100%
717
707
  );
718
- border-left: clamp(1px, calc(var(--spine-height, 266px) * 0.008), 2px) solid
719
- rgb(0 0 0 / 8%);
708
+ border-radius: 3px;
720
709
  height: 100%;
721
- left: var(--book-spine-left);
710
+ left: 0;
711
+ pointer-events: none;
722
712
  position: absolute;
723
713
  top: 0;
724
- transition: width 0.25s ease;
725
- width: var(--book-spine-width);
714
+ transition: opacity 0.25s ease;
715
+ width: 100%;
726
716
  z-index: 2;
727
717
  }
728
718
 
729
719
  .collection-ui-book-media:hover .collection-ui-book-media__spine {
730
- width: var(--book-spine-hover-width);
720
+ opacity: 0.92;
731
721
  }
732
722
 
733
723
  .collection-ui-book-media__light {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@chinggis.systems/collection-ui",
3
- "version": "1.0.6",
3
+ "version": "1.0.7",
4
4
  "description": "Reusable React collection layout renderer with app-provided link, image, and item adapters.",
5
5
  "license": "MIT",
6
6
  "type": "module",