@entro314labs/react-arc-tabs 1.0.13 → 1.0.14

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/ArcTabs.css +25 -1
  2. package/package.json +1 -1
package/dist/ArcTabs.css CHANGED
@@ -137,6 +137,30 @@
137
137
  opacity: 1;
138
138
  }
139
139
 
140
+ .arc-tabs__active-indicator::after {
141
+ content: '';
142
+ position: absolute;
143
+ bottom: 0;
144
+ left: calc(var(--arc-notch) * -1);
145
+ width: calc(100% + (var(--arc-notch) * 2));
146
+ height: var(--arc-notch);
147
+ transform: translateY(var(--arc-seam-gap));
148
+ background:
149
+ radial-gradient(
150
+ circle var(--arc-notch) at 100% 0%,
151
+ transparent var(--arc-notch),
152
+ var(--arc-panel-bg) calc(var(--arc-notch) + 0.5px)
153
+ )
154
+ left top / var(--arc-notch) var(--arc-notch) no-repeat,
155
+ radial-gradient(
156
+ circle var(--arc-notch) at 0% 0%,
157
+ transparent var(--arc-notch),
158
+ var(--arc-panel-bg) calc(var(--arc-notch) + 0.5px)
159
+ )
160
+ right top / var(--arc-notch) var(--arc-notch) no-repeat;
161
+ transition: opacity calc(var(--arc-motion-duration) * 0.7) ease;
162
+ }
163
+
140
164
  .arc-tabs:not(.arc-tabs--motion-expressive) .arc-tabs__active-indicator {
141
165
  display: none;
142
166
  }
@@ -239,7 +263,7 @@
239
263
  left: calc(var(--arc-notch) * -1);
240
264
  width: calc(100% + (var(--arc-notch) * 2));
241
265
  height: var(--arc-notch);
242
- transform: translateY(calc(100% + var(--arc-seam-gap)));
266
+ transform: translateY(var(--arc-seam-gap));
243
267
  background:
244
268
  radial-gradient(
245
269
  circle var(--arc-notch) at 100% 0%,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@entro314labs/react-arc-tabs",
3
- "version": "1.0.13",
3
+ "version": "1.0.14",
4
4
  "private": false,
5
5
  "description": "Reusable arc-style tabs component for React and Next.js projects",
6
6
  "keywords": [