Skip to content

Commit 65d2c9d

Browse files
pepc84pepc84
committed
Add standalone What's New page, update nav to link to it
1 parent 92afbff commit 65d2c9d

3 files changed

Lines changed: 319 additions & 98 deletions

File tree

‎assets/nav.js‎

Lines changed: 5 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,7 @@
55
const isRoot = parts.length === 0 || (parts.length === 1 && parts[0] === 'index.html');
66
const prefix = isRoot ? '/' : '../';
77

8-
function isActive(name) {
9-
if (name === 'libraries#whats-new') return false;
10-
return path.includes('/' + name);
11-
}
8+
function isActive(name) { return path.includes('/' + name); }
129

1310
function link(href, label, style) {
1411
const active = isActive(href) ? ' class="active"' : '';
@@ -36,7 +33,7 @@
3633
const sidebar = document.getElementById('site-sidebar') || document.querySelector('.sidebar');
3734
if (sidebar) {
3835
sidebar.innerHTML = `
39-
${link('libraries#whats-new', "What's New", 'color:#e8b400;font-weight:700;')}
36+
${link('whats-new', "What's New", 'color:#e8b400;font-weight:700;')}
4037
<div style="height:1px;background:#e0e0e0;margin:0.5rem 0;"></div>
4138
${link('libraries', 'Libraries')}
4239
${link('reference', 'Reference')}
@@ -61,29 +58,12 @@
6158
background: #fff;
6259
z-index: 100;
6360
}
64-
.nav-logo {
65-
display: flex;
66-
align-items: center;
67-
gap: 10px;
68-
text-decoration: none;
69-
}
61+
.nav-logo { display: flex; align-items: center; gap: 10px; text-decoration: none; }
7062
.nav-logo img { width: 28px; height: 28px; }
71-
.nav-title {
72-
display: flex;
73-
flex-direction: column;
74-
line-height: 1.15;
75-
}
63+
.nav-title { display: flex; flex-direction: column; line-height: 1.15; }
7664
.nav-title-top { font-size: 13px; font-weight: 700; color: #e8b400; }
7765
.nav-title-bottom { font-size: 13px; font-weight: 700; color: #e8b400; }
78-
.hamburger {
79-
background: none;
80-
border: none;
81-
cursor: pointer;
82-
font-size: 22px;
83-
padding: 4px 8px;
84-
display: none;
85-
margin-left: 0.5rem;
86-
}
66+
.hamburger { background: none; border: none; cursor: pointer; font-size: 22px; padding: 4px 8px; display: none; margin-left: 0.5rem; }
8767
@media (max-width: 768px) { .hamburger { display: block; } }
8868
`;
8969
document.head.appendChild(style);

‎libraries/index.html‎

Lines changed: 113 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -38,80 +38,120 @@
3838
.content { padding: 2rem 1.25rem; }
3939
}
4040

41-
.whats-new {
42-
border: 1px solid #e0e0e0;
43-
border-radius: 10px;
44-
margin-bottom: 3rem;
45-
overflow: hidden;
46-
}
47-
.wn-header {
48-
background: #f8f8f8;
49-
border-bottom: 1px solid #e0e0e0;
50-
padding: 1.5rem 2rem;
51-
}
52-
.wn-badge {
53-
display: inline-block;
54-
background: #e8b400;
55-
color: #fff;
56-
font-size: 11px;
57-
font-weight: 700;
58-
letter-spacing: 0.08em;
59-
padding: 2px 8px;
60-
border-radius: 4px;
61-
margin-bottom: 0.5rem;
62-
text-transform: uppercase;
63-
}
64-
.wn-header h2 {
65-
font-size: 1.3rem;
66-
font-weight: 700;
67-
margin-bottom: 0.25rem;
68-
color: #111;
69-
}
70-
.wn-sub { font-size: 0.9rem; color: #888; }
71-
.wn-grid {
72-
display: grid;
73-
grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
74-
gap: 0;
75-
}
76-
.wn-card {
77-
padding: 1.5rem 2rem;
78-
border-right: 1px solid #e0e0e0;
79-
border-bottom: 1px solid #e0e0e0;
80-
}
81-
.wn-card:nth-child(even) { border-right: none; }
82-
.wn-card-title {
83-
font-size: 14px;
84-
font-weight: 700;
85-
margin-bottom: 0.75rem;
86-
color: #111;
87-
}
88-
.wn-card-body {
89-
font-size: 13px;
90-
color: #555;
91-
line-height: 1.7;
92-
}
93-
.wn-card-body code {
94-
font-family: "SF Mono","Fira Code",monospace;
95-
background: #f4f4f4;
96-
padding: 1px 5px;
97-
border-radius: 3px;
98-
font-size: 12px;
99-
color: #111;
100-
}
101-
.wn-card-body pre {
102-
background: #0d0d0d;
103-
color: #ccc;
104-
font-family: "SF Mono","Fira Code",monospace;
105-
font-size: 12px;
106-
line-height: 1.6;
107-
padding: 0.75rem 1rem;
108-
border-radius: 6px;
109-
margin-top: 0.75rem;
110-
overflow-x: auto;
111-
white-space: pre;
112-
}
41+
42+
43+
44+
45+
.wn-tag {
46+
display: inline-block;
47+
font-size: 10px;
48+
font-weight: 700;
49+
letter-spacing: 0.06em;
50+
text-transform: uppercase;
51+
padding: 1px 6px;
52+
border-radius: 3px;
53+
margin-bottom: 0.5rem;
54+
}
55+
.wn-tag.changed { background: #fff3cd; color: #856404; }
56+
.wn-tag.new { background: #d1e7dd; color: #0f5132; }
57+
.wn-tag.removed { background: #f8d7da; color: #842029; }
58+
59+
60+
.whats-new {
61+
border: 1px solid #e0e0e0;
62+
border-radius: 10px;
63+
margin-bottom: 3rem;
64+
overflow: hidden;
65+
}
66+
.wn-header {
67+
background: #f8f8f8;
68+
border-bottom: 1px solid #e0e0e0;
69+
padding: 2rem 2rem 1.5rem;
70+
}
71+
.wn-badge {
72+
display: inline-block;
73+
background: #e8b400;
74+
color: #fff;
75+
font-size: 11px;
76+
font-weight: 700;
77+
letter-spacing: 0.08em;
78+
padding: 2px 8px;
79+
border-radius: 4px;
80+
margin-bottom: 0.75rem;
81+
text-transform: uppercase;
82+
}
83+
.wn-header h2 {
84+
font-size: 1.4rem;
85+
font-weight: 700;
86+
margin-bottom: 0.75rem;
87+
color: #111;
88+
}
89+
.wn-prelude {
90+
font-size: 0.95rem;
91+
color: #555;
92+
line-height: 1.8;
93+
max-width: 680px;
94+
}
95+
.wn-prelude strong { color: #111; }
96+
.wn-grid {
97+
display: grid;
98+
grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
99+
}
100+
.wn-card {
101+
padding: 1.75rem 2rem;
102+
border-right: 1px solid #e0e0e0;
103+
border-bottom: 1px solid #e0e0e0;
104+
}
105+
.wn-card:nth-child(even) { border-right: none; }
106+
.wn-card-title {
107+
font-size: 13px;
108+
font-weight: 700;
109+
margin-bottom: 0.75rem;
110+
color: #111;
111+
text-transform: uppercase;
112+
letter-spacing: 0.04em;
113+
}
114+
.wn-card-body {
115+
font-size: 13px;
116+
color: #555;
117+
line-height: 1.75;
118+
}
119+
.wn-card-body p { margin-bottom: 0.75rem; }
120+
.wn-card-body code {
121+
font-family: "SF Mono","Fira Code",monospace;
122+
background: #f4f4f4;
123+
padding: 1px 5px;
124+
border-radius: 3px;
125+
font-size: 12px;
126+
color: #111;
127+
}
128+
.wn-card-body pre {
129+
background: #0d0d0d;
130+
color: #ccc;
131+
font-family: "SF Mono","Fira Code",monospace;
132+
font-size: 12px;
133+
line-height: 1.6;
134+
padding: 0.75rem 1rem;
135+
border-radius: 6px;
136+
margin-top: 0.75rem;
137+
overflow-x: auto;
138+
white-space: pre;
139+
}
140+
.wn-tag {
141+
display: inline-block;
142+
font-size: 10px;
143+
font-weight: 700;
144+
letter-spacing: 0.06em;
145+
text-transform: uppercase;
146+
padding: 1px 6px;
147+
border-radius: 3px;
148+
margin-bottom: 0.5rem;
149+
}
150+
.wn-tag.changed { background: #fff3cd; color: #856404; }
151+
.wn-tag.new { background: #d1e7dd; color: #0f5132; }
152+
.wn-tag.removed { background: #f8d7da; color: #842029; }
113153

114-
</style>
154+
</style>
115155
</head>
116156
<body>
117157
<nav id="site-nav"></nav>

0 commit comments

Comments
 (0)