Skip to content

Commit 2ee5461

Browse files
committed
header
1 parent 7f6d863 commit 2ee5461

5 files changed

Lines changed: 68 additions & 21 deletions

File tree

index.html

Lines changed: 18 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,22 @@
11
<!doctype html>
22
<html lang="en">
3-
<head>
4-
<meta charset="UTF-8" />
5-
<link rel="apple-touch-icon" sizes="180x180" href="favicon/apple-touch-icon.png?v=2">
6-
<link rel="icon" type="image/png" sizes="32x32" href="favicon/favicon-32x32.png?v=2">
7-
<link rel="icon" type="image/png" sizes="16x16" href="favicon/favicon-16x16.png?v=2">
8-
<link rel="manifest" href="favicon/site.webmanifest?v=2">
3+
4+
<head>
5+
<meta charset="UTF-8" />
6+
<link rel="apple-touch-icon" sizes="180x180" href="favicon/apple-touch-icon.png">
7+
<link rel="icon" type="image/png" sizes="32x32" href="favicon/favicon-32x32.png">
8+
<link rel="icon" type="image/png" sizes="16x16" href="favicon/favicon-16x16.png">
9+
<link rel="manifest" href="favicon/site.webmanifest">
10+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@kiwicarbon/assets/dist/kiwi.css">
11+
912
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
1013
<script src="coi-serviceworker.js"></script>
11-
<title>Binance Order Book Heatmap | Sajid Ahmed</title> </head>
12-
<body>
13-
<div id="root"></div>
14-
<script type="module" src="src/index.tsx"></script>
15-
</body>
16-
</html>
14+
<title>Binance Order Book Heatmap | Sajid Ahmed</title>
15+
</head>
16+
17+
<body>
18+
<div id="root"></div>
19+
<script type="module" src="src/index.tsx"></script>
20+
</body>
21+
22+
</html>

package-lock.json

Lines changed: 23 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
"preview": "vite preview"
1010
},
1111
"dependencies": {
12+
"@kiwicarbon/assets": "^2.0.4",
1213
"coi-serviceworker": "^0.1.7",
1314
"solid-js": "^1.9.10"
1415
},
@@ -18,4 +19,4 @@
1819
"vite": "^7.3.1",
1920
"vite-plugin-solid": "^2.11.10"
2021
}
21-
}
22+
}

src/App.module.css

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@
3333
color: #1e293b;
3434
display: flex;
3535
align-items: center;
36-
gap: 10px;
36+
gap: 1rem;
3737
}
3838

3939
.symbol {
@@ -60,6 +60,21 @@
6060
transform: scale(1.1);
6161
}
6262

63+
.kiwiLink {
64+
display: flex;
65+
font-size: 3rem;
66+
align-items: center;
67+
color: #0062ff;
68+
text-decoration: none;
69+
transition: all 0.2s;
70+
opacity: 0.8;
71+
}
72+
73+
.kiwiLink:hover {
74+
opacity: 1;
75+
transform: scale(1.1);
76+
}
77+
6378
.divider {
6479
height: 16px;
6580
width: 1px;

src/App.tsx

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,12 @@ function App() {
77
<div class={styles.appContainer}>
88
<header class={styles.header}>
99
<h1 class={styles.title}>
10-
<svg style={{ height: "2rem", width: "2rem" }} fill="#F0B90B" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Binance</title><path d="M16.624 13.9202l2.7175 2.7154-7.353 7.353-7.353-7.352 2.7175-2.7164 4.6355 4.6595 4.6356-4.6595zm4.6366-4.6366L24 12l-2.7154 2.7164L18.5682 12l2.6924-2.7164zm-9.272.001l2.7163 2.6914-2.7164 2.7174v-.001L9.2721 12l2.7164-2.7154zm-9.2722-.001L5.4088 12l-2.6914 2.6924L0 12l2.7164-2.7164zM11.9885.0115l7.353 7.329-2.7174 2.7154-4.6356-4.6356-4.6355 4.6595-2.7174-2.7154 7.353-7.353z" /></svg>
10+
<a href="https://sajidahmed.co.uk" target="_blank" rel="noopener noreferrer" class={styles.kiwiLink}>
11+
<i class="kiwi-logo" />
12+
</a>
13+
<a href="https://www.binance.com/en-GB/orderbook/btc_usdt" target="_blank" rel="noopener noreferrer" class={styles.githubLink}>
14+
<svg style={{ height: "3rem", width: "3rem" }} fill="#F0B90B" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Binance</title><path d="M16.624 13.9202l2.7175 2.7154-7.353 7.353-7.353-7.352 2.7175-2.7164 4.6355 4.6595 4.6356-4.6595zm4.6366-4.6366L24 12l-2.7154 2.7164L18.5682 12l2.6924-2.7164zm-9.272.001l2.7163 2.6914-2.7164 2.7174v-.001L9.2721 12l2.7164-2.7154zm-9.2722-.001L5.4088 12l-2.6914 2.6924L0 12l2.7164-2.7164zM11.9885.0115l7.353 7.329-2.7174 2.7154-4.6356-4.6356-4.6355 4.6595-2.7174-2.7154 7.353-7.353z" /></svg>
15+
</a>
1116
<span class={styles.symbol}>{activeSymbol().replace('USDT', '/USDT')}</span>{' '}
1217
<span class={styles.titleText}>Binance Order Book Heatmap</span>
1318
</h1>
@@ -19,7 +24,7 @@ function App() {
1924
rel="noopener noreferrer"
2025
class={styles.githubLink}
2126
>
22-
<svg height="24" width="24" viewBox="0 0 16 16" fill="currentColor">
27+
<svg height="40" width="40" viewBox="0 0 16 16" fill="currentColor">
2328
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z" />
2429
</svg>
2530
</a>
@@ -28,13 +33,13 @@ function App() {
2833
&copy; 2026 Sajid Ahmed<br />All Rights Reserved
2934
</span>
3035
</div>
31-
</header>
36+
</header >
3237

3338
<main class={styles.mainContent}>
3439
{/* Switch back to live container */}
3540
<HeatmapContainer />
3641
</main>
37-
</div>
42+
</div >
3843
);
3944
}
4045

0 commit comments

Comments
 (0)