Skip to content

Commit e56c4d0

Browse files
numbpill3dnumbpill3d
committed
Refactor titles and navigation labels for clarity and consistency across the application
1 parent 8fe425b commit e56c4d0

6 files changed

Lines changed: 110 additions & 179 deletions

File tree

‎css/style.css‎

Lines changed: 50 additions & 128 deletions
Original file line numberDiff line numberDiff line change
@@ -3,22 +3,22 @@
33
Softer forum-inspired chrome (00s webcore)
44
=============================================== */
55

6-
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;600;700&family=IBM+Plex+Sans:wght@400;500;600&family=Tahoma:wght@400;700&display=swap');
6+
/* Retro BBS Style */
77

88
:root {
9-
--bg: #d7deef;
10-
--bg-2: #c4cce2;
11-
--panel: #ecf0fb;
12-
--panel-soft: #e5eaf7;
13-
--edge: #95a6c7;
14-
--edge-hot: #6c82c2;
15-
--accent: #2f4fa2;
16-
--accent-2: #6585d8;
17-
--accent-3: #4c6fbe;
18-
--text: #0f1b3b;
19-
--muted: #516185;
20-
--shadow: 0 10px 28px rgba(22, 32, 70, 0.18);
21-
--radius: 10px;
9+
--bg: #000000;
10+
--bg-2: #111111;
11+
--panel: #000000;
12+
--panel-soft: #111111;
13+
--edge: #00FF00;
14+
--edge-hot: #00FF00;
15+
--accent: #00FF00;
16+
--accent-2: #00FF00;
17+
--accent-3: #00FF00;
18+
--text: #00FF00;
19+
--muted: #00AA00;
20+
--shadow: none;
21+
--radius: 0px;
2222
}
2323

2424
* {
@@ -28,37 +28,16 @@
2828
}
2929

3030
body {
31-
font-family: 'IBM Plex Sans', 'Tahoma', 'Trebuchet MS', system-ui, sans-serif;
32-
background:
33-
linear-gradient(180deg, #eef2fb 0%, #dae2f3 40%, #d0d9ef 100%);
31+
font-family: 'Courier New', monospace;
32+
background: var(--bg);
3433
color: var(--text);
3534
line-height: 1.6;
3635
min-height: 100vh;
3736
position: relative;
3837
overflow-x: hidden;
3938
}
4039

41-
body::before {
42-
content: '';
43-
position: fixed;
44-
inset: 0;
45-
background:
46-
linear-gradient(90deg, rgba(255, 255, 255, 0.4) 1px, transparent 1px),
47-
linear-gradient(0deg, rgba(255, 255, 255, 0.35) 1px, transparent 1px);
48-
background-size: 90px 90px;
49-
opacity: 0.18;
50-
pointer-events: none;
51-
z-index: -2;
52-
}
5340

54-
body::after {
55-
content: '';
56-
position: fixed;
57-
inset: 0;
58-
background: linear-gradient(180deg, rgba(255, 255, 255, 0.35), rgba(255, 255, 255, 0.1));
59-
pointer-events: none;
60-
z-index: -1;
61-
}
6241

6342
a {
6443
color: var(--accent);
@@ -72,7 +51,7 @@ a:hover {
7251
}
7352

7453
h1, h2, h3, h4, h5, h6 {
75-
font-family: 'Orbitron', 'IBM Plex Sans', sans-serif;
54+
font-family: 'Courier New', monospace;
7655
font-weight: 600;
7756
letter-spacing: 0.5px;
7857
color: var(--text);
@@ -82,7 +61,6 @@ h1 {
8261
font-size: 2.2rem;
8362
text-align: center;
8463
color: var(--accent);
85-
text-shadow: 0 1px 0 #fff, 0 8px 18px rgba(16, 33, 82, 0.3);
8664
margin-bottom: 0.6rem;
8765
}
8866

@@ -100,24 +78,14 @@ h3 {
10078
}
10179

10280
header {
103-
background: linear-gradient(180deg, #f7f9ff 0%, #e4e9f8 100%);
104-
border-bottom: 1px solid #c6d1e6;
105-
box-shadow:
106-
inset 0 1px 0 rgba(255, 255, 255, 0.8),
107-
0 8px 18px rgba(17, 34, 86, 0.12);
81+
background: var(--bg);
82+
border-bottom: 1px solid var(--edge);
10883
padding: 1.2rem;
10984
position: relative;
11085
overflow: hidden;
11186
}
11287

113-
header::after {
114-
content: '';
115-
position: absolute;
116-
inset: 0;
117-
background: linear-gradient(90deg, rgba(255, 255, 255, 0.35), transparent 70%);
118-
opacity: 0.5;
119-
pointer-events: none;
120-
}
88+
12189

12290
nav {
12391
display: flex;
@@ -129,37 +97,25 @@ nav {
12997
}
13098

13199
nav a {
132-
font-family: 'IBM Plex Sans', 'Tahoma', sans-serif;
100+
font-family: 'Courier New', monospace;
133101
font-weight: 600;
134102
color: var(--accent);
135103
padding: 0.65rem 1.2rem;
136-
background: linear-gradient(180deg, #fdfefe, #eef2fb);
137-
border: 1px solid #c4cee3;
138-
border-radius: 10px;
104+
background: var(--bg);
105+
border: 1px solid var(--edge);
139106
letter-spacing: 0.6px;
140-
box-shadow:
141-
inset 0 1px 0 rgba(255, 255, 255, 0.9),
142-
0 4px 12px rgba(22, 32, 70, 0.14);
143-
transition: transform 0.15s ease, box-shadow 0.2s ease, color 0.2s ease, border-color 0.2s ease;
107+
transition: color 0.2s ease, border-color 0.2s ease;
144108
}
145109

146110
nav a:hover {
147-
color: var(--accent-3);
148-
border-color: var(--accent-2);
149-
transform: translateY(-1px);
150-
box-shadow:
151-
inset 0 1px 0 rgba(255, 255, 255, 1),
152-
0 8px 18px rgba(22, 32, 70, 0.16);
111+
color: var(--accent-2);
112+
border-color: var(--accent);
153113
}
154114

155115
nav a.active {
156-
background: linear-gradient(180deg, #eef2fb, #e1e7f6);
157-
border-color: var(--accent-2);
116+
background: var(--bg-2);
117+
border-color: var(--accent);
158118
color: var(--text);
159-
box-shadow:
160-
inset 0 1px 0 rgba(255, 255, 255, 1),
161-
0 0 0 1px rgba(101, 133, 216, 0.22),
162-
0 10px 22px rgba(22, 32, 70, 0.18);
163119
}
164120

165121
main {
@@ -180,12 +136,8 @@ main {
180136
align-items: center;
181137
gap: 0.75rem;
182138
padding: 0.9rem 1.1rem;
183-
background: linear-gradient(180deg, #f7f9ff, #e9eef9);
184-
border: 1px solid #c6d1e6;
185-
border-radius: 10px;
186-
box-shadow:
187-
inset 0 1px 0 rgba(255, 255, 255, 0.9),
188-
0 8px 18px rgba(17, 34, 86, 0.14);
139+
background: var(--bg);
140+
border: 1px solid var(--edge);
189141
margin-bottom: 1rem;
190142
text-transform: uppercase;
191143
letter-spacing: 0.8px;
@@ -222,10 +174,6 @@ main {
222174
.panel-block {
223175
background: var(--panel);
224176
border: 1px solid var(--edge);
225-
border-radius: var(--radius);
226-
box-shadow:
227-
0 18px 40px rgba(0, 0, 0, 0.55),
228-
0 0 0 1px rgba(255, 255, 255, 0.05);
229177
margin-bottom: 1.4rem;
230178
}
231179

@@ -241,41 +189,22 @@ main {
241189
.profile-content,
242190
.profile-hero,
243191
.panel-block {
244-
background: linear-gradient(180deg, #fdfefe 0%, #eef2fb 100%);
245-
border: 1px solid #c6d1e6;
246-
border-radius: var(--radius);
192+
background: var(--panel);
193+
border: 1px solid var(--edge);
247194
padding: 2rem;
248-
box-shadow:
249-
inset 0 1px 0 rgba(255, 255, 255, 0.9),
250-
0 12px 26px rgba(17, 34, 86, 0.12),
251-
0 0 0 1px rgba(255, 255, 255, 0.5);
252195
position: relative;
253196
overflow: hidden;
254197
}
255198

256-
.panel-block::before,
257-
.dungeon-welcome::before,
258-
.auth-form::before,
259-
.submit-form::before,
260-
.list-form::before,
261-
.profile-content::before,
262-
.profile-hero::before {
263-
content: '';
264-
position: absolute;
265-
inset: 0;
266-
background: linear-gradient(90deg, rgba(255, 255, 255, 0.35), transparent 60%);
267-
pointer-events: none;
268-
}
199+
269200

270201
.dungeon-description,
271202
.dungeon-subtitle {
272203
color: var(--muted);
273-
background: rgba(255, 255, 255, 0.03);
274-
border: 1px solid rgba(255, 255, 255, 0.05);
204+
background: var(--bg-2);
205+
border: 1px solid var(--edge);
275206
padding: 1rem 1.25rem;
276-
border-radius: 12px;
277207
margin: 0.75rem 0 1.25rem;
278-
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
279208
}
280209

281210
.dungeon-link {
@@ -299,35 +228,31 @@ main {
299228
.btn-ghost {
300229
display: inline-block;
301230
padding: 0.85rem 1.6rem;
302-
border-radius: 12px;
303-
font-family: 'Orbitron', 'IBM Plex Sans', sans-serif;
231+
font-family: 'Courier New', monospace;
304232
font-weight: 700;
305233
letter-spacing: 1px;
306234
border: 1px solid var(--edge);
307-
box-shadow: var(--shadow);
308-
transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.25s ease, color 0.2s ease;
235+
transition: background 0.25s ease, color 0.2s ease;
309236
}
310237

311238
.btn-primary {
312-
background: linear-gradient(180deg, #6f8fd8, #3e5fb7);
313-
color: #f8fbff;
239+
background: var(--bg);
240+
color: var(--accent);
314241
}
315242

316243
.btn-primary:hover {
317-
transform: translateY(-2px);
318-
box-shadow: 0 12px 24px rgba(36, 73, 150, 0.25);
244+
background: var(--bg-2);
319245
}
320246

321247
.btn-ghost {
322-
background: linear-gradient(180deg, #fdfefe, #eef2fb);
248+
background: var(--bg);
323249
color: var(--accent);
324-
border-color: #c4cee3;
250+
border-color: var(--edge);
325251
}
326252

327253
.btn-ghost:hover {
328-
background: linear-gradient(180deg, #eef2fb, #e1e7f6);
329-
color: var(--accent-3);
330-
transform: translateY(-2px);
254+
background: var(--bg-2);
255+
color: var(--accent);
331256
}
332257

333258
.auth-form input,
@@ -342,13 +267,12 @@ main {
342267
width: 100%;
343268
padding: 0.95rem 1.05rem;
344269
margin-bottom: 1.15rem;
345-
border-radius: 10px;
346-
border: 1px solid #c4cee3;
347-
background: linear-gradient(180deg, #ffffff, #f3f6fd);
270+
border: 1px solid var(--edge);
271+
background: var(--bg);
348272
color: var(--text);
349273
font-size: 1rem;
350-
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
351-
transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
274+
font-family: 'Courier New', monospace;
275+
transition: border-color 0.2s ease;
352276
}
353277

354278
.auth-form input::placeholder,
@@ -357,7 +281,7 @@ main {
357281
.list-form input::placeholder,
358282
.list-form textarea::placeholder,
359283
.search-filter input::placeholder {
360-
color: rgba(231, 239, 255, 0.5);
284+
color: var(--muted);
361285
}
362286

363287
.auth-form input:focus,
@@ -369,9 +293,7 @@ main {
369293
.search-filter select:focus,
370294
.comment-form input:focus {
371295
outline: none;
372-
border-color: var(--accent-2);
373-
box-shadow: 0 0 0 2px rgba(101, 133, 216, 0.28), inset 0 1px 0 rgba(255, 255, 255, 1);
374-
transform: translateY(-1px);
296+
border-color: var(--accent);
375297
}
376298

377299
.auth-form textarea,

‎dashboard.html‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -3,36 +3,36 @@
33
<head>
44
<meta charset="UTF-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6-
<title>🏰 Guild Chamber - Portal Room</title>
6+
<title>Dashboard - Portal Room</title>
77
<link rel="stylesheet" href="css/style.css">
88
</head>
99
<body>
1010
<header>
1111
<h1>🗝️ Portal Room ⚔️</h1>
1212
<nav>
13-
<a href="dashboard.html" class="active">🏰 Guild Chamber</a>
14-
<a href="submit.html">📮 Contribute Treasure</a>
15-
<a href="profile.html">⚜️ My Lair</a>
16-
<a href="#" id="logout-btn">🚪 Leave Dungeon</a>
13+
<a href="dashboard.html" class="active">Dashboard</a>
14+
<a href="submit.html">Submit Link</a>
15+
<a href="profile.html">Profile</a>
16+
<a href="#" id="logout-btn">Logout</a>
1717
</nav>
1818
</header>
1919

2020
<main class="page-shell">
2121
<div class="section-bar">
22-
<span class="eyebrow">Guild Chamber</span>
23-
<span class="hint">Browse, filter, and trade links in webcore style</span>
22+
<span class="eyebrow">Dashboard</span>
23+
<span class="hint">Browse and filter links</span>
2424
</div>
2525
<div class="dashboard-content">
2626
<div class="search-filter panel-block">
27-
<h3>🔍 Seek Ancient Wisdom</h3>
28-
<input type="search" id="search-input" placeholder="Search through the scrolls and tomes...">
27+
<h3>Search Links</h3>
28+
<input type="search" id="search-input" placeholder="Search links...">
2929
<select id="tag-filter">
3030
<option value="all">All tags</option>
3131
</select>
3232
</div>
3333
<div id="links-container" class="panel-block">
34-
<h2>📚 The Adventurer's Chronicles</h2>
35-
<p class="dungeon-subtitle">Discover the most recent treasures shared by fellow guild members</p>
34+
<h2>Recent Links</h2>
35+
<p class="dungeon-subtitle">Discover the most recent links shared by users</p>
3636
<div id="links-list"></div>
3737
</div>
3838
</div>

0 commit comments

Comments
 (0)