mirror of
https://github.com/ClovertaTheTrilobita/SanYeCao-blog.git
synced 2026-04-02 01:54:50 +00:00
update banner and background
update seo header
This commit is contained in:
parent
ec6086e605
commit
f346e64c2d
11 changed files with 44 additions and 15 deletions
1
public/images/banner-black.svg
Normal file
1
public/images/banner-black.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 19 KiB |
|
|
@ -13,15 +13,39 @@ const t = getTranslations(lang);
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<nav class="header-nav">
|
<nav class="header-nav">
|
||||||
<h1>
|
<div class="banner">
|
||||||
<a href="/" data-astro-reload>{t.banner.title}</a>
|
<a
|
||||||
</h1>
|
href={`/${lang}/`}
|
||||||
|
data-astro-reload
|
||||||
|
class="banner-link"
|
||||||
|
aria-label="banner"
|
||||||
|
>
|
||||||
|
<span class="banner-logo"></span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
<Navigation />
|
<Navigation />
|
||||||
</nav>
|
</nav>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.header-nav h1 a {
|
.banner-link {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.banner-logo {
|
||||||
|
display: block;
|
||||||
|
height: 55px; /* 按你的 banner 比例改 */
|
||||||
|
background-color: #1f2328;
|
||||||
|
|
||||||
|
-webkit-mask: url("/images/banner-black.svg") no-repeat left / contain;
|
||||||
|
mask: url("/images/banner-black.svg") no-repeat left / contain;
|
||||||
|
}
|
||||||
|
|
||||||
|
:global(html.dark .banner-logo) {
|
||||||
|
background-color: #e6e6e6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-nav .banner a {
|
||||||
color: inherit;
|
color: inherit;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
display: block;
|
display: block;
|
||||||
|
|
@ -45,13 +69,13 @@ const t = getTranslations(lang);
|
||||||
gap: 1rem;
|
gap: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header-nav h1 {
|
.header-nav .banner {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-style: italic;
|
font-style: italic;
|
||||||
line-height: 1.1;
|
line-height: 1.1;
|
||||||
|
|
||||||
/* 给右上角 ThemeIcon 留空间 */
|
/* 给右上角 ThemeIcon 留空间 */
|
||||||
max-width: calc(100% - 4rem);
|
max-width: calc(100% - 7rem);
|
||||||
|
|
||||||
/* 桌面正常,手机自动缩小 */
|
/* 桌面正常,手机自动缩小 */
|
||||||
font-size: clamp(1.6rem, 6vw, 2.5rem);
|
font-size: clamp(1.6rem, 6vw, 2.5rem);
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
export default {
|
export default {
|
||||||
banner: {
|
banner: {
|
||||||
title: "Cloverta's Blog",
|
title: "Cloverta's Blog",
|
||||||
subtitle: ""
|
subtitle: "More to explore here (kinda) — welcome to Cloverta's blog 🥳"
|
||||||
},
|
},
|
||||||
nav: {
|
nav: {
|
||||||
home: "Home",
|
home: "Home",
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
export default {
|
export default {
|
||||||
banner: {
|
banner: {
|
||||||
title: "Cloverta的博客",
|
title: "Cloverta的博客",
|
||||||
subtitle: ""
|
subtitle: "在这里,发现更多(雾)欢迎来到三叶的博客🥳"
|
||||||
},
|
},
|
||||||
nav: {
|
nav: {
|
||||||
home: "首页",
|
home: "首页",
|
||||||
|
|
|
||||||
|
|
@ -9,7 +9,7 @@ const t = getTranslations(lang);
|
||||||
---
|
---
|
||||||
|
|
||||||
<BaseLayout
|
<BaseLayout
|
||||||
pageTitle={frontmatter.title}
|
pageTitle=`${frontmatter.title} - ${t.banner.title}`
|
||||||
description={frontmatter.description}
|
description={frontmatter.description}
|
||||||
image={frontmatter.image?.url}
|
image={frontmatter.image?.url}
|
||||||
>
|
>
|
||||||
|
|
|
||||||
|
|
@ -13,7 +13,7 @@ const pageTitle = t.about.title;
|
||||||
---
|
---
|
||||||
|
|
||||||
<BaseLayout
|
<BaseLayout
|
||||||
pageTitle={pageTitle}
|
pageTitle=`${pageTitle} - ${t.banner.title}`
|
||||||
image={t.about.profilePicture}
|
image={t.about.profilePicture}
|
||||||
>
|
>
|
||||||
<main class="about">
|
<main class="about">
|
||||||
|
|
|
||||||
|
|
@ -13,6 +13,6 @@ const t = getTranslations(lang);
|
||||||
const headerTitle = lang === "zh" ? "友情链接" : "Friends";
|
const headerTitle = lang === "zh" ? "友情链接" : "Friends";
|
||||||
---
|
---
|
||||||
|
|
||||||
<BaseLayout pageTitle={headerTitle}>
|
<BaseLayout pageTitle=`${headerTitle} - ${t.banner.title}`>
|
||||||
<FriendlyLinkList />
|
<FriendlyLinkList />
|
||||||
</BaseLayout>
|
</BaseLayout>
|
||||||
|
|
|
||||||
|
|
@ -15,7 +15,7 @@ const headerTitle = lang === "zh" ? "Cloverta的博客" : "Cloverta's blog";
|
||||||
const pageTitle = t.home.title;
|
const pageTitle = t.home.title;
|
||||||
---
|
---
|
||||||
|
|
||||||
<BaseLayout pageTitle={headerTitle}>
|
<BaseLayout pageTitle=`${headerTitle} - ${t.banner.subtitle}`>
|
||||||
<h1 class="page-title">
|
<h1 class="page-title">
|
||||||
<span>{pageTitle}</span>
|
<span>{pageTitle}</span>
|
||||||
<a
|
<a
|
||||||
|
|
|
||||||
|
|
@ -15,7 +15,7 @@ const tags = [...new Set(allPosts.map((post: any) => post.data.tags).flat())];
|
||||||
const pageTitle = lang === "zh" ? "标签索引" : "Tag Index";
|
const pageTitle = lang === "zh" ? "标签索引" : "Tag Index";
|
||||||
---
|
---
|
||||||
|
|
||||||
<BaseLayout pageTitle={pageTitle}>
|
<BaseLayout pageTitle=`${pageTitle} - ${t.banner.title}` `>
|
||||||
<h1>{t.tags.title}</h1>
|
<h1>{t.tags.title}</h1>
|
||||||
<p>{t.tags.description}</p>
|
<p>{t.tags.description}</p>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -13,7 +13,7 @@ const t = getTranslations(lang);
|
||||||
const headerTitle = lang === "zh" ? "时间轴" : "Timeline";
|
const headerTitle = lang === "zh" ? "时间轴" : "Timeline";
|
||||||
---
|
---
|
||||||
|
|
||||||
<BaseLayout pageTitle={headerTitle}>
|
<BaseLayout pageTitle=`${headerTitle} - ${t.banner.title}` `>
|
||||||
<h1>{t.nav.timeline}</h1>
|
<h1>{t.nav.timeline}</h1>
|
||||||
<PostTimeline />
|
<PostTimeline />
|
||||||
</BaseLayout>
|
</BaseLayout>
|
||||||
|
|
|
||||||
|
|
@ -129,6 +129,10 @@ body::after {
|
||||||
z-index: -1;
|
z-index: -1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
html.dark body::after {
|
||||||
|
background-image: url("https://files.seeusercontent.com/2026/03/28/nd1W/pasted-image-1774730083896.webp");
|
||||||
|
}
|
||||||
|
|
||||||
* {
|
* {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
@ -141,7 +145,7 @@ h1 {
|
||||||
|
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: #7fb3ff;
|
color: #416bd6;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue