From 459eea9491cf20a57c6e23392ce20b6dc21f72ac Mon Sep 17 00:00:00 2001
From: AsyncX <1158271328@qq.com>
Date: Tue, 27 Feb 2024 11:10:47 +0800
Subject: [PATCH] really done!
---
src/components/BaseHead.astro | 4 +-
src/components/Pin.astro | 111 +++++++++++++++---------------
src/pages/[lang]/blog/index.astro | 18 ++---
src/styles/global.css | 26 ++++---
4 files changed, 79 insertions(+), 80 deletions(-)
diff --git a/src/components/BaseHead.astro b/src/components/BaseHead.astro
index a993638..225661e 100755
--- a/src/components/BaseHead.astro
+++ b/src/components/BaseHead.astro
@@ -50,14 +50,14 @@ const alternateLinks = alternateLang.map((_lang: UiType) => {
- main {
- width: 960px;
- }
- ul {
- /* display: flex; */
- flex-wrap: wrap;
- gap: 2rem;
- list-style-type: none;
- margin: 0;
- padding: 0;
- }
- ul li {
- margin-top: 1rem;
- }
- ul li * {
-
- text-decoration: none;
- transition: 0.2s ease;
- }
-
- ul li img {
- margin-bottom: 0.5rem;
- border-radius: 12px;
- }
- ul li a {
- display: flex;
- }
-
- ul li h5{
- text-align: center;
- }
- .title {
- margin: 0;
- line-height: 1;
- }
- .date {
- flex-wrap: wrap;
- padding-right: 2rem;
- margin: 0;
- color: rgb(var(--gray));
- }
-
- /* 标题变色: */
- ul li a:hover h5,
- ul li a:hover .date {
- color: rgb(var(--accent));
- }
- ul a:hover img {
- box-shadow: var(--box-shadow);
- }
- @media (max-width: 700px) {
- .date {
- min-width: auto;
- }
+ main {
+ width: 960px;
+ }
+ ul {
+ /* display: flex; */
+ flex-wrap: wrap;
+ gap: 2rem;
+ list-style-type: none;
+ margin: 0;
+ padding: 0;
+ }
+ ul li {
+ margin-top: 1rem;
+ }
+ ul li * {
+
+ text-decoration: none;
+ transition: 0.2s ease;
+ }
+
+ ul li img {
+ margin-bottom: 0.5rem;
+ border-radius: 12px;
+ }
+ ul li a {
+ display: flex;
+ }
+
+ ul li h5{
+ text-align: center;
+ }
+ .title {
+ margin: 0;
+ line-height: 1;
+ }
+ .date {
+ min-width: 110px;
+ padding-right: 2rem;
+ margin: 0;
+ color: rgb(var(--gray));
+ }
+
+ /* 标题变色: */
+ ul li a:hover h5,
+ ul li a:hover .date {
+ color: rgb(var(--accent));
+ }
+ ul a:hover img {
+ box-shadow: var(--box-shadow);
+ }
+ @media (max-width: 720px) {
ul {
gap: 0.5em;
}
- ul li a{
- /* display:inherit; */
+ ul li {
+ display:inherit;
width: 100%;
/* text-align: center; */
}
}
-
+
diff --git a/src/pages/[lang]/blog/index.astro b/src/pages/[lang]/blog/index.astro
index 0195702..c3ecdd4 100755
--- a/src/pages/[lang]/blog/index.astro
+++ b/src/pages/[lang]/blog/index.astro
@@ -43,7 +43,7 @@ export async function getStaticPaths() {
text-decoration: none;
transition: 0.2s ease;
}
-
+
ul li img {
margin-bottom: 0.5rem;
border-radius: 12px;
@@ -51,7 +51,7 @@ export async function getStaticPaths() {
ul li a {
display: flex;
}
-
+
ul li h5{
text-align: center;
}
@@ -60,11 +60,12 @@ export async function getStaticPaths() {
line-height: 1;
}
.date {
+ min-width: 110px;
padding-right: 2rem;
margin: 0;
color: rgb(var(--gray));
}
-
+
/* 标题变色: */
ul li a:hover h5,
ul li a:hover .date {
@@ -78,16 +79,11 @@ export async function getStaticPaths() {
gap: 0.5em;
}
ul li {
-
+ display:inherit;
width: 100%;
- text-align: center;
- }
- /* ul li:first-child {
- margin-bottom: 0;
+ /* text-align: center; */
}
- ul li:first-child .title {
- font-size: 1.563em;
- } */
+
}
diff --git a/src/styles/global.css b/src/styles/global.css
index ccddc27..b1551bc 100755
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -9,7 +9,7 @@
system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
'Helvetica Neue', Helvetica, Arial, 'Noto Sans', sans-serif,
'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
- --font-family-mono: 'Atkinson',ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Monaco,
+ --font-family-mono: 'zpix',ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Monaco,
Consolas, 'Liberation Mono', 'Courier New', monospace;
--bgc-light: #333338;
--bgc: #282a35;
@@ -30,20 +30,20 @@
@font-face {
font-family: 'Atkinson';
- src: url('/fonts/zpix.woff2') format('woff');
+ src: url('/fonts/VonwaonBitmap-16px.woff2') format('woff');
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
- font-family: 'Atkinson';
+ font-family: 'zpix';
src: url('/fonts/zpix.woff2') format('woff');
font-weight: 700;
font-style: normal;
font-display: swap;
}
body {
- font-family: var(--font-family-mono);
+ font-family: var(--font-family-base);
margin: 0;
padding: 0;
text-align: left;
@@ -71,19 +71,19 @@ h6 {
line-height: 1.2;
}
h1 {
- font-size: 2.5em;
+ font-size: 2em;
}
h2 {
- font-size: 2em;
+ font-size: 1.8em;
}
h3 {
- font-size: 1.7em;
+ font-size: 1.4em;
}
h4 {
- font-size: 1.4em;
+ font-size: 1.3em;
}
h5 {
- font-size: 1.25em;
+ font-size: 1.2em;
}
strong,
b {
@@ -96,9 +96,12 @@ ul li {
a {
color: var(--hc);
+ text-decoration: none;
+ font-family: var(--font-family-mono)
}
a:hover {
color: var(--accent);
+ text-decoration: underline;
}
p {
margin-bottom: 1em;
@@ -130,6 +133,7 @@ code {
border-radius: 2px;
margin-left: 3px;
margin-right: 3px;
+ font-family: var(--font-family-mono);
}
pre {
padding: 1.5em;
@@ -137,7 +141,9 @@ pre {
/* background-color: #0ed2c5; */
}
pre > code {
- all: unset;
+ font-family: var(--font-family-mono);
+ /* all: unset; */
+ background-color: #00000000;
}
blockquote {
border-left: 4px solid var(--accent);