Skip to content

Commit 10af080

Browse files
CatCodeMeCatCodeMe
committed
链接样式和 about 页面调整
1 parent 49503fa commit 10af080

File tree

3 files changed

+24
-24
lines changed

3 files changed

+24
-24
lines changed

‎src/assets/styles/external-link.css

Lines changed: 12 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,27 @@
11
.external-link {
22
position: relative;
3-
/* color: hsl(var(--primary)); */
43
display: inline-flex;
54
align-items: center;
65
gap: 0.2em;
76
text-decoration: none;
8-
/* padding: 0.1em 0.3em;
9-
margin: -0.1em -0.3em;
10-
border-radius: 0.2em; */
11-
transition: all 0.2s ease;
12-
border-bottom: dashed;
7+
border-bottom: 1px solid rgba(120, 120, 120, 0.4); /* 默认很淡很细 */
8+
transition:
9+
border-bottom-color 0.3s cubic-bezier(0.4,0,0.2,1),
10+
border-bottom-width 0.3s cubic-bezier(0.4,0,0.2,1);
1311
}
1412

15-
.external-link::after {
16-
content: '';
17-
width: 0.8em;
18-
height: 0.8em;
19-
background-color: currentColor;
20-
-webkit-mask-size: contain;
21-
mask-size: contain;
22-
opacity: 0.6;
23-
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'%3E%3C/path%3E%3Cpolyline points='15 3 21 3 21 9'%3E%3C/polyline%3E%3Cline x1='10' y1='14' x2='21' y2='3'%3E%3C/line%3E%3C/svg%3E");
24-
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'%3E%3C/path%3E%3Cpolyline points='15 3 21 3 21 9'%3E%3C/polyline%3E%3Cline x1='10' y1='14' x2='21' y2='3'%3E%3C/line%3E%3C/svg%3E");
13+
.external-link:hover {
14+
border-bottom-color: rgba(120, 120, 120, 1); /* hover更明显 */
15+
border-bottom-width: 1px;
2516
}
2617

27-
/* .external-link:hover {
28-
background-color: hsl(var(--primary) / 0.1);
29-
box-shadow: 0 0 0 1px hsl(var(--primary) / 0.2);
18+
/* 不再需要 after 图标 */
19+
/* .external-link::after {
20+
display: none !important;
3021
} */
3122

3223
/* 特定网站的图标样式保持不变 */
33-
.external-link[href*="github.com"]::after {
24+
/* .external-link[href*="github.com"]::after {
3425
-webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 2C6.477 2 2 6.477 2 12c0 4.42 2.87 8.17 6.84 9.5.5.08.66-.23.66-.5v-1.69c-2.77.6-3.36-1.34-3.36-1.34-.46-1.16-1.11-1.47-1.11-1.47-.91-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.87 1.52 2.34 1.07 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.92 0-1.11.38-2 1.03-2.71-.1-.25-.45-1.29.1-2.64 0 0 .84-.27 2.75 1.02.79-.22 1.65-.33 2.5-.33.85 0 1.71.11 2.5.33 1.91-1.29 2.75-1.02 2.75-1.02.55 1.35.2 2.39.1 2.64.65.71 1.03 1.6 1.03 2.71 0 3.82-2.34 4.66-4.57 4.91.36.31.69.92.69 1.85V21c0 .27.16.59.67.5C19.14 20.16 22 16.42 22 12A10 10 0 0 0 12 2z'/%3E%3C/svg%3E");
3526
mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 2C6.477 2 2 6.477 2 12c0 4.42 2.87 8.17 6.84 9.5.5.08.66-.23.66-.5v-1.69c-2.77.6-3.36-1.34-3.36-1.34-.46-1.16-1.11-1.47-1.11-1.47-.91-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.87 1.52 2.34 1.07 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.92 0-1.11.38-2 1.03-2.71-.1-.25-.45-1.29.1-2.64 0 0 .84-.27 2.75 1.02.79-.22 1.65-.33 2.5-.33.85 0 1.71.11 2.5.33 1.91-1.29 2.75-1.02 2.75-1.02.55 1.35.2 2.39.1 2.64.65.71 1.03 1.6 1.03 2.71 0 3.82-2.34 4.66-4.57 4.91.36.31.69.92.69 1.85V21c0 .27.16.59.67.5C19.14 20.16 22 16.42 22 12A10 10 0 0 0 12 2z'/%3E%3C/svg%3E");
3627
}
@@ -39,7 +30,7 @@
3930
.external-link[href*="x.com"]::after {
4031
-webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z'/%3E%3C/svg%3E");
4132
mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z'/%3E%3C/svg%3E");
42-
}
33+
} */
4334

4435
.external-link-icon {
4536
display: none;

‎src/assets/styles/inner-link.css

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,17 @@
11
.inner-link {
2-
/* color: hsl(var(--accent)); */
3-
text-decoration: underline;
2+
text-decoration: none;
43
position: relative;
54
padding-right: 1.2em;
5+
border-bottom: 1px dashed rgba(120, 120, 120, 0.4); /* 虚线，淡灰色 */
6+
transition:
7+
border-bottom-color 0.3s cubic-bezier(0.4,0,0.2,1),
8+
border-bottom-width 0.3s cubic-bezier(0.4,0,0.2,1);
9+
}
10+
11+
12+
.inner-link:hover {
13+
border-bottom-color: rgba(120, 120, 120, 1); /* hover更明显 */
14+
border-bottom-width: 1px;
615
}
716

817

‎src/pages/about/index.astro

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { ToolTag } from '@/components/tools/Tool.astro'
77
import ToolSection from '@/components/tools/ToolSection.astro'
88
---
99

10-
<PageLayout title='About' info='/about'>
10+
<PageLayout title='About' info={{slug: '/about', hideComment: true}}>
1111
<h2 id='about'>About Me</h2>
1212
<ul>
1313
<li>Communist / Developer / Learner / Cat owner</li>

0 commit comments

Comments
 (0)