xlkit-demo 0.0.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/assets/index-Btwfb27P.css +1 -0
- package/dist/assets/index-DpFtiGxh.js +86 -0
- package/dist/index.html +22 -0
- package/index.html +12 -0
- package/main.tsx +114 -0
- package/package.json +23 -0
- package/tsconfig.json +21 -0
- package/vite.config.ts +18 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
:root{--primary: #6366f1;--primary-light: #818cf8;--primary-dark: #4f46e5;--secondary: #10b981;--accent: #f59e0b;--danger: #ef4444;--bg-dark: #0f172a;--bg-card: #1e293b;--bg-card-hover: #334155;--text-primary: #f8fafc;--text-secondary: #94a3b8;--text-muted: #64748b;--border: #334155;--shadow: 0 25px 50px -12px rgba(0, 0, 0, .5);--shadow-glow: 0 0 60px rgba(99, 102, 241, .3);--radius-sm: 8px;--radius-md: 12px;--radius-lg: 20px;--radius-xl: 28px;--transition: all .3s cubic-bezier(.4, 0, .2, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:Inter,system-ui,-apple-system,sans-serif;background:var(--bg-dark);color:var(--text-primary);line-height:1.6;min-height:100vh;overflow-x:hidden}.bg-gradient{position:fixed;top:0;left:0;width:100%;height:100%;background:radial-gradient(ellipse at 20% 20%,rgba(99,102,241,.15) 0%,transparent 50%),radial-gradient(ellipse at 80% 80%,rgba(16,185,129,.1) 0%,transparent 50%),radial-gradient(ellipse at 50% 50%,rgba(245,158,11,.05) 0%,transparent 50%);pointer-events:none;z-index:0}.container{max-width:1200px;margin:0 auto;padding:2rem;position:relative;z-index:1}.hero{text-align:center;padding:4rem 1rem 3rem}.logo{width:120px;height:120px;margin-bottom:1.5rem;animation:float 3s ease-in-out infinite;filter:drop-shadow(0 10px 30px rgba(99,102,241,.4));border-radius:50%}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.title{font-size:3.5rem;font-weight:800;background:linear-gradient(135deg,var(--primary-light),var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem;letter-spacing:-.02em}.subtitle{font-size:1.25rem;color:var(--text-secondary);max-width:600px;margin:0 auto 2rem}.badge{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#6366f11a;border:1px solid rgba(99,102,241,.3);border-radius:9999px;font-size:.875rem;color:var(--primary-light)}.section{margin-bottom:4rem}.section-title{font-size:1.75rem;font-weight:700;margin-bottom:1.5rem;display:flex;align-items:center;gap:.75rem}.section-title:before{content:"";width:4px;height:28px;background:linear-gradient(180deg,var(--primary),var(--secondary));border-radius:2px}.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem}.demo-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.5rem;transition:var(--transition);position:relative;overflow:hidden}.demo-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--card-color, var(--primary)),transparent)}.demo-card:hover{transform:translateY(-4px);border-color:var(--card-color, var(--primary));box-shadow:var(--shadow),0 0 40px #6366f11a}.demo-card.basic{--card-color: #4472c4}.demo-card.minimal{--card-color: #70ad47}.demo-card.striped{--card-color: #ed7d31}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.card-title{font-size:1.25rem;font-weight:600}.card-badge{padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:500;background:#6366f126;color:var(--primary-light)}.card-description{color:var(--text-secondary);font-size:.875rem;margin-bottom:1.25rem;line-height:1.7}.preview-table{background:#0000004d;border-radius:var(--radius-sm);padding:.75rem;margin-bottom:1.25rem;overflow-x:auto}.preview-table table{width:100%;border-collapse:collapse;font-size:.75rem}.preview-table th,.preview-table td{padding:.4rem .6rem;text-align:left}.preview-table th{background:var(--card-color, var(--primary));color:#fff;font-weight:600}.preview-table.basic th{background:#4472c4}.preview-table.minimal th{background:transparent;color:var(--text-primary);font-weight:700;border-bottom:2px solid var(--border)}.preview-table.striped tr:nth-child(odd) td{background:#ffffff08}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.875rem 1.5rem;border-radius:var(--radius-md);font-size:.9375rem;font-weight:600;cursor:pointer;border:none;transition:var(--transition);width:100%}.btn-primary{background:linear-gradient(135deg,var(--card-color, var(--primary)),var(--card-color, var(--primary-dark)));color:#fff;box-shadow:0 4px 15px #6366f14d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px #6366f166}.btn-primary:active{transform:translateY(0)}.btn-icon{width:20px;height:20px}.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem}.feature-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);padding:1.25rem;transition:var(--transition)}.feature-card:hover{border-color:var(--primary);background:var(--bg-card-hover)}.feature-icon{width:40px;height:40px;background:linear-gradient(135deg,var(--primary),var(--secondary));border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;margin-bottom:.75rem;font-size:1.25rem}.feature-title{font-size:1rem;font-weight:600;margin-bottom:.5rem}.feature-description{font-size:.875rem;color:var(--text-secondary);line-height:1.6}.code-block{background:#0006;border:1px solid var(--border);border-radius:var(--radius-md);padding:1.5rem;overflow-x:auto}.code-block pre{font-family:JetBrains Mono,Fira Code,monospace;font-size:.8125rem;line-height:1.7;color:var(--text-secondary)}.code-block .keyword{color:#c792ea}.code-block .string{color:#c3e88d}.code-block .function{color:#82aaff}.code-block .property{color:#f78c6c}.code-block .comment{color:#546e7a}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-top:2rem}.stat{text-align:center;padding:1.5rem;background:var(--bg-card);border-radius:var(--radius-md);border:1px solid var(--border)}.stat-value{font-size:2rem;font-weight:800;background:linear-gradient(135deg,var(--primary-light),var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.stat-label{font-size:.875rem;color:var(--text-secondary);margin-top:.25rem}.footer{text-align:center;padding:3rem 1rem;border-top:1px solid var(--border);margin-top:2rem}.footer-links{display:flex;justify-content:center;gap:2rem;margin-bottom:1.5rem;flex-wrap:wrap}.footer-link{color:var(--text-secondary);text-decoration:none;font-size:.9375rem;transition:color .2s;display:flex;align-items:center;gap:.5rem}.footer-link:hover{color:var(--primary-light)}.footer-copy{color:var(--text-muted);font-size:.875rem}@media(max-width:768px){.title{font-size:2.5rem}.subtitle{font-size:1rem}.container{padding:1rem}.card-grid,.feature-grid{grid-template-columns:1fr}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-in{animation:fadeInUp .6s ease-out forwards}.delay-1{animation-delay:.1s}.delay-2{animation-delay:.2s}.delay-3{animation-delay:.3s}.btn:disabled{opacity:.7;cursor:not-allowed}.spinner{width:20px;height:20px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
|