Skip to content

Commit 5f520ea

Browse files
BeardedTech0oBeardedTech0o
authored
Merge pull request #8 from BeardedTech0o/claude/beautiful-faraday-z8ix8i
Restyle app with nullobj design system
2 parents bee845d + c24ee16 commit 5f520ea

13 files changed

Lines changed: 354 additions & 198 deletions

‎app.js‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -719,11 +719,11 @@ function sigColor(rssi){
719719
return 'var(--sig-bad)';
720720
}
721721
function sigColorHex(rssi){
722-
if(rssi==null) return '#54545870';
723-
if(rssi>=-100) return '#30d158';
724-
if(rssi>=-110) return '#a4d65e';
725-
if(rssi>=-120) return '#ff9f0a';
726-
return '#ff453a';
722+
if(rssi==null) return 'var(--faint)';
723+
if(rssi>=-100) return 'var(--sig-ex)';
724+
if(rssi>=-110) return 'var(--sig-gd)';
725+
if(rssi>=-120) return 'var(--sig-ok)';
726+
return 'var(--sig-bad)';
727727
}
728728

729729
function renderMap(){
@@ -736,11 +736,11 @@ function renderMap(){
736736
const online=isOnline(n);
737737
const sz=sel?22:(isMe?18:14);
738738
// All online nodes: green filled. My node: blue filled. Offline: faded red.
739-
const fill=online?(isMe?'#0a84ff':'#30d158'):'#ff453a';
739+
const fill=online?(isMe?'var(--fg)':'var(--ok)'):'var(--danger)';
740740
const pinClass=`mesh-pin ${online?(isMe?'me-pin':'online'):'offline'}`;
741741
const icon=L.divIcon({
742742
className:'',
743-
html:`<div class="${pinClass}" style="width:${sz}px;height:${sz}px;background:${fill};border:2px solid ${online?(isMe?'#5ac8fa':'#34e86a'):'#ff453a'};"></div>`,
743+
html:`<div class="${pinClass}" style="width:${sz}px;height:${sz}px;background:${fill};border:2px solid var(--bg);outline:1px solid ${fill};"></div>`,
744744
iconSize:[sz,sz],iconAnchor:[sz/2,sz/2],tooltipAnchor:[sz/2+4,0]
745745
});
746746
if(markers[n.num]){

‎fonts/fonts.css‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
@font-face{
2+
font-family: 'Inter Tight Variable';
3+
font-style: normal;
4+
font-display: swap;
5+
font-weight: 100 900;
6+
src: url(./inter-tight-cyrillic-ext-wght-normal.woff2) format('woff2-variations');
7+
unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
8+
}
9+
@font-face{
10+
font-family: 'Inter Tight Variable';
11+
font-style: normal;
12+
font-display: swap;
13+
font-weight: 100 900;
14+
src: url(./inter-tight-cyrillic-wght-normal.woff2) format('woff2-variations');
15+
unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
16+
}
17+
@font-face{
18+
font-family: 'Inter Tight Variable';
19+
font-style: normal;
20+
font-display: swap;
21+
font-weight: 100 900;
22+
src: url(./inter-tight-greek-ext-wght-normal.woff2) format('woff2-variations');
23+
unicode-range: U+1F00-1FFF;
24+
}
25+
@font-face{
26+
font-family: 'Inter Tight Variable';
27+
font-style: normal;
28+
font-display: swap;
29+
font-weight: 100 900;
30+
src: url(./inter-tight-greek-wght-normal.woff2) format('woff2-variations');
31+
unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
32+
}
33+
@font-face{
34+
font-family: 'Inter Tight Variable';
35+
font-style: normal;
36+
font-display: swap;
37+
font-weight: 100 900;
38+
src: url(./inter-tight-vietnamese-wght-normal.woff2) format('woff2-variations');
39+
unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
40+
}
41+
@font-face{
42+
font-family: 'Inter Tight Variable';
43+
font-style: normal;
44+
font-display: swap;
45+
font-weight: 100 900;
46+
src: url(./inter-tight-latin-ext-wght-normal.woff2) format('woff2-variations');
47+
unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
48+
}
49+
@font-face{
50+
font-family: 'Inter Tight Variable';
51+
font-style: normal;
52+
font-display: swap;
53+
font-weight: 100 900;
54+
src: url(./inter-tight-latin-wght-normal.woff2) format('woff2-variations');
55+
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
56+
}

‎fonts/inter-tight-cyrillic-ext-wght-normal.woff2‎

26 KB
Binary file not shown.

‎fonts/inter-tight-cyrillic-wght-normal.woff2‎

16.6 KB
Binary file not shown.

‎fonts/inter-tight-greek-ext-wght-normal.woff2‎

11.4 KB
Binary file not shown.

‎fonts/inter-tight-greek-wght-normal.woff2‎

21.7 KB
Binary file not shown.

‎fonts/inter-tight-latin-ext-wght-normal.woff2‎

87.7 KB
Binary file not shown.

‎fonts/inter-tight-latin-wght-normal.woff2‎

43.8 KB
Binary file not shown.

‎fonts/inter-tight-vietnamese-wght-normal.woff2‎

10.2 KB
Binary file not shown.

‎index.html‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,12 @@
99
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
1010
<!-- Material Symbols (Google Icons) -->
1111
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200"/>
12-
<!-- nullxx identity: Google Sans Flex (UI text, via tokens.css) + JetBrains Mono (numeric/technical: peer IDs, signal metrics, timestamps) -->
13-
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&display=swap"/>
12+
<!-- nullobj: Inter Tight Variable ships in ./fonts (via tokens.css). Theme follows the OS. -->
13+
<script>
14+
(function(){var m=window.matchMedia('(prefers-color-scheme: dark)');
15+
function set(){document.documentElement.dataset.theme=m.matches?'dark':'light';}
16+
set();if(m.addEventListener)m.addEventListener('change',set);})();
17+
</script>
1418
<link rel="stylesheet" href="tokens.css">
1519
<link rel="stylesheet" href="styles.css">
1620
</head>
@@ -22,7 +26,7 @@
2226

2327
<!-- App / node identity -->
2428
<div class="nav-identity">
25-
<div class="nav-id-icon"><span class="icon filled" style="color:#fff;font-size:20px">cell_tower</span></div>
29+
<div class="nav-id-icon"><span class="icon filled" style="font-size:20px">cell_tower</span></div>
2630
<div class="nav-id-text">
2731
<div class="nav-id-name" id="navNodeName">nullmesh</div>
2832
<div class="nav-id-sub" id="navNodeSub">No node connected</div>
@@ -298,7 +302,7 @@ <h1 class="page-title">Config</h1>
298302
<!-- First-run guided connect -->
299303
<div class="ov first-run" id="firstRun">
300304
<div class="fr-card">
301-
<div class="fr-icon"><span class="icon filled" style="color:#fff;font-size:28px">cell_tower</span></div>
305+
<div class="fr-icon"><span class="icon filled" style="font-size:28px">cell_tower</span></div>
302306
<h2 class="fr-title">Connect to your Meshtastic node</h2>
303307
<p class="fr-body">nullmesh talks to a node on your local network over Wi-Fi. Enter the IP address your
304308
radio shows on its screen (or the one your router assigned it) and nullmesh will load your mesh.</p>

0 commit comments

Comments
 (0)