@usethrottle/auth 0.2.3 → 0.3.0
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.
- package/dist/react/components/index.cjs +872 -617
- package/dist/react/components/index.cjs.map +1 -1
- package/dist/react/components/index.d.cts +56 -10
- package/dist/react/components/index.d.ts +56 -10
- package/dist/react/components/index.js +845 -590
- package/dist/react/components/index.js.map +1 -1
- package/dist/styles.css +10 -1
- package/package.json +1 -1
package/dist/styles.css
CHANGED
|
@@ -18,6 +18,7 @@
|
|
|
18
18
|
merchant's page without fighting their background. The accountSurface and
|
|
19
19
|
accountPadding appearance variables opt back into a card.
|
|
20
20
|
No backticks in this comment: the sheet is a TS template literal. */
|
|
21
|
+
--throttle-card-width: 400px;
|
|
21
22
|
--throttle-color-account-surface: transparent;
|
|
22
23
|
--throttle-account-padding: 0;
|
|
23
24
|
--throttle-color-border-control: #8b93a1;
|
|
@@ -118,7 +119,7 @@
|
|
|
118
119
|
box-shadow: var(--throttle-shadow-card);
|
|
119
120
|
padding: var(--throttle-space-5);
|
|
120
121
|
width: 100%;
|
|
121
|
-
max-width:
|
|
122
|
+
max-width: var(--throttle-card-width);
|
|
122
123
|
margin-inline: auto;
|
|
123
124
|
}
|
|
124
125
|
/* Inside a Modal the dialog already provides the surface — background, radius
|
|
@@ -322,6 +323,13 @@
|
|
|
322
323
|
is near-white, so on a light host page it was rendering white-on-white. */
|
|
323
324
|
.throttle-cardframe { width: 100%; min-height: 420px; border: 0; display: block; }
|
|
324
325
|
.throttle-centre { display: flex; align-items: center; justify-content: center; min-height: 160px; }
|
|
326
|
+
.throttle-section__title { font-size: var(--throttle-font-size-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--throttle-color-muted-foreground); margin: 0 0 var(--throttle-space-2); font-weight: 600; }
|
|
327
|
+
.throttle-addresses { display: grid; grid-template-columns: 1fr 1fr; gap: var(--throttle-space-5); }
|
|
328
|
+
.throttle-addressblock__line { margin: 0 0 2px; }
|
|
329
|
+
.throttle-timeline { display: flex; flex-direction: column; gap: var(--throttle-space-2); }
|
|
330
|
+
.throttle-timeline__row { display: flex; align-items: center; gap: var(--throttle-space-2); }
|
|
331
|
+
.throttle-timeline__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--throttle-color-border-control); flex: none; }
|
|
332
|
+
.throttle-timeline__label { flex: 1; }
|
|
325
333
|
.throttle-account-root { container-type: inline-size; background: var(--throttle-color-account-surface); color: var(--throttle-color-foreground); padding: var(--throttle-account-padding); }
|
|
326
334
|
.throttle-account { display: flex; gap: var(--throttle-space-5); align-items: flex-start; }
|
|
327
335
|
.throttle-account__content { flex: 1; min-width: 0; }
|
|
@@ -359,6 +367,7 @@
|
|
|
359
367
|
it shrinks the rail to its content width, so width:100% alone cannot make
|
|
360
368
|
it span. Stretch it explicitly when stacked. */
|
|
361
369
|
.throttle-account { flex-direction: column; align-items: stretch; gap: var(--throttle-space-4); }
|
|
370
|
+
.throttle-addresses { grid-template-columns: 1fr; }
|
|
362
371
|
.throttle-tabs__rail { width: 100%; }
|
|
363
372
|
}
|
|
364
373
|
|
package/package.json
CHANGED