Skip to content

Commit 06df105

Browse files
WalterDSUWalterDSU
authored
适配新的显示规则
1 parent 912c3c4 commit 06df105

File tree

2 files changed

+31
-33
lines changed

2 files changed

+31
-33
lines changed

‎dist/ch_calendar-card.js‎

Lines changed: 31 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -67,23 +67,23 @@ class ChineseCalendarCard extends LitElement {
6767
text-align: right;
6868
color: var(--main-title-color);
6969
margin-right: 18px;
70-
margin-top: 18px;
70+
margin-top: 0px;
7171
mix-blend-mode: difference;
7272
}
7373
.date_week {
7474
font-size: 18px;
7575
color: var(--main-title-color);
7676
text-align: right;
7777
margin-right: 18px;
78-
margin-top: -18px;
78+
margin-top: -68px;
7979
mix-blend-mode: difference;
8080
}
8181
.date_weak_number {
8282
font-size: 14px;
8383
color: var(--main-title-color);
8484
text-align: right;
8585
margin-right: 18px;
86-
86+
margin-top: 0px;
8787
mix-blend-mode: difference;
8888
}
8989
.date_lunar {
@@ -99,7 +99,7 @@ class ChineseCalendarCard extends LitElement {
9999
color: var(--main-title-color);
100100
margin-right: 20px;
101101
margin-left: 20px;
102-
margin-top: 20px;
102+
margin-top: 0px;
103103
mix-blend-mode: difference;
104104
text-align: center;
105105
}
@@ -109,7 +109,7 @@ class ChineseCalendarCard extends LitElement {
109109
margin-right: 20px;
110110
text-align: center;
111111
margin-left: 20px;
112-
padding-top: 30px;
112+
padding-top: 8px;
113113
mix-blend-mode: difference;
114114
}
115115
@@ -124,32 +124,41 @@ class ChineseCalendarCard extends LitElement {
124124
color: var(--main-title-color);
125125
font-size: 18px;
126126
text-align: center;
127-
padding-top: 4px; /* new */
127+
padding-top: 0px; /* new */
128+
margin-top: 0px;
128129
mix-blend-mode: difference;
129130
}
130131
.latest_days {
131132
color: var(--ch-highlight-color); /* 设置上半部分倒计数字天数的颜色, 为用下面列表数字一样的浅蓝色,原来是白色的 */
132133
text-align: center;
133-
padding-top: 18px; /* 设置上半部分倒计数字天数的颜色与上文案间隙, 从20到18 */
134+
padding-top: 0px; /* 设置上半部分倒计数字天数的颜色与上文案间隙, 从20到18 */
134135
padding-bottom: 0px; /* 设置上半部分倒计数字天数的颜色与下文案间隙 */
136+
margin-top: 0px; /* 新增 */
137+
margin-bottom: 0px; /* 新增 */
135138
}
136139
.days-number {
137140
font-size: 68px; /* 设置上半部分倒计数字天数的字体大小 */
138141
font-weight: bold;
139-
display: bold;
142+
143+
margin-top: 0px;
144+
padding-top: 0px;
145+
padding-bottom: 0px;
146+
line-height: 1; /* 新增，确保行高不会增加太多高度 */
140147
}
141148
.days-text {
142149
font-size: 12px; /* 设置上半部分倒计数字天数的天字的字体大小 */
143150
color: var(--main-title-color);
144151
mix-blend-mode: difference;
152+
145153
}
146154
147155
.latest_date {
148156
color: var(--main-title-color);
149157
font-size: 16px; /* 设置上半部分倒计数字日期的数字字体大小 */
150158
text-align: center;
151-
padding-bottom: 0px; /* 设置上半部分倒计数字日期的数字与下文的空隙 */
159+
/* 设置上半部分倒计数字日期的数字与下文的空隙 */
152160
mix-blend-mode: difference;
161+
margin-top: 0px;
153162
}
154163
.cell_l {
155164
text-align: left;
@@ -158,30 +167,26 @@ class ChineseCalendarCard extends LitElement {
158167
font-size: 16px;
159168
color: var(--main-title-color)
160169
mix-blend-mode: difference;
161-
white-space: pre-wrap;
162-
170+
white-space: pre-wrap;
163171
}
164172
.cell_date {
165173
font-size: 14px;
166174
color: rgba(255, 255, 255, 0.7); /* 设置为白色的70%透明度,0代表完全透明 */
167175
mix-blend-mode: difference;
168-
white-space: pre-wrap;
169-
176+
white-space: pre-wrap;
170177
}
171178
.cell_day_h {
172179
text-align: right;
173180
padding-right: 12px;
174181
font-size: 16px;
175-
color: var(--ch-highlight-color);
176-
182+
color: var(--ch-highlight-color);
177183
}
178184
.cell_day_n {
179185
text-align: right;
180186
padding-right: 12px;
181187
font-size: 16px;
182188
color: var(--main-title-color);
183-
mix-blend-mode: difference;
184-
189+
mix-blend-mode: difference;
185190
}
186191
.table {
187192
width: 100%;
@@ -205,19 +210,13 @@ class ChineseCalendarCard extends LitElement {
205210
font-size: 58px;
206211
color: var(--main-title-color);
207212
text-align: left;
208-
margin-top: 28px;
213+
margin-top: 0px;
209214
mix-blend-mode: difference;
210215
}
211216
.timeanddate {
212217
display: flex;
213218
justify-content: space-between;
214219
}
215-
.goodnight-message {
216-
font-family: Arial, sans-serif;
217-
font-size: 16px;
218-
color: var(--main-title-color);
219-
mix-blend-mode: difference;
220-
}
221220
`;
222221
}
223222

@@ -237,7 +236,6 @@ class ChineseCalendarCard extends LitElement {
237236
} else if (hour >= 18 && hour < 23) {
238237
pdtime = "晚上好，";
239238
} else {
240-
pdtime = "夜深了，";
241239
yeshen = "夜深了，不要熬夜了，";
242240
}
243241
return html`
@@ -259,7 +257,7 @@ class ChineseCalendarCard extends LitElement {
259257
<div class="date_solar">
260258
${this.attributes.solar}
261259
</div>
262-
</div>
260+
</div>
263261
<div class="date_week">
264262
<p class="icon_state" style="background: none, url(${this.getStateIcon(this.calendarEntity.state)}) no-repeat; background-size: contain;"></p>
265263
${this.calendarEntity.state}丨${this.attributes.week}
@@ -269,7 +267,8 @@ class ChineseCalendarCard extends LitElement {
269267
</div>
270268
<div class="date_weak_number">
271269
第${this.attributes.week_number}周
272-
</div>
270+
</div>
271+
273272
<div class="latest_title">距离</div>
274273
<div class="latest_holiday">${this.latestReminder.name}</div>
275274
@@ -292,10 +291,8 @@ class ChineseCalendarCard extends LitElement {
292291
<tr>
293292
<td class="cell_name">${item.name}</td>
294293
</tr>
295-
<tr>
296-
297-
<td class="cell_date">${this.dateFormatIfNeed(item.date)}丨${this.getWeekday(this.dateFormatIfNeed(item.date))}</td>
298-
294+
<tr>
295+
<td class="cell_date">${this.dateFormatIfNeed(item.date)}丨${this.getWeekday(this.dateFormatIfNeed(item.date))}</td>
299296
</tr>
300297
</table>
301298
</td>
@@ -319,7 +316,8 @@ class ChineseCalendarCard extends LitElement {
319316
`
320317
)}
321318
</div>
322-
</ha-card>
319+
320+
</ha-card>
323321
`;
324322

325323

@@ -524,7 +522,6 @@ class ChineseCalendarCard extends LitElement {
524522
const weekday = weekdays[day];
525523
return weekday;
526524
}
527-
528525
getIcon(index) {
529526
return `${
530527
this.config.icons
@@ -571,6 +568,7 @@ class ChineseCalendarCard extends LitElement {
571568
}
572569
}
573570

571+
574572
customElements.define('ch_calendar-card', ChineseCalendarCard);
575573
window.customCards = window.customCards || [];
576574
window.customCards.push({

‎dist/ch_calendar-card.js.gz‎

4.53 KB
Binary file not shown.

0 commit comments

Comments
 (0)