git.stevedylan.dev

chore: refactor repo 9d8086ed

Steve · 2025-09-19 22:42 12 file(s) · +215 −121

package.json +1 −1

	],
	"scripts": {
		"build": "bun build src/index.ts --outdir dist --target node && cp -r src/components dist/",
		"dev": "bun src/index.html --console"
		"dev": "bun site/index.html --console"
	},
	"keywords": [
		"web-components",

site/index.html (added) +214 −0

1	+	<!DOCTYPE html>
2	+	<html lang="en">
3	+	<head>
4	+	<meta charset="UTF-8">
5	+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
6	+	<title>Norns</title>
7	+	<link rel="apple-touch-icon" sizes="180x180" href="https://norns.so/apple-touch-icon.png">
8	+	<link rel="icon" type="image/png" sizes="32x32" href="https://norns.so/favicon-32x32.png">
9	+	<link rel="icon" type="image/png" sizes="16x16" href="https://norns.so/favicon-16x16.png">
10	+	<link rel="manifest" href="https://norns.so/site.webmanifest">
11	+	<meta name="theme-color" content="#121113">
12	+	<meta name="description" content="Interoperable web components for decentralized apps">
13	+
14	+	<!-- Facebook Meta Tags -->
15	+	<meta property="og:url" content="https://norns.so">
16	+	<meta property="og:type" content="website">
17	+	<meta property="og:title" content="Norns">
18	+	<meta property="og:description" content="Interoperable web components for decentralized apps">
19	+	<meta property="og:image" content="/og.png">
20	+
21	+	<!-- Twitter Meta Tags -->
22	+	<meta name="twitter:card" content="summary_large_image">
23	+	<meta property="twitter:domain" content="norns.so">
24	+	<meta property="twitter:url" content="https://norns.so">
25	+	<meta name="twitter:title" content="Norns">
26	+	<meta name="twitter:description" content="Interoperable web components for decentralized apps">
27	+	<meta name="twitter:image" content="/og.png">
28	+
29	+	<style>
30	+
31	+	html {
32	+	background: #121113;
33	+	}
34	+
35	+	body {
36	+	color: white;
37	+	font-family: ui-monospace, "SF Mono", Monaco, "Cascadia Code", "Roboto Mono", Consolas, "Courier New", monospace;
38	+	min-height: 100vh;
39	+	width: 100%;
40	+	display: flex;
41	+	flex-direction: column;
42	+	align-items: center;
43	+	justify-content: start;
44	+	padding: 0;
45	+	margin: 0;
46	+	}
47	+
48	+	main {
49	+	display: flex;
50	+	align-items: center;
51	+	flex-direction: column;
52	+	padding: 2rem 0 0 0;
53	+	}
54	+
55	+	.container {
56	+	border: 1px solid white;
57	+	border-radius: 5px;
58	+	width: 400px;
59	+	height: 400px;
60	+	display: flex;
61	+	align-items: center;
62	+	justify-content: center;
63	+	}
64	+
65	+	.component-showcase {
66	+	display: flex;
67	+	flex-direction: column;
68	+	align-items: start;
69	+	gap: 1rem;
70	+	}
71	+
72	+	.component-label {
73	+	font-size: 1.2rem;
74	+	color: #ccc;
75	+	}
76	+
77	+	.code-snippet {
78	+	background: #1e1e1e;
79	+	border: 1px solid #333;
80	+	border-radius: 3px;
81	+	padding: 0.5rem;
82	+	font-size: 0.8rem;
83	+	color: #888;
84	+	margin-top: 0.5rem;
85	+	text-align: center;
86	+	}
87	+
88	+	.header {
89	+	text-align: center;
90	+	margin-bottom: 2rem;
91	+	max-width: 300px;
92	+	}
93	+
94	+	.header h1 {
95	+	font-size: 48px;
96	+	margin-bottom: -10px;
97	+	}
98	+
99	+	.header img {
100	+	width: 150px;
101	+	height: 150px;
102	+	margin-bottom: -35px;
103	+	}
104	+
105	+	.header p {
106	+	font-size: 14px;
107	+	}
108	+
109	+	.github-button {
110	+	display: inline-flex;
111	+	align-items: center;
112	+	gap: 0.5rem;
113	+	background: #1E1E1E;
114	+	color: white;
115	+	text-decoration: none;
116	+	padding: 0.75rem 1.25rem;
117	+	border-radius: 5px;
118	+	font-size: 0.9rem;
119	+	margin-top: 1rem;
120	+	transition: background 0.2s;
121	+	}
122	+
123	+	.github-button:hover {
124	+	background: #444;
125	+	}
126	+
127	+	.github-icon {
128	+	width: 16px;
129	+	height: 16px;
130	+	fill: currentColor;
131	+	}
132	+
133	+	@media (max-width: 768px) {
134	+	.container {
135	+	width: 300px;
136	+	height: 300px;
137	+	}
138	+
139	+	.header h1 {
140	+	font-size: 42px;
141	+	}
142	+
143	+	.header img {
144	+	width: 120px;
145	+	height: 120px;
146	+	margin-bottom: -30px;
147	+	}
148	+
149	+	.header p {
150	+	font-size: 12px;
151	+	}
152	+
153	+	.component-label {
154	+	font-size: 1rem;
155	+	}
156	+	}
157	+
158	+	@media (max-width: 480px) {
159	+	.container {
160	+	width: 300px;
161	+	height: 300px;
162	+	}
163	+
164	+	.header {
165	+	max-width: 250px;
166	+	}
167	+
168	+	.header h1 {
169	+	margin-bottom: -5px;
170	+	}
171	+
172	+	.header img {
173	+	margin-bottom: -25px;
174	+	}
175	+
176	+	.component-label {
177	+	font-size: 0.9rem;
178	+	}
179	+
180	+	.code-snippet {
181	+	font-size: 0.7rem;
182	+	}
183	+
184	+	}
185	+
186	+	</style>
187	+	</head>
188	+	<body>
189	+	<main>
190	+	<div class="header">
191	+	<img src="logo.svg" alt="norns logo" />
192	+	<h1>norns</h1>
193	+	<p>Interopable web components for decentralized applications</p>
194	+	<a href="https://github.com/stevedylandev/norns" target="_blank" class="github-button">
195	+	<svg class="github-icon" viewBox="0 0 24 24">
196	+	<path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
197	+	</svg>
198	+	stevedylandev/norns
199	+	</a>
200	+	</div>
201	+	<div class="component-showcase">
202	+	<div class="container">
203	+	<connect-wallet></connect-wallet>
204	+	</div>
205	+	<div class="component-label">connect-wallet</div>
206	+	<div class="code-snippet">
207	+	npx norns-ui@latest add connect-wallet
208	+	</div>
209	+	</div>
210	+	</main>
211	+
212	+	<script src="components/connect-wallet.js"></script>
213	+	</body>
214	+	</html>

src/android-chrome-192x192.png → site/android-chrome-192x192.png +0 −0

Binary file — no preview.

src/android-chrome-512x512.png → site/android-chrome-512x512.png +0 −0

Binary file — no preview.

src/apple-touch-icon.png → site/apple-touch-icon.png +0 −0

Binary file — no preview.

src/favicon-16x16.png → site/favicon-16x16.png +0 −0

Binary file — no preview.

src/favicon-32x32.png → site/favicon-32x32.png +0 −0

Binary file — no preview.

src/favicon.ico → site/favicon.ico +0 −0

Binary file — no preview.

src/index.html (deleted) +0 −120

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Norns</title>
    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
    <link rel="manifest" href="/site.webmanifest">
    <meta name="description" content="Interoperable web components for decentralized apps">

    <!-- Facebook Meta Tags -->
    <meta property="og:url" content="https://norns.so">
    <meta property="og:type" content="website">
    <meta property="og:title" content="Norns">
    <meta property="og:description" content="Interoperable web components for decentralized apps">
    <meta property="og:image" content="/og.png">

    <!-- Twitter Meta Tags -->
    <meta name="twitter:card" content="summary_large_image">
    <meta property="twitter:domain" content="norns.so">
    <meta property="twitter:url" content="https://norns.so">
    <meta name="twitter:title" content="Norns">
    <meta name="twitter:description" content="Interoperable web components for decentralized apps">
    <meta name="twitter:image" content="/og.png">

  <style>

    body {
      background: #121113;
      color: white;
      font-family: ui-monospace, "SF Mono", Monaco, "Cascadia Code", "Roboto Mono", Consolas, "Courier New", monospace;
      min-height: 100vh;
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: start;
    }

    main {
      display: flex;
      align-items: start;
      flex-direction: column;
      padding: 2rem 0;
    }

    .container {
      border: 1px solid white;
      border-radius: 5px;
      width: 400px;
      height: 400px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .component-showcase {
      display: flex;
      flex-direction: column;
      align-items: start;
      gap: 1rem;
    }

    .component-label {
      font-size: 1.2rem;
      color: #ccc;
    }

    .code-snippet {
      background: #1e1e1e;
      border: 1px solid #333;
      border-radius: 3px;
      padding: 0.5rem;
      font-size: 0.8rem;
      color: #888;
      margin-top: 0.5rem;
      text-align: center;
    }

    .header {
      text-align: start;
      margin-bottom: 2rem;
      max-width: 300px;
    }

    .header img {
      width: 100px;
      height: 100px;
      margin-bottom: -35px;
    }

    .header p {
      font-size: 14px;
    }

  </style>
</head>
<body>
  <main>
  <div class="header">
    <img src="logo.svg" alt="norns logo" />
    <h1>norns</h1>
    <p>Interopable web components for decentralized applications</p>
  </div>
  <div class="component-showcase">
    <div class="container">
      <connect-wallet></connect-wallet>
    </div>
    <div class="component-label">connect-wallet</div>
    <div class="code-snippet">
      npx norns-ui@latest add connect-wallet
    </div>
  </div>
  </main>

  <script src="components/connect-wallet.js"></script>
</body>
</html>

src/logo.svg → site/logo.svg +0 −0

src/og.png → site/og.png +0 −0

Binary file — no preview.

src/site.webmanifest → site/site.webmanifest +0 −0

12	12		],
13	13		"scripts": {
14	14		"build": "bun build src/index.ts --outdir dist --target node && cp -r src/components dist/",
15		-	"dev": "bun src/index.html --console"
	15	+	"dev": "bun site/index.html --console"
16	16		},
17	17		"keywords": [
18	18		"web-components",