Convert app into @modernsk/ui component library package
- Add library entry (src/index.ts) re-exporting all components, theme, and TooltipProvider - Add shippable stylesheet (src/styles/index.css): tokens + components only, font inlined as base64 at build time - Build with tsup (ESM + CJS + .d.ts) and esbuild for CSS - package.json: exports map, files, sideEffects, peerDependencies (react/react-dom), correct deps (radix-ui), prepare-on-install - Fix phantom dependency: declare radix-ui, drop unused @radix-ui/themes - Remove Storybook boilerplate, Tailwind/PostCSS (unused) - Keep App.tsx + Rsbuild as dev-only playground (not published) Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,32 @@
|
||||
@import './tokens.css';
|
||||
@import './components.css';
|
||||
|
||||
*{ box-sizing:border-box; margin:0; padding:0; }
|
||||
html{ height:100%; }
|
||||
body{
|
||||
min-height:100vh;
|
||||
font-family:var(--font-sans);
|
||||
color:var(--fg-1);
|
||||
-webkit-font-smoothing:antialiased;
|
||||
}
|
||||
|
||||
/* Kitchen Sink layout helpers (ported from the prototype's inline <style>) */
|
||||
.wrap{ max-width:1100px; margin:0 auto; padding:64px 40px 120px; position:relative; z-index:1; }
|
||||
|
||||
.word{ font-family:var(--font-display); font-size:30px; letter-spacing:.01em; text-transform:uppercase; }
|
||||
.word b{ color:var(--lime); font-weight:400; }
|
||||
.sub{ color:var(--fg-2); font-size:15px; margin-top:8px; max-width:560px; line-height:1.5; }
|
||||
.topbar{ display:flex; align-items:flex-start; justify-content:space-between; gap:24px; }
|
||||
|
||||
section{ margin-top:52px; }
|
||||
.sec-label{ font-size:11px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:var(--fg-3); margin-bottom:20px; display:flex; align-items:center; gap:12px; }
|
||||
.sec-label::after{ content:""; flex:1; height:1px; background:var(--hair); }
|
||||
|
||||
.grid{ display:grid; gap:18px; }
|
||||
.cluster{ display:flex; gap:16px; align-items:center; flex-wrap:wrap; }
|
||||
.stack{ display:flex; flex-direction:column; gap:14px; }
|
||||
.cap{ font-size:11px; font-weight:600; color:var(--fg-3); text-transform:uppercase; letter-spacing:.14em; margin-bottom:10px; }
|
||||
.lab{ font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.18em; color:var(--fg-3); margin-bottom:5px; }
|
||||
.two{ display:grid; grid-template-columns:1fr 1fr; gap:32px; }
|
||||
.three{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:start; }
|
||||
.panel{ padding:20px; }
|
||||
Reference in New Issue
Block a user