From 0ecef21d36abda707d22369d711bbab42dde9790 Mon Sep 17 00:00:00 2001 From: Eltrac Date: Wed, 27 Nov 2024 15:28:12 +0800 Subject: feat: new links page --- content/links/index.md | 31 +++++-------- themes/yinyang/assets/css/index.css | 60 +++++++++++++++++++++++++ themes/yinyang/layouts/shortcodes/bloglink.html | 11 +++++ 3 files changed, 83 insertions(+), 19 deletions(-) create mode 100644 themes/yinyang/layouts/shortcodes/bloglink.html diff --git a/content/links/index.md b/content/links/index.md index 6c12cccd..612060bb 100644 --- a/content/links/index.md +++ b/content/links/index.md @@ -4,25 +4,18 @@ updated: 2024-08-24T09:31 title: 链接 --- -## 常看的博客 - -- [白洛嘉](https://brocalife.com/) - - 认识了大概五年的网友 -- [莫比乌斯 – 写作，一场自我悖驳的旅程](https://onojyun.com/) - - 引发思考的文字 -- [Velas电波站 · 非正常信号发射与搜寻装置](https://www.velasx.com/) - - 喜欢 Zeee 的文字风格 -- [云游君的小站](https://www.yunyoujun.cn/) - - 技术力和创意都很让人佩服的大佬 -- [LCZBlog](https://blog.licaoz.com/) - - 和我同一个中学毕业的学弟，很奇妙的相识 -- [Bottle小站](https://bottle.moe/) -- [Sukka's Blog](https://blog.skk.moe/) -- [白熊阿丸的小屋](https://blog.bxaw.name/) -- [dyron503's](https://career.dyron503.top/) -- [一派胡言](https://yipai.me/) - -…… +
+ {{< bloglink link="https://www.velasx.com/" title="Velas电波站" description="喜欢 Zeee 的文字风格" image="https://image.guhub.cn/picgo/velas-icon" >}} + {{< bloglink link="https://onojyun.com/" title="莫比乌斯" description="引发思考的文字" image="https://image.guhub.cn/picgo/ono-icon" >}} + {{< bloglink link="https://brocalife.com/" title="白洛嘉" description="认识了大概五年的网友" image="https://image.guhub.cn/picgo/broca-icon" >}} + {{< bloglink link="https://blog.bxaw.name/" title="白熊阿丸的小屋" description="真实的文字" image="https://cravatar.cn/avatar/21531185e8296f70da566b68d3fc9785" >}} + {{< bloglink link="https://rolen.wiki/" title="Rolen" description="有深度的文字" image="https://rolen.wiki/wp-content/uploads/2024/09/cropped-rolen-logo-black-2-180x180.png" >}} + {{< bloglink link="https://career.dyron503.top/" title="dyron503's" description="有关电子游戏的文字" >}} + {{< bloglink link="https://yipai.me" title="一派胡言" description="禁止纵容的文字" >}} + {{< bloglink link="https://blog.licaoz.com/" title="LCZBlog" description="和我同一个中学的学弟" image="https://image.guhub.cn/picgo/licaoz-icon" >}} + {{< bloglink link="https://blog.skk.moe/" title="Sukka's Blog" image="https://cdn.skk.moe/avatar/96x96.png" >}} + {{< bloglink link="https://www.yunyoujun.cn/" title="云游君的小站" description="技术力和创意都很让人佩服的大佬" image="https://www.yunyoujun.cn/images/avatar.jpg" >}} +
> 网站不交换友情链接，我会在 [链接](./links) 页面放上自己喜欢的、常看的博客和网站。如果你在网站下留言，而我恰巧喜欢你的内容，我会在这个页面上放上你网站的链接；当然，至于你是否也在贵站加上「极客死亡计划」的链接，这与我无关。 > diff --git a/themes/yinyang/assets/css/index.css b/themes/yinyang/assets/css/index.css index 2f2aa8bf..8db19108 100644 --- a/themes/yinyang/assets/css/index.css +++ b/themes/yinyang/assets/css/index.css @@ -502,3 +502,63 @@ a:hover { margin: 3rem 1rem; } } + +/* blog links */ + +div.blog-links { + display: flex; + flex-wrap: wrap; + gap: 1rem; +} + +a.blog-link { + position: relative; + background-color: var(--block-background-color); + text-decoration: none; + color: var(--text-color); + padding: 1rem 2rem; + padding-right: 4rem; + border-radius: 1rem; + width: calc(50% - 2rem); + box-sizing: border-box; + overflow: hidden +} + +@media screen and (max-width: 768px) { + a.blog-link { + font-size: 1.2rem; + padding: 0.5rem 1rem; + padding-right: 2rem; + width: 100%; + } +} + +a.blog-link h4, +a.blog-link p { + margin: 0; + font-size: 1.2rem; +} + +a.blog-link p { + line-height: 1.5; +} + +a.blog-link .blog-link-content { + z-index: 10; +} + +a.blog-link-image { + z-index: 0; +} + +a.blog-link img { + --size: 5rem; + display: block; + position: absolute; + right: -1rem; + bottom: -1rem; + width: var(--size); + height: var(--size); + border-radius: 100%; + z-index: 0; +} \ No newline at end of file diff --git a/themes/yinyang/layouts/shortcodes/bloglink.html b/themes/yinyang/layouts/shortcodes/bloglink.html new file mode 100644 index 00000000..4cdec219 --- /dev/null +++ b/themes/yinyang/layouts/shortcodes/bloglink.html @@ -0,0 +1,11 @@ + + {{ if and (isset .Params "image") .Params.image }} +
+ {{ .Params.title }} +
+ {{ end }} +
+

{{.Get "title" }}

+

{{.Get "description" }}

+
+ \ No newline at end of file -- cgit v1.2.3