Skip to content

Commit c89ef2f

Browse files
vintaclaude
vinta
and
claude
committed
feat: extract issue numbers into semantic span elements
Splits the issue number prefix (e.g. 'Issue 146') out of h2/h1 headings into a dedicated <span class='item__issue-number'> or <span class='issue__number'> element. Adds corresponding CSS rules to style the number as a small muted label above the heading. Applies to all archive pages, issue pages, and the main index. Co-Authored-By: Claude <[email protected]>
1 parent cfb9794 commit c89ef2f

163 files changed

Lines changed: 472 additions & 301 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎website/archives/1/index.html‎

Lines changed: 20 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,8 @@ <h2>Browse back issues of CodeTengu Weekly 碼天狗週刊.</h2>
133133
<li class="item">
134134
<a href="/issues/146/#start">
135135
<div class="item__body">
136-
<h2 class="item__heading">Issue 146 When in doubt, open an issue on GitHub.</h2>
136+
<span class="item__issue-number">Issue 146</span>
137+
<h2 class="item__heading">When in doubt, open an issue on GitHub.</h2>
137138
<p class="item__title">
138139
本期內容涵蓋 MongoDB, Kubernetes, Google Cloud Platform,
139140
Python, JavaScript, Node.js, Android, HTML
@@ -157,7 +158,8 @@ <h4 class="item__footer">
157158
<li class="item">
158159
<a href="/issues/145/#start">
159160
<div class="item__body">
160-
<h2 class="item__heading">Issue 145 小明最近升職了，他的新職稱是 Senior Over-Engineer</h2>
161+
<span class="item__issue-number">Issue 145</span>
162+
<h2 class="item__heading">小明最近升職了，他的新職稱是 Senior Over-Engineer</h2>
161163
<p class="item__title">
162164
本期內容涵蓋 React Native, Blockchain, JavaScript, GraphQL,
163165
Docker, Load Balancer, Travis CI
@@ -173,7 +175,8 @@ <h4 class="item__footer">
173175
<li class="item">
174176
<a href="/issues/144/#start">
175177
<div class="item__body">
176-
<h2 class="item__heading">Issue 144 軟體工程師的三大美德：懶惰、急躁和傲慢</h2>
178+
<span class="item__issue-number">Issue 144</span>
179+
<h2 class="item__heading">軟體工程師的三大美德：懶惰、急躁和傲慢</h2>
177180
<p class="item__title">
178181
本期內容涵蓋 Swift, Git, Quantum Computing, Kubernetes,
179182
Memcache, DevOps, CI/CD, Go
@@ -189,7 +192,8 @@ <h4 class="item__footer">
189192
<li class="item">
190193
<a href="/issues/143/#start">
191194
<div class="item__body">
192-
<h2 class="item__heading">Issue 143 Roses Are Red. Violets Are Blue. Unexpected &#39;{&#39; on Line 32.</h2>
195+
<span class="item__issue-number">Issue 143</span>
196+
<h2 class="item__heading">Roses Are Red. Violets Are Blue. Unexpected &#39;{&#39; on Line 32.</h2>
193197
<p class="item__title">
194198
本期內容涵蓋 Swift, Machine Learning, iOS, Redis, NLP,
195199
JavaScript, AngularJS, ReactJS, Blockchain
@@ -205,7 +209,8 @@ <h4 class="item__footer">
205209
<li class="item">
206210
<a href="/issues/142/#start">
207211
<div class="item__body">
208-
<h2 class="item__heading">Issue 142 投資虛擬貨幣讓我學會了相當現實的理財觀念</h2>
212+
<span class="item__issue-number">Issue 142</span>
213+
<h2 class="item__heading">投資虛擬貨幣讓我學會了相當現實的理財觀念</h2>
209214
<p class="item__title">
210215
本期內容涵蓋 security, RxJava, Blockchain, Ethereum,
211216
Cryptography, k8s, Cloud native
@@ -229,7 +234,8 @@ <h4 class="item__footer">
229234
<li class="item">
230235
<a href="/issues/141/#start">
231236
<div class="item__body">
232-
<h2 class="item__heading">Issue 141 醫師：「不要用你 Google 到的結果質疑我的醫學知識」；軟體工程師：「不要用你 Google 到的結果質疑我 Google 到的結果」</h2>
237+
<span class="item__issue-number">Issue 141</span>
238+
<h2 class="item__heading">醫師：「不要用你 Google 到的結果質疑我的醫學知識」；軟體工程師：「不要用你 Google 到的結果質疑我 Google 到的結果」</h2>
233239
<p class="item__title">
234240
本期內容涵蓋 CLI tools, Vim, DevOps, Redis, Flutter, CSS
235241
</p>
@@ -244,7 +250,8 @@ <h4 class="item__footer">
244250
<li class="item">
245251
<a href="/issues/140/#start">
246252
<div class="item__body">
247-
<h2 class="item__heading">Issue 140 聽說新來的工程師喜歡玩密室逃脫，但是看他玩了一個下午都還沒離開 Vim 呢</h2>
253+
<span class="item__issue-number">Issue 140</span>
254+
<h2 class="item__heading">聽說新來的工程師喜歡玩密室逃脫，但是看他玩了一個下午都還沒離開 Vim 呢</h2>
248255
<p class="item__title">
249256
本期內容涵蓋 MongoDB, Kubernetes, NGINX, Google Cloud
250257
Platform, MySQL, JavaScript, React.js, CSS, WebAssambly, Go,
@@ -261,7 +268,8 @@ <h4 class="item__footer">
261268
<li class="item">
262269
<a href="/issues/139/#start">
263270
<div class="item__body">
264-
<h2 class="item__heading">Issue 139 他們在 release 的前一天爆炸</h2>
271+
<span class="item__issue-number">Issue 139</span>
272+
<h2 class="item__heading">他們在 release 的前一天爆炸</h2>
265273
<p class="item__title">
266274
本期內容涵蓋 PHP, Design Pattern, DevOps, Terraform
267275
</p>
@@ -276,7 +284,8 @@ <h4 class="item__footer">
276284
<li class="item">
277285
<a href="/issues/138/#start">
278286
<div class="item__body">
279-
<h2 class="item__heading">Issue 138 大家都是透過犯錯在學習，小明常常在複習，小明很棒</h2>
287+
<span class="item__issue-number">Issue 138</span>
288+
<h2 class="item__heading">大家都是透過犯錯在學習，小明常常在複習，小明很棒</h2>
280289
<p class="item__title">
281290
本期內容涵蓋 HLS, iOS, Android, DevOps, Career, Frontend,
282291
Blockchain
@@ -300,7 +309,8 @@ <h4 class="item__footer">
300309
<li class="item">
301310
<a href="/issues/137/#start">
302311
<div class="item__body">
303-
<h2 class="item__heading">Issue 137 為什麼都要半夜工作，莫非越晚越有靈感？不，不是靈感，我靠的是白天無所事事的愧疚感</h2>
312+
<span class="item__issue-number">Issue 137</span>
313+
<h2 class="item__heading">為什麼都要半夜工作，莫非越晚越有靈感？不，不是靈感，我靠的是白天無所事事的愧疚感</h2>
304314
<p class="item__title">
305315
本期內容涵蓋 Blockchain, Machine Learning, Kubernetes, Python,
306316
Git, JavaScript

‎website/archives/10/index.html‎

Lines changed: 20 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,8 @@ <h2>Browse back issues of CodeTengu Weekly 碼天狗週刊.</h2>
133133
<li class="item">
134134
<a href="/issues/56/#start">
135135
<div class="item__body">
136-
<h2 class="item__heading">Issue 56 The best place to hide a dead body is page 2 of Google search results.</h2>
136+
<span class="item__issue-number">Issue 56</span>
137+
<h2 class="item__heading">The best place to hide a dead body is page 2 of Google search results.</h2>
137138
<p class="item__title">
138139
本期內容涵蓋 Go, WebSocket, Android, UI / UX, Python, Git,
139140
JavaScript, GraphQL, Elm, 演算法
@@ -157,7 +158,8 @@ <h4 class="item__footer">
157158
<li class="item">
158159
<a href="/issues/55/#start">
159160
<div class="item__body">
160-
<h2 class="item__heading">Issue 55 Life is what happens to you while you&#39;re busy making other plans.</h2>
161+
<span class="item__issue-number">Issue 55</span>
162+
<h2 class="item__heading">Life is what happens to you while you&#39;re busy making other plans.</h2>
161163
<p class="item__title">
162164
本期內容涵蓋 iOS, Android, Machine Learning, PHP, Elixir, 重構
163165
</p>
@@ -172,7 +174,8 @@ <h4 class="item__footer">
172174
<li class="item">
173175
<a href="/issues/54/#start">
174176
<div class="item__body">
175-
<h2 class="item__heading">Issue 54 歡迎大家來到碼天狗的烘焙雞，（狀態列跑馬燈）最佳觀看解析度為 800x600，建議使用 IE 5.0 以上瀏覽器</h2>
177+
<span class="item__issue-number">Issue 54</span>
178+
<h2 class="item__heading">歡迎大家來到碼天狗的烘焙雞，（狀態列跑馬燈）最佳觀看解析度為 800x600，建議使用 IE 5.0 以上瀏覽器</h2>
176179
<p class="item__title">
177180
本期內容涵蓋 DevOps, Kubernetes, Objective-C, Redux, Design
178181
Patterns, Swift, Go, 管理
@@ -196,7 +199,8 @@ <h4 class="item__footer">
196199
<li class="item">
197200
<a href="/issues/53/#start">
198201
<div class="item__body">
199-
<h2 class="item__heading">Issue 53 要 mock 的物件太多了，只好 mock 罵號</h2>
202+
<span class="item__issue-number">Issue 53</span>
203+
<h2 class="item__heading">要 mock 的物件太多了，只好 mock 罵號</h2>
200204
<p class="item__title">
201205
本期內容涵蓋 JavaScript, React.js, Terminal, CSS, ORM, SQL,
202206
Elm, Go, 性別
@@ -212,7 +216,8 @@ <h4 class="item__footer">
212216
<li class="item">
213217
<a href="/issues/52/#start">
214218
<div class="item__body">
215-
<h2 class="item__heading">Issue 52 一週年！當一個軟體工程師宣稱他已經完成了 90% 的工作，意思是他還需要相同的時間來完成剩下的 10% 的工作</h2>
219+
<span class="item__issue-number">Issue 52</span>
220+
<h2 class="item__heading">一週年！當一個軟體工程師宣稱他已經完成了 90% 的工作，意思是他還需要相同的時間來完成剩下的 10% 的工作</h2>
216221
<p class="item__title">
217222
本期內容涵蓋 Haskell, Scala, ML, Scheme, AWS Lambda, Xcode,
218223
Go, 搜尋, 機器學習, 自然語言處理, 架構
@@ -236,7 +241,8 @@ <h4 class="item__footer">
236241
<li class="item">
237242
<a href="/issues/51/#start">
238243
<div class="item__body">
239-
<h2 class="item__heading">Issue 51 小明以為自己是中產階級</h2>
244+
<span class="item__issue-number">Issue 51</span>
245+
<h2 class="item__heading">小明以為自己是中產階級</h2>
240246
<p class="item__title">
241247
本期內容涵蓋 Python, JavaScript, iOS, Android, Machine
242248
Learning, TensorFlow, 時間管理
@@ -260,7 +266,8 @@ <h4 class="item__footer">
260266
<li class="item">
261267
<a href="/issues/50/#start">
262268
<div class="item__body">
263-
<h2 class="item__heading">Issue 50 Use the --force, Luke</h2>
269+
<span class="item__issue-number">Issue 50</span>
270+
<h2 class="item__heading">Use the --force, Luke</h2>
264271
<p class="item__title">
265272
本期內容涵蓋 Python, Container, HTTPS, Blockchain, Chatbot,
266273
Go, 推薦系統
@@ -284,7 +291,8 @@ <h4 class="item__footer">
284291
<li class="item">
285292
<a href="/issues/49/#start">
286293
<div class="item__body">
287-
<h2 class="item__heading">Issue 49 There are only two hard things in Computer Science: cache invalidation and naming things.</h2>
294+
<span class="item__issue-number">Issue 49</span>
295+
<h2 class="item__heading">There are only two hard things in Computer Science: cache invalidation and naming things.</h2>
288296
<p class="item__title">
289297
本期內容涵蓋 Machine Learning, Data Science, PHP, Erlang,
290298
Elixir, Android, CSS, Elm, JavaScript, 架構
@@ -308,7 +316,8 @@ <h4 class="item__footer">
308316
<li class="item">
309317
<a href="/issues/48/#start">
310318
<div class="item__body">
311-
<h2 class="item__heading">Issue 48 做高級工程師好多年了，沒想到今天忽然就被升職成傳說級工程師</h2>
319+
<span class="item__issue-number">Issue 48</span>
320+
<h2 class="item__heading">做高級工程師好多年了，沒想到今天忽然就被升職成傳說級工程師</h2>
312321
<p class="item__title">
313322
本期內容涵蓋 iOS, Android, JavaScript, CSS, Kotlin, Python
314323
</p>
@@ -331,7 +340,8 @@ <h4 class="item__footer">
331340
<li class="item">
332341
<a href="/issues/47/#start">
333342
<div class="item__body">
334-
<h2 class="item__heading">Issue 47 沒有什麼問題是重開機不能解決的，如果有，那就重灌</h2>
343+
<span class="item__issue-number">Issue 47</span>
344+
<h2 class="item__heading">沒有什麼問題是重開機不能解決的，如果有，那就重灌</h2>
335345
<p class="item__title">
336346
本期內容涵蓋 Python, Debugging, Design Patterns, JavaScript,
337347
ECMAScript 6, Promise, SQL, Android, Java, Code Review, 求職

‎website/archives/11/index.html‎

Lines changed: 20 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,8 @@ <h2>Browse back issues of CodeTengu Weekly 碼天狗週刊.</h2>
133133
<li class="item">
134134
<a href="/issues/46/#start">
135135
<div class="item__body">
136-
<h2 class="item__heading">Issue 46 不能信任那些 Terminal 或編輯器用白底的人</h2>
136+
<span class="item__issue-number">Issue 46</span>
137+
<h2 class="item__heading">不能信任那些 Terminal 或編輯器用白底的人</h2>
137138
<p class="item__title">
138139
本期內容涵蓋 Python, Machine Learning, PHP, Ansible
139140
</p>
@@ -156,7 +157,8 @@ <h4 class="item__footer">
156157
<li class="item">
157158
<a href="/issues/45/#start">
158159
<div class="item__body">
159-
<h2 class="item__heading">Issue 45 我女朋友說她最近需要一些時間跟距離，請問她是不是要算速率？</h2>
160+
<span class="item__issue-number">Issue 45</span>
161+
<h2 class="item__heading">我女朋友說她最近需要一些時間跟距離，請問她是不是要算速率？</h2>
160162
<p class="item__title">
161163
本期內容涵蓋 Career, Swift, Android, Erlang, Elixir, Rails,
162164
Open Source, SQL, Compiler, Go, Memcached
@@ -180,7 +182,8 @@ <h4 class="item__footer">
180182
<li class="item">
181183
<a href="/issues/44/#start">
182184
<div class="item__body">
183-
<h2 class="item__heading">Issue 44 為了不讓 Google 的 AlphaGo 專美於前，微軟也將在近期推出自己的圍棋 AI，名叫 AlphaC#</h2>
185+
<span class="item__issue-number">Issue 44</span>
186+
<h2 class="item__heading">為了不讓 Google 的 AlphaGo 專美於前，微軟也將在近期推出自己的圍棋 AI，名叫 AlphaC#</h2>
184187
<p class="item__title">
185188
本期內容涵蓋 Python, AWS, Lambda, DynamoDB, MySQL, Commit
186189
Message, Go, JavaScript, React, CSS, Node.js, Webpack
@@ -204,7 +207,8 @@ <h4 class="item__footer">
204207
<li class="item">
205208
<a href="/issues/43/#start">
206209
<div class="item__body">
207-
<h2 class="item__heading">Issue 43 Perl 是唯一一門在 RSA 加密前後看起來一樣的語言</h2>
210+
<span class="item__issue-number">Issue 43</span>
211+
<h2 class="item__heading">Perl 是唯一一門在 RSA 加密前後看起來一樣的語言</h2>
208212
<p class="item__title">
209213
本期內容涵蓋 PHP, MySQL, Machine Learning, Docker, GPU,
210214
Ansible, Go, Raspberry Pi
@@ -228,7 +232,8 @@ <h4 class="item__footer">
228232
<li class="item">
229233
<a href="/issues/42/#start">
230234
<div class="item__body">
231-
<h2 class="item__heading">Issue 42 所有人都在說互联网，沒有人在說網際網路了</h2>
235+
<span class="item__issue-number">Issue 42</span>
236+
<h2 class="item__heading">所有人都在說互联网，沒有人在說網際網路了</h2>
232237
<p class="item__title">
233238
本期內容涵蓋 Python, Makefile, Go, Visual Studio Code, Bots,
234239
寫作, 管理
@@ -252,7 +257,8 @@ <h4 class="item__footer">
252257
<li class="item">
253258
<a href="/issues/41/#start">
254259
<div class="item__body">
255-
<h2 class="item__heading">Issue 41 一邊喊著找不到人才，一邊要求租稅優惠，聽到調高基本工資就說不利產業發展、企業恐外移，全台灣最沒有競爭力的就是這些老闆了</h2>
260+
<span class="item__issue-number">Issue 41</span>
261+
<h2 class="item__heading">一邊喊著找不到人才，一邊要求租稅優惠，聽到調高基本工資就說不利產業發展、企業恐外移，全台灣最沒有競爭力的就是這些老闆了</h2>
256262
<p class="item__title">
257263
本期內容涵蓋 SQL, Python, Django, Slack, iOS, Android,
258264
React.js, Elixir, Erlang
@@ -268,7 +274,8 @@ <h4 class="item__footer">
268274
<li class="item">
269275
<a href="/issues/40/#start">
270276
<div class="item__body">
271-
<h2 class="item__heading">Issue 40 // Do not remove this comment or code will break</h2>
277+
<span class="item__issue-number">Issue 40</span>
278+
<h2 class="item__heading">// Do not remove this comment or code will break</h2>
272279
<p class="item__title">
273280
本期內容涵蓋 SQL, Android, JavaScript, Career, 2FA, DC/OS, FRP
274281
</p>
@@ -291,7 +298,8 @@ <h4 class="item__footer">
291298
<li class="item">
292299
<a href="/issues/39/#start">
293300
<div class="item__body">
294-
<h2 class="item__heading">Issue 39 SQL 原教旨主義者每 9.5 個月就會對使用 ORM 的族群發起一次聖戰</h2>
301+
<span class="item__issue-number">Issue 39</span>
302+
<h2 class="item__heading">SQL 原教旨主義者每 9.5 個月就會對使用 ORM 的族群發起一次聖戰</h2>
295303
<p class="item__title">
296304
本期內容涵蓋 Laravel, PHP, CSS, Go, 深度學習, 機器學習
297305
</p>
@@ -314,7 +322,8 @@ <h4 class="item__footer">
314322
<li class="item">
315323
<a href="/issues/38/#start">
316324
<div class="item__body">
317-
<h2 class="item__heading">Issue 38 我一直相信，只要打字速度足夠快，寂寞就追不上我</h2>
325+
<span class="item__issue-number">Issue 38</span>
326+
<h2 class="item__heading">我一直相信，只要打字速度足夠快，寂寞就追不上我</h2>
318327
<p class="item__title">
319328
本期內容涵蓋 Productivity, iOS, Android, Erlang, Elixir,
320329
Python, Community
@@ -338,7 +347,8 @@ <h4 class="item__footer">
338347
<li class="item">
339348
<a href="/issues/37/#start">
340349
<div class="item__body">
341-
<h2 class="item__heading">Issue 37 除錯的難度幾乎是寫程式的兩倍，如果你把程式寫得太精巧，那你多半沒有聰明到可以解決你的程式的錯誤</h2>
350+
<span class="item__issue-number">Issue 37</span>
351+
<h2 class="item__heading">除錯的難度幾乎是寫程式的兩倍，如果你把程式寫得太精巧，那你多半沒有聰明到可以解決你的程式的錯誤</h2>
342352
<p class="item__title">
343353
本期內容涵蓋 C++, Wangle, Elixir, Erlang, Regression Testing,
344354
JavaScript, WebAssembly, TypeScript, npm, iOS, Swift, RxSwift

0 commit comments

Comments
 (0)