spoko-design-system 1.34.1 → 1.34.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.
Files changed (4) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/package.json +1 -1
  3. package/src/components/Product/ProductGallery.astro +2 -2
  4. package/src/components/Product/product-gallery.css +10 -6
package/CHANGELOG.md CHANGED
@@ -1,3 +1,9 @@
1
+ ## [1.34.2](https://github.com/polo-blue/sds/compare/v1.34.1...v1.34.2) (2026-03-17)
2
+
3
+ ### Bug Fixes
4
+
5
+ * **ProductGallery:** improve dialog arrow and thumbnail visibility ([42a85d2](https://github.com/polo-blue/sds/commit/42a85d270202d62951497ca07f6b571d93a484a3))
6
+
1
7
  ## [1.34.1](https://github.com/polo-blue/sds/compare/v1.34.0...v1.34.1) (2026-03-17)
2
8
 
3
9
  ### Bug Fixes
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "spoko-design-system",
3
- "version": "1.34.1",
3
+ "version": "1.34.2",
4
4
  "type": "module",
5
5
  "private": false,
6
6
  "main": "./index.ts",
package/src/components/Product/ProductGallery.astro CHANGED
@@ -274,7 +274,7 @@ const total = images.length;
274
274
 
275
275
  <button
276
276
  type="button"
277
- class="pg-dialog-arrow hidden md:flex absolute top-1/2 left-3 -translate-y-1/2 z-10 w-11 h-11 items-center justify-center border-none bg-black/45 text-neutral-400 cursor-pointer rounded-full transition-colors"
277
+ class="pg-dialog-arrow hidden md:flex absolute top-1/2 left-3 -translate-y-1/2 z-10 w-11 h-11 items-center justify-center border-none cursor-pointer rounded-full"
278
278
  data-dialog-prev
279
279
  aria-label="Previous image"
280
280
  >
@@ -304,7 +304,7 @@ const total = images.length;
304
304
  </button>
305
305
  <button
306
306
  type="button"
307
- class="pg-dialog-arrow hidden md:flex absolute top-1/2 right-3 -translate-y-1/2 z-10 w-11 h-11 items-center justify-center border-none bg-black/45 text-neutral-400 cursor-pointer rounded-full transition-colors"
307
+ class="pg-dialog-arrow hidden md:flex absolute top-1/2 right-3 -translate-y-1/2 z-10 w-11 h-11 items-center justify-center border-none cursor-pointer rounded-full"
308
308
  data-dialog-next
309
309
  aria-label="Next image"
310
310
  >
package/src/components/Product/product-gallery.css CHANGED
@@ -107,26 +107,30 @@
107
107
  /* ── Dialog thumbnail active state ── */
108
108
 
109
109
  .pg-dialog-thumb {
110
- @apply opacity-50 transition-all duration-200;
110
+ @apply transition-all duration-200;
111
+ border-color: transparent;
111
112
  }
112
113
 
113
114
  .pg-dialog-thumb:hover {
114
- @apply opacity-75;
115
+ border-color: rgba(255, 255, 255, 0.5);
115
116
  }
116
117
 
117
118
  .pg-dialog-thumb.is-active {
118
- @apply opacity-100;
119
119
  border-color: #fff;
120
120
  }
121
121
 
122
- /* ── Dialog arrow hover ── */
122
+ /* ── Dialog arrow states ── */
123
+
124
+ .pg-dialog-arrow {
125
+ @apply text-white/80 transition-colors;
126
+ }
123
127
 
124
128
  .pg-dialog-arrow:hover {
125
- @apply text-white bg-black/65;
129
+ @apply text-white bg-white/15;
126
130
  }
127
131
 
128
132
  .pg-dialog-arrow:disabled {
129
- @apply opacity-30 cursor-default;
133
+ @apply text-white/20 cursor-default bg-transparent;
130
134
  }
131
135
 
132
136
  /* ── Reduced motion ── */