GNOME 2.20 but its Web Components
GNOME 2.20 but its Web Components
A couple of days ago, this youtube video rolled into my recommendations feed. It’s an essay by this youtuber called onion boots on how websites used to be weird and playful. And I got to thinking about how I missed that old timey tinkerer’s network. 几天前,YouTube 向我推荐了一个视频。这是 YouTuber “onion boots” 制作的一篇随笔,讲述了过去的网站是如何充满奇思妙想和趣味性的。这让我不禁怀念起那个属于“修补匠”的旧时代网络。
Then I thought at my website, and how it looks like… a website, and decided it wasn’t weird enough. Well, its a few days later and I’ve turned my website into the GNOME 2 desktop circa 2002. 随后我审视了自己的网站,发现它看起来……太像个“正经网站”了,于是我决定让它变得更“怪”一点。几天过去了,我已经把我的网站改造成了 2002 年左右的 GNOME 2 桌面。
It’s built out of web components, using Lit. Specifically I used lit-ssr to generate DSD templates, and the newly baseline View Transitions API to make “focusing” (navigating) between “windows” (pages) feel more fluid and natural. 它完全由 Web Components 构建,并使用了 Lit 框架。具体来说,我利用 lit-ssr 生成 DSD(Declarative Shadow DOM)模板,并使用了刚成为基准标准的 View Transitions API,让“窗口”(页面)之间的“聚焦”(导航)切换感觉更加流畅自然。
I’m going for a classic feel here, so I designed the webmentions (which used to appear in a sidebar or under the post) UI to look like a Pidgin IM session, and the slide decks page looks (kinda) like OOO Impress. 为了营造复古感,我将 Webmentions(通常出现在侧边栏或文章下方)的 UI 设计成了 Pidgin 即时通讯软件的会话窗口,而幻灯片页面看起来则(有点)像 OpenOffice Impress。
It’s got two themes. Clearlooks is based on the original CSS, and Clearlooks dark is “inspired” thereby. Maybe I’ll add more themes down the line if I’m feeling up to it. 网站目前有两种主题:Clearlooks 基于原始 CSS 构建,而 Clearlooks Dark 则是受其“启发”而作。如果以后有兴致的话,我或许会添加更多主题。
I also shipped the default GNOME desktop wallpapers, so pick whichever one you like best. It’s even got Minesweeper, and calculator! 我还内置了 GNOME 默认的桌面壁纸,你可以挑选自己最喜欢的一款。甚至连扫雷和计算器都有!
So yeah this is pretty silly but I’m also committed to the bit 🤣. Which app should I implement next? Send me a webmention to this page. 总之,这确实挺无厘头的,但我会坚持把这个“梗”玩下去 🤣。下一个我该实现什么应用呢?欢迎通过 Webmention 发送建议到这个页面。