HomeRepositoryMiniProgram/app.wxss at main · KennyZou4468/HomeRepositoryMiniProgram · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
/* app.wxss - 全局样式 */

page {
  --ui-scale: 1; /* 老人关怀模式缩放因子，默认1，开启后为1.5 */
  background-color: #faf8f5;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  font-size: calc(28rpx * var(--ui-scale));
  line-height: 1.5;
  color: #5a5a5a;
}

/* 暗色主题 - page 级别 */
page.theme-dark {
  background-color: #1a1a1a;
  color: #e0e0e0;
}

/* 通用样式 */
.container {
  box-sizing: border-box;
}

/* 暗色主题容器 */
.container.theme-dark {
  background: linear-gradient(180deg, #1a1a1a 0%, #252525 100%) !important;
}

/* 清除按钮默认样式 */
button::after {
  border: none;
}

button {
  margin: 0;
  padding: 0;
  background-color: transparent;
}

/* ========== 暗色主题通用样式 ========== */
.theme-dark .card,
.theme-dark .detail-card,
.theme-dark .edit-card,
.theme-dark .section {
  background-color: #2a2a2a !important;
  border-color: #3a3a3a !important;
}

.theme-dark .item-name,
.theme-dark .page-title,
.theme-dark .section-title,
.theme-dark .edit-title,
.theme-dark .picker-title {
  color: #f0f0f0 !important;
}

.theme-dark .item-location,
.theme-dark .item-category,
.theme-dark .page-subtitle,
.theme-dark .subsection-title,
.theme-dark .info-label,
.theme-dark .form-label,
.theme-dark .count-label {
  color: #a0a0a0 !important;
}

.theme-dark .form-input,
.theme-dark .form-textarea,
.theme-dark .form-select,
.theme-dark .add-input {
  background-color: #333333 !important;
  border-color: #444444 !important;
  color: #e0e0e0 !important;
}

.theme-dark .form-input::placeholder,
.theme-dark .form-textarea::placeholder,
.theme-dark .add-input::placeholder {
  color: #666666 !important;
}

.theme-dark .tag-preset {
  background-color: #3a3a3a !important;
  color: #c0c0c0 !important;
}

.theme-dark .tag-custom {
  background-color: #3d3530 !important;
  color: #ffb88e !important;
}

.theme-dark .info-value {
  background-color: #333333 !important;
  color: #d0d0d0 !important;
}

.theme-dark .count-section {
  background: linear-gradient(135deg, #2a2a2a 0%, #333333 100%) !important;
  border-color: #3a3a3a !important;
}

.theme-dark .count-value {
  color: #8ecf87 !important;
}

.theme-dark .picker-popup {
  background-color: #2a2a2a !important;
}

.theme-dark .picker-item {
  color: #d0d0d0 !important;
}

.theme-dark .picker-item:active,
.theme-dark .picker-item.selected {
  background-color: #333333 !important;
}

.theme-dark .picker-add-section {
  background-color: #252525 !important;
  border-color: #3a3a3a !important;
}

.theme-dark .empty-tip {
  color: #666666 !important;
}

/* ========== 老人关怀模式 ========== */
/*
 * 使用 CSS 变量 --ui-scale 控制缩放
 * 各页面关键尺寸通过 calc(Xrpx * var(--ui-scale)) 响应
 * 开启时 --ui-scale: 1.5，关闭时 --ui-scale: 1
 */
.elder-mode {
  --ui-scale: 1.5;
}