sune-org/sune-logo
1
0
Fork 0
mirror of https://github.com/sune-org/sune-logo.git synced 2026-03-17 03:11:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

Delete index.html

Browse Source
This commit is contained in:
multipleof4
2026-02-23 16:43:40 -08:00
committed by GitHub
parent 87a2b3b5bb
commit caf241fc23
1 changed files with 0 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
index.html
View File

@@ -1,62 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sune Logo Demo</title>
<script src="https://cdn.tailwindcss.com"></script>
<style>
body { background-color: #f9fafb; }
.card { background: white; border-radius: 1rem; padding: 2rem; box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1); }
</style>
</head>
<body class="min-h-screen flex flex-col items-center justify-center p-8">
<div class="max-w-2xl w-full space-y-8">
<header class="text-center">
<h1 class="text-3xl font-bold text-gray-900 mb-2">Sune Logo</h1>
<p class="text-gray-500">Procedural SVG Starburst Component</p>
</header>
<section class="card flex flex-col items-center gap-6">
<h2 class="text-sm font-semibold uppercase tracking-widest text-gray-400">Animated Hero</h2>
<div id="hero-logo"></div>
<div class="flex gap-4">
<div id="small-logo-1"></div>
<div id="small-logo-2"></div>
<div id="small-logo-3"></div>
</div>
</section>
<section class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="card flex flex-col items-center gap-4">
<h2 class="text-sm font-semibold uppercase tracking-widest text-gray-400">Static (Export)</h2>
<div id="static-logo"></div>
</div>
<div class="card flex flex-col items-center gap-4">
<h2 class="text-sm font-semibold uppercase tracking-widest text-gray-400">Custom Color</h2>
<div id="colored-logo"></div>
</div>
</section>
</div>
<script type="module">
import { suneLogoEl, suneLogoStatic } from './sune-logo.js';
// Hero Logo
document.getElementById('hero-logo').appendChild(suneLogoEl({ size: 128, color: '#000' }));
// Small Variations
document.getElementById('small-logo-1').appendChild(suneLogoEl({ size: 32, color: '#4b5563' }));
document.getElementById('small-logo-2').appendChild(suneLogoEl({ size: 32, color: '#9ca3af' }));
document.getElementById('small-logo-3').appendChild(suneLogoEl({ size: 32, color: '#d1d5db' }));
// Static Version
const staticSvg = suneLogoStatic({ size: 64, color: '#000' });
document.getElementById('static-logo').innerHTML = staticSvg;
// Colored Version
document.getElementById('colored-logo').appendChild(suneLogoEl({ size: 64, color: '#f59e0b' }));
</script>
</body>
</html>