The First On-Chain and Open-Source Blogging platform.

Dark mode, Search, Useful post components & More - xLog Weekly Summary #14

Fresh out the oven 🔥

This has been the busiest week ever for our community developers, who have been crazily submitting pull requests to xLog.

Dark mode



Dark mode is an incredible project, a "dark miracle" brought to life by the collaborative efforts of our talented community developers.

Dark mode is automatically switched on based on your system preferences, but there's also a manual switch button at the bottom of the page.

We'd like to remind you to turn on the lights while using electronic devices at night to protect your eyes.

Credit @innei-4525 @suemor @daidr @365cent

Code changes: #312 #331 #332 #333 #335 #340 #341 #353

Mention Syntax


To help bloggers easily mention each other and foster a greater sense of community within xLog, we've introduced a simple mention syntax. Just use the '@' symbol followed by the handle (which is also the subdomain) of the user you want to mention. We'll soon add mention notifications to the notification system.

Code changes: 9e2db05

APlayer component

光るなら - Goose house

雨上がりの虹も (雨过天晴的彩虹)

凛と咲いた花も (凛然绽放的花朵)

色づき溢れ出す (色彩随之满溢缤纷)

茜色の空 仰ぐ君に (望着那个仰望绯红色天空的你)

あの日 恋に落ちた (就在那天 我坠入了爱河)

瞬間のドラマチック (戏剧化的那一瞬间)

フィルムの中の1コマも (如荧幕中的特写镜头)

消えないよ 心に刻むから (早已深深铭刻在我心中 永远不会消失)

君だよ 君なんだよ 教えてくれた (是你 是你 告诉我)

暗闇も光るなら (若能在黑暗中绽放光芒)

星空になる (便能化作星空)

悲しみを笑顔に (悲伤化作笑颜)

もう隠さないで (已经无需隐藏)

煌めくどんな星も (漫天闪耀着的星光)

君を照らすから (都会为你照亮前行)

眠りも忘れて 迎えた朝日が (一夜未眠迎来的朝阳)

やたらと突き刺さる (却愈加刺痛我心)

低気圧運ぶ 頭痛だって (令人烦闷的头痛)

忘れる 君に会えば (只要见到你 便能瞬间遗忘)

静寂はロマンティック (静寂编制你我的罗曼史)

紅茶に溶けたシュガーのように (如红茶里融化的砂糖)

全身に巡るよ 君の声 (你的声音萦绕全身)

君だよ 君なんだよ (是你 是你)

笑顔をくれた (带给我笑容)

涙も光るなら (泪滴若能绽放光芒)

流星になる (便能化作流星)

傷付いたその手を (这伤痕累累的双手)

もう離さないで (请别再松开)

願いを込めた空に (寄托心愿的天空)

明日が来るから (明天一定会来到)

導いてくれた 光は 君だよ (指引着我前进的光芒 就是你啊)

つられて僕も 走り出した (我也不禁迈步奔向前方)

知らぬ間に クロスし始めた (不知不觉间 我们交织在一起)

ほら 今だ ここで 光るなら (看 就是现在 若此处有光芒)

君だよ 君なんだよ 教えてくれた (是你 是你 告诉我)

暗闇は終わるから (黑暗终究会过去)

君だよ 君なんだよ 教えてくれた (是你 是你 告诉我)

暗闇も光るなら (若能在黑暗中绽放光芒)

星空になる (便能化作星空)

悲しみを笑顔に (悲伤化作笑颜)

もう隠さないで (已经无需隐藏)

煌めくどんな星も (漫天闪耀着的星光)

君を照らすから (都会为你照亮前行)

答えはいつでも偶然?必然? (答案是 偶然?必然?)

いつか選んだ道こそ (你曾经选择的路)

運命になる (才是真正的命运)

握りしめた その希望も不安も (紧握在手心的希望也好 不安也罢)

きっと2人を動かす 光になるから (必定会化作驱使我们前进的光芒)

--:-- / --:--
<audio src="ipfs://bafybeihjiyr5r6zawpartvqbaqkfbeyyehvz5sk6cvpd7g6ir7cz73yz5q" name="光るなら" artist="Goose house" cover="ipfs://bafkreia4ytkhiqbdxt7kh2x5brhihuuql3vcr6nbrqco2hacgkrahfj4vq" lrc="[00:15.440]雨上がりの虹も (雨过天晴的彩虹)" loop><audio>

APlayer is a highly acclaimed web audio player, and we're thrilled that our community developers have integrated it into xLog. Now, simply drag and drop audio files directly into the editor, which will read and automatically fill in the file's cover, song name, artist, and other information before uploading it to IPFS.

Supported properties:

  • src
  • name
  • artist
  • cover
  • lrc
  • muted
  • autoplay
  • loop

Credit @steveyu @doma-6565

Code changes: #349 0886273

Mermaid component

    participant Alice
    participant Bob
    Alice->>John: Hello John, how are you?
    loop Healthcheck
        John->>John: Fight against hypochondria
    Note right of John: Rational thoughts <br/>prevail!
    John-->>Alice: Great!
    John->>Bob: How about you?
    Bob-->>John: Jolly good!
Mermaid Loading...

Mermaid is a JavaScript-based diagramming and charting tool that renders Markdown-inspired text definitions to create and modify diagrams dynamically. Our community developers have integrated this fantastic tool into xLog.

Diagram Syntax: https://mermaid.js.org/

Credit @innei-4525

Code changes: #309



We've added search functionality across the entire platform and within individual sites, making it easy for readers to quickly find content that interests them. Access the search feature in the top-right corner of the activity page and on each site.

Code changes: ccf4bdc 46fac4d

Mobile app

We are currently developing a mobile app using React Native, which is, of course, entirely open-source. You can find its GitHub repository here: https://github.com/Crossbell-Box/xLog-mobile

The app is still in its early stages of development, so there isn't much to share at the moment. However, rest assured that it'll be available for download soon. Stay tuned to my GitHub for updates!

Additional Updates

  • Image zoom, credit @innei-4525 #355 a6519df
  • Share to Twitter menu item, credit @innei-4525 #342
  • Three more editor shortcuts, credit @daidr #338
  • Multiple performance optimizations, credit @daidr #358
  • Optimize print mode, credit @innei-4525 #354
  • Add site link to connect button dropdown d0493b5
  • Fix Firefox editor cursor issue, credit @daidr #348

👏 Give a warm round of applause to our community developers, xLog is the result of everyone's joint efforts.

Stay Connected with xLog

If you have any suggestions or expectations, or just want to have a casual conversation, feel free to join our community or leave a comment below. Cheers! 🍻

Loading Comment