@xingwangzhe/stalux 1.29.1 → 1.29.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@xingwangzhe/stalux",
3
- "version": "1.29.1",
3
+ "version": "1.29.3",
4
4
  "description": "A powerful, modern Astro blog theme — use as template or install as plugin",
5
5
  "keywords": [
6
6
  "astro",
@@ -113,14 +113,14 @@ ul {
113
113
  --stalux-text-shadow: var(--stalux-accent-color) 0.08rem 0.08rem 0.18rem;
114
114
  --stalux-accent-color: #eab308;
115
115
  --stalux-accent-rgb: 234, 179, 8;
116
- --surface-glass: var(--black-10p);
116
+ --surface-glass: var(--black-05p);
117
117
  --surface-glass-shadow: var(--shadow-sidebar);
118
118
 
119
119
  /* 卡片和标签颜色 Token(可在这里统一调整主题色/透明度) */
120
120
  --card-bg: var(--surface-glass);
121
121
  --card-border: rgba(255, 255, 255, 0.1);
122
- --card-box-shadow: var(--shadow-sidebar);
123
- --card-box-shadow-hover: var(--shadow-raised-hover);
122
+ --card-box-shadow: 0 10px 24px rgba(0, 0, 0, 0.08);
123
+ --card-box-shadow-hover: 0 14px 28px rgba(0, 0, 0, 0.12);
124
124
 
125
125
  --tag-bg: rgba(255, 255, 255, 0.12);
126
126
  --tag-bg-hover: rgba(255, 255, 255, 0.18);
@@ -153,6 +153,7 @@ ul {
153
153
  --black-20p: rgba(0, 0, 0, 0.2);
154
154
  --black-15p: rgba(0, 0, 0, 0.15);
155
155
  --black-10p: rgba(0, 0, 0, 0.1);
156
+ --black-05p: rgba(0, 0, 0, 0.05);
156
157
 
157
158
  /* 强调色变体 */
158
159
  --accent-90p: rgba(var(--stalux-accent-rgb), 0.9);
@@ -7,7 +7,7 @@
7
7
  background-color: var(--surface-glass);
8
8
  border-radius: 0.8rem;
9
9
  color: var(--white-full);
10
- box-shadow: var(--shadow-sidebar);
10
+ box-shadow: var(--card-box-shadow);
11
11
  transition:
12
12
  transform 220ms ease,
13
13
  background-color 220ms ease,
@@ -36,8 +36,8 @@
36
36
 
37
37
  .categoryCard:hover {
38
38
  transform: translateY(-3px);
39
- background-color: rgba(255, 255, 255, 0.08);
40
- box-shadow: var(--shadow-raised-hover);
39
+ background-color: var(--white-05p);
40
+ box-shadow: var(--card-box-shadow-hover);
41
41
  }
42
42
 
43
43
  .categoryCard:hover::before {
@@ -16,13 +16,13 @@
16
16
  box-shadow 220ms ease,
17
17
  background-color 220ms ease,
18
18
  border-color 220ms ease;
19
- box-shadow: var(--shadow-sidebar);
19
+ box-shadow: var(--card-box-shadow);
20
20
  }
21
21
 
22
22
  .card:hover {
23
23
  transform: translateY(-3px);
24
- background: #ffffff26;
25
- box-shadow: var(--shadow-raised-hover);
24
+ background: var(--white-05p);
25
+ box-shadow: var(--card-box-shadow-hover);
26
26
  }
27
27
 
28
28
  .avatar {
@@ -45,11 +45,21 @@
45
45
  }
46
46
 
47
47
  .card:hover .avatar img {
48
- transform: rotate(5deg) scale(1.04);
48
+ transform: scale(1.04);
49
+ animation: link-avatar-spin 700ms ease-in-out 1;
49
50
  box-shadow: 0 0 20px var(--accent-50p);
50
51
  border-color: var(--accent-85p);
51
52
  }
52
53
 
54
+ @keyframes link-avatar-spin {
55
+ from {
56
+ transform: rotate(0deg) scale(1.04);
57
+ }
58
+ to {
59
+ transform: rotate(360deg) scale(1.04);
60
+ }
61
+ }
62
+
53
63
  .content {
54
64
  text-align: center;
55
65
  flex: 1;
@@ -98,3 +108,11 @@
98
108
  font-size: 0.9rem;
99
109
  }
100
110
  }
111
+
112
+ @media (prefers-reduced-motion: reduce) {
113
+ .card:hover .avatar img {
114
+ animation: none;
115
+ transform: none;
116
+ transition: none;
117
+ }
118
+ }
@@ -13,10 +13,10 @@
13
13
  .authorCard {
14
14
  display: flex;
15
15
  flex-direction: column;
16
- background: var(--black-10p);
16
+ background: var(--black-05p);
17
17
  border-radius: var(--radius-lg);
18
18
  padding: var(--space-md);
19
- box-shadow: var(--shadow-sidebar);
19
+ box-shadow: var(--card-box-shadow);
20
20
  transition: all var(--transition-normal) ease;
21
21
  }
22
22
 
@@ -99,7 +99,7 @@
99
99
 
100
100
  /* 评论卡片样式 */
101
101
  .wl-card {
102
- background-color: rgba(17, 17, 17, 0.3) !important;
102
+ background-color: rgba(17, 17, 17, 0.05) !important;
103
103
  border-radius: 12px;
104
104
  padding: 1.2rem;
105
105
  margin-top: 1.2rem;
@@ -109,7 +109,7 @@
109
109
 
110
110
  .wl-card:hover {
111
111
  transform: translateY(-3px);
112
- box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
112
+ box-shadow: 0 10px 24px rgba(0, 0, 0, 0.08);
113
113
  border-color: rgba(var(--waline-accent-rgb), 0.3) !important;
114
114
  }
115
115
 
@@ -81,7 +81,7 @@
81
81
  align-items: center;
82
82
  padding: 0.5rem 1rem;
83
83
  border-radius: 2rem;
84
- background-color: var(--white-10p);
84
+ background-color: var(--white-05p);
85
85
  color: var(--white-full);
86
86
  text-decoration: none;
87
87
  border: 1px solid var(--white-20p);
@@ -113,7 +113,7 @@
113
113
  .tagCard:hover {
114
114
  transform: translateY(-2px);
115
115
  border-color: var(--accent-50p);
116
- box-shadow: var(--shadow-md);
116
+ box-shadow: var(--card-box-shadow-hover);
117
117
  }
118
118
 
119
119
  .tagCard:hover::before {
@@ -4,7 +4,7 @@
4
4
  background: var(--surface-glass);
5
5
  border-radius: var(--radius-lg, 12px);
6
6
  padding: 1.5rem;
7
- box-shadow: var(--shadow-sidebar);
7
+ box-shadow: var(--card-box-shadow);
8
8
  transition:
9
9
  transform var(--transition-normal) ease,
10
10
  box-shadow var(--transition-normal) ease;
@@ -20,7 +20,7 @@
20
20
 
21
21
  .card:hover {
22
22
  transform: translateY(-4px);
23
- box-shadow: var(--shadow-raised-hover);
23
+ box-shadow: var(--card-box-shadow-hover);
24
24
  }
25
25
 
26
26
  /* 被 hash 定位的卡片 — 主题光晕 */