anentrypoint-design 0.0.152 → 0.0.154

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 (6) hide show
  1. package/app-shell.css +11 -21
  2. package/colors_and_type.css +4 -4
  3. package/dist/247420.css +15 -25
  4. package/dist/247420.js +10 -10
  5. package/package.json +1 -1
  6. package/src/components/theme-toggle.js +2 -2
package/app-shell.css CHANGED
@@ -379,7 +379,7 @@ pre .n { color: var(--green-2); }
379
379
  .ds-badge {
380
380
  display: inline-flex; align-items: center; justify-content: center;
381
381
  min-width: 18px; height: 18px; padding: 0 6px;
382
- font-size: 11px; font-weight: 600; line-height: 1;
382
+ font-size: var(--fs-micro); font-weight: 600; line-height: 1;
383
383
  border-radius: 999px;
384
384
  background: var(--bg-3); color: var(--fg-2);
385
385
  }
@@ -558,7 +558,7 @@ a.row { text-decoration: none; }
558
558
  .cli-line .cmd { flex: 1 1 auto; white-space: pre-wrap; word-break: break-word; color: var(--paper); }
559
559
  .cli-cmt {
560
560
  color: var(--fg-3);
561
- font-family: var(--ff-mono); font-size: 11.5px; line-height: 1.6;
561
+ font-family: var(--ff-mono); font-size: var(--fs-tiny); line-height: 1.6;
562
562
  padding: 3px 0; white-space: pre-wrap; word-break: break-word;
563
563
  }
564
564
 
@@ -751,12 +751,7 @@ table tr.clickable:focus-visible td { background: var(--bg-2); }
751
751
  .app-main { padding: var(--space-4) var(--space-2); }
752
752
  .app-main.narrow { max-width: 100%; margin: 0; }
753
753
 
754
- /* Typography Scaling */
755
- .t-hero { font-size: clamp(28px, 8vw, 48px); }
756
- .t-mega { font-size: clamp(24px, 6vw, 42px); }
757
- h1, .t-h1 { font-size: clamp(22px, 6vw, 36px); }
758
- h2, .t-h2 { font-size: clamp(18px, 5vw, 28px); }
759
- h3, .t-h3 { font-size: clamp(16px, 4.5vw, 24px); }
754
+ /* Headings stay on the fluid base clamps (cqi) — no mobile re-clamp. */
760
755
 
761
756
  /* Panel & Row */
762
757
  .panel { margin: 0 0 var(--space-3); }
@@ -821,10 +816,10 @@ table tr.clickable:focus-visible td { background: var(--bg-2); }
821
816
  .row-form input,
822
817
  .row-form textarea { padding: 11px 12px; font-size: var(--fs-sm); }
823
818
 
824
- /* Hero Section */
819
+ /* Hero Section — keep fluid base font-size, just unconstrain width on mobile. */
825
820
  .ds-hero { padding: var(--space-6) 0 var(--space-5); }
826
- .ds-hero-title { font-size: clamp(28px, 7vw, 48px); max-width: 100%; }
827
- .ds-hero-body { font-size: var(--fs-lg); max-width: 100%; }
821
+ .ds-hero-title { max-width: 100%; }
822
+ .ds-hero-body { max-width: 100%; }
828
823
 
829
824
  /* Table Responsiveness */
830
825
  table { font-size: var(--fs-xs); }
@@ -889,12 +884,7 @@ table tr.clickable:focus-visible td { background: var(--bg-2); }
889
884
  .app-main { padding: var(--space-6) var(--space-4); }
890
885
  .app-main.narrow { max-width: 100%; }
891
886
 
892
- /* Typography */
893
- .t-hero { font-size: clamp(32px, 6.5cqi, 56px); }
894
- .t-mega { font-size: clamp(28px, 5.5cqi, 80px); }
895
- h1, .t-h1 { font-size: clamp(24px, 5cqi, 48px); }
896
- h2, .t-h2 { font-size: clamp(20px, 4cqi, 36px); }
897
- h3, .t-h3 { font-size: clamp(18px, 3.5cqi, 28px); }
887
+ /* Headings stay on the fluid base clamps (cqi) — no tablet re-clamp. */
898
888
 
899
889
  /* File list — single column rows on tablet (cards only via data-columns) */
900
890
  .ds-file-row {
@@ -924,9 +914,9 @@ table tr.clickable:focus-visible td { background: var(--bg-2); }
924
914
  .panel-head { padding: var(--space-4) var(--space-4); }
925
915
  .panel-body { padding: var(--space-2) var(--space-3); }
926
916
 
927
- /* Hero */
917
+ /* Hero — fluid base font-size; only width unconstrained on tablet. */
928
918
  .ds-hero { padding: var(--space-7) 0 var(--space-6); max-width: 100%; }
929
- .ds-hero-title { font-size: clamp(32px, 6cqi, 56px); max-width: 100%; }
919
+ .ds-hero-title { max-width: 100%; }
930
920
 
931
921
  /* Row */
932
922
  .row {
@@ -1360,7 +1350,7 @@ table tr.clickable:focus-visible td { background: var(--bg-2); }
1360
1350
  display: inline-flex; align-items: center; justify-content: center;
1361
1351
  border: var(--bw-hair) solid var(--rule); border-radius: 5px;
1362
1352
  background: var(--bg); color: var(--accent-fg);
1363
- font-size: 11px; line-height: 1; cursor: pointer;
1353
+ font-size: var(--fs-micro); line-height: 1; cursor: pointer;
1364
1354
  opacity: 0; transition: opacity var(--dur-base) var(--ease), background var(--dur-snap) var(--ease);
1365
1355
  }
1366
1356
  .ds-file-row:hover .ds-file-check,
@@ -1838,7 +1828,7 @@ table tr.clickable:focus-visible td { background: var(--bg-2); }
1838
1828
  ============================================================ */
1839
1829
  .app-side .count {
1840
1830
  background: color-mix(in oklab, var(--mascot) 92%, transparent);
1841
- padding: 1px 8px; font-size: 10px; font-weight: 700;
1831
+ padding: 1px 8px; font-size: var(--fs-micro); font-weight: 700;
1842
1832
  font-family: var(--ff-mono); letter-spacing: 0.04em;
1843
1833
  min-width: 18px; text-align: center;
1844
1834
  }
package/colors_and_type.css CHANGED
@@ -74,10 +74,10 @@
74
74
  --ff-body: 'Space Grotesk', system-ui, sans-serif;
75
75
  --ff-mono: 'JetBrains Mono', ui-monospace, Menlo, Consolas, monospace;
76
76
 
77
- --fs-micro: 11px;
78
- --fs-tiny: 12px;
79
- --fs-xs: 13px;
80
- --fs-sm: 14px;
77
+ --fs-micro: 12px;
78
+ --fs-tiny: 13px;
79
+ --fs-xs: 14px;
80
+ --fs-sm: 15px;
81
81
  --fs-body: 16px;
82
82
  --fs-lg: 18px;
83
83
  --fs-xl: 21px;
package/dist/247420.css CHANGED
@@ -76,10 +76,10 @@
76
76
  --ff-body: 'Space Grotesk', system-ui, sans-serif;
77
77
  --ff-mono: 'JetBrains Mono', ui-monospace, Menlo, Consolas, monospace;
78
78
 
79
- --fs-micro: 11px;
80
- --fs-tiny: 12px;
81
- --fs-xs: 13px;
82
- --fs-sm: 14px;
79
+ --fs-micro: 12px;
80
+ --fs-tiny: 13px;
81
+ --fs-xs: 14px;
82
+ --fs-sm: 15px;
83
83
  --fs-body: 16px;
84
84
  --fs-lg: 18px;
85
85
  --fs-xl: 21px;
@@ -701,7 +701,7 @@
701
701
  .ds-247420 .ds-badge {
702
702
  display: inline-flex; align-items: center; justify-content: center;
703
703
  min-width: 18px; height: 18px; padding: 0 6px;
704
- font-size: 11px; font-weight: 600; line-height: 1;
704
+ font-size: var(--fs-micro); font-weight: 600; line-height: 1;
705
705
  border-radius: 999px;
706
706
  background: var(--bg-3); color: var(--fg-2);
707
707
  }
@@ -880,7 +880,7 @@
880
880
  .ds-247420 .cli-line .cmd { flex: 1 1 auto; white-space: pre-wrap; word-break: break-word; color: var(--paper); }
881
881
  .ds-247420 .cli-cmt {
882
882
  color: var(--fg-3);
883
- font-family: var(--ff-mono); font-size: 11.5px; line-height: 1.6;
883
+ font-family: var(--ff-mono); font-size: var(--fs-tiny); line-height: 1.6;
884
884
  padding: 3px 0; white-space: pre-wrap; word-break: break-word;
885
885
  }
886
886
 
@@ -1073,12 +1073,7 @@
1073
1073
  .ds-247420 .app-main { padding: var(--space-4) var(--space-2); }
1074
1074
  .ds-247420 .app-main.narrow { max-width: 100%; margin: 0; }
1075
1075
 
1076
- /* Typography Scaling */
1077
- .ds-247420 .t-hero { font-size: clamp(28px, 8vw, 48px); }
1078
- .ds-247420 .t-mega { font-size: clamp(24px, 6vw, 42px); }
1079
- .ds-247420 h1, .ds-247420 .t-h1 { font-size: clamp(22px, 6vw, 36px); }
1080
- .ds-247420 h2, .ds-247420 .t-h2 { font-size: clamp(18px, 5vw, 28px); }
1081
- .ds-247420 h3, .ds-247420 .t-h3 { font-size: clamp(16px, 4.5vw, 24px); }
1076
+ /* Headings stay on the fluid base clamps (cqi) — no mobile re-clamp. */
1082
1077
 
1083
1078
  /* Panel & Row */
1084
1079
  .ds-247420 .panel { margin: 0 0 var(--space-3); }
@@ -1143,10 +1138,10 @@
1143
1138
  .ds-247420 .row-form input,
1144
1139
  .ds-247420 .row-form textarea { padding: 11px 12px; font-size: var(--fs-sm); }
1145
1140
 
1146
- /* Hero Section */
1141
+ /* Hero Section — keep fluid base font-size, just unconstrain width on mobile. */
1147
1142
  .ds-247420 .ds-hero { padding: var(--space-6) 0 var(--space-5); }
1148
- .ds-247420 .ds-hero-title { font-size: clamp(28px, 7vw, 48px); max-width: 100%; }
1149
- .ds-247420 .ds-hero-body { font-size: var(--fs-lg); max-width: 100%; }
1143
+ .ds-247420 .ds-hero-title { max-width: 100%; }
1144
+ .ds-247420 .ds-hero-body { max-width: 100%; }
1150
1145
 
1151
1146
  /* Table Responsiveness */
1152
1147
  .ds-247420 table { font-size: var(--fs-xs); }
@@ -1211,12 +1206,7 @@
1211
1206
  .ds-247420 .app-main { padding: var(--space-6) var(--space-4); }
1212
1207
  .ds-247420 .app-main.narrow { max-width: 100%; }
1213
1208
 
1214
- /* Typography */
1215
- .ds-247420 .t-hero { font-size: clamp(32px, 6.5cqi, 56px); }
1216
- .ds-247420 .t-mega { font-size: clamp(28px, 5.5cqi, 80px); }
1217
- .ds-247420 h1, .ds-247420 .t-h1 { font-size: clamp(24px, 5cqi, 48px); }
1218
- .ds-247420 h2, .ds-247420 .t-h2 { font-size: clamp(20px, 4cqi, 36px); }
1219
- .ds-247420 h3, .ds-247420 .t-h3 { font-size: clamp(18px, 3.5cqi, 28px); }
1209
+ /* Headings stay on the fluid base clamps (cqi) — no tablet re-clamp. */
1220
1210
 
1221
1211
  /* File list — single column rows on tablet (cards only via data-columns) */
1222
1212
  .ds-247420 .ds-file-row {
@@ -1246,9 +1236,9 @@
1246
1236
  .ds-247420 .panel-head { padding: var(--space-4) var(--space-4); }
1247
1237
  .ds-247420 .panel-body { padding: var(--space-2) var(--space-3); }
1248
1238
 
1249
- /* Hero */
1239
+ /* Hero — fluid base font-size; only width unconstrained on tablet. */
1250
1240
  .ds-247420 .ds-hero { padding: var(--space-7) 0 var(--space-6); max-width: 100%; }
1251
- .ds-247420 .ds-hero-title { font-size: clamp(32px, 6cqi, 56px); max-width: 100%; }
1241
+ .ds-247420 .ds-hero-title { max-width: 100%; }
1252
1242
 
1253
1243
  /* Row */
1254
1244
  .ds-247420 .row {
@@ -1682,7 +1672,7 @@
1682
1672
  display: inline-flex; align-items: center; justify-content: center;
1683
1673
  border: var(--bw-hair) solid var(--rule); border-radius: 5px;
1684
1674
  background: var(--bg); color: var(--accent-fg);
1685
- font-size: 11px; line-height: 1; cursor: pointer;
1675
+ font-size: var(--fs-micro); line-height: 1; cursor: pointer;
1686
1676
  opacity: 0; transition: opacity var(--dur-base) var(--ease), background var(--dur-snap) var(--ease);
1687
1677
  }
1688
1678
  .ds-247420 .ds-file-row:hover .ds-file-check,
@@ -2160,7 +2150,7 @@
2160
2150
  ============================================================ */
2161
2151
  .ds-247420 .app-side .count {
2162
2152
  background: color-mix(in oklab, var(--mascot) 92%, transparent);
2163
- padding: 1px 8px; font-size: 10px; font-weight: 700;
2153
+ padding: 1px 8px; font-size: var(--fs-micro); font-weight: 700;
2164
2154
  font-family: var(--ff-mono); letter-spacing: 0.04em;
2165
2155
  min-width: 18px; text-align: center;
2166
2156
  }