diff --git a/src/components/widgets/WeekplanWidget.vue b/src/components/widgets/WeekplanWidget.vue index 657572a..eecb86f 100644 --- a/src/components/widgets/WeekplanWidget.vue +++ b/src/components/widgets/WeekplanWidget.vue @@ -51,7 +51,7 @@
  • {{ item.contents }} - {{ item.times }} + {{ item.times }}
    {{ metaOf(item) || "-" }}
    @@ -62,7 +62,7 @@ -
    +
    {{ remarkText }}
    {{ remarkExpanded ? "收起" : "展开" }}
    @@ -260,6 +260,11 @@ function metaOf(item: any) { return parts.join(" · "); } +/** 右侧时间文案是否含汉字(如「全天」):同字号下汉字字面高 ≈1.29 × 数字,降一档字号(.is-cjk) */ +function isCjk(value: any) { + return /[\u4e00-\u9fa5]/.test(String(value || "")); +} + function toggleRemark() { remarkExpanded.value = !remarkExpanded.value; if (!remarkExpanded.value) nextTick(measureRemark); @@ -355,21 +360,25 @@ $wk-primary-dark: #4864d8; &.has b::after { visibility: visible; } - // 休息日(周六 / 周日)弱化日期数字 - &.rest b { + // 休息日(周六 / 周日)与法定节假日:日期数字同档弱化灰(节假日不再标红) + &.rest b, + &.holiday b { color: #98a2b0; } - // 法定节假日醒目标记 - &.holiday b { - color: #e64545; - } // 今日:蓝底白字方块(置最后,压过 rest / holiday 的日期字色) + // 数字居中:flex 双向居中 + 定高 22px;line-height:1 去掉行盒 descender 余量 + //(原 15px/1.5 行盒:数字视觉偏上 ≈1.2px,且行盒底部 descender 空白把方块"顶高") + // margin-top 1px:让方块里的数字与其余 6 天同基线(实测差 ≤0.5px) &.is-on { color: $wk-primary; b { + display: flex; + align-items: center; + justify-content: center; width: 28px; - margin: 2px auto 0; - padding: 1px 0; + height: 22px; + margin: 1px auto 0; + line-height: 1; background: $wk-primary; color: #fff; border-radius: 4px; @@ -452,6 +461,11 @@ $wk-primary-dark: #4864d8; flex: 0 0 auto; color: #6e7c87; margin-left: 10px; + // 汉字型时间(全天/放假)降一档:同字号下汉字字面高 ≈1.29 × 数字(15px 实测 18px vs 14px), + // 15px 时观感比「14:00-15:00」明显偏大 + &.is-cjk { + font-size: 13px; + } } .meta { margin-top: 2px; @@ -480,25 +494,20 @@ $wk-primary-dark: #4864d8; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; + // 右侧恒留 34px 给按钮:折叠态第二行以省略号收尾,展开态最后一行绕开按钮 + padding-right: 34px; &.expanded { display: block; overflow: visible; } } - // 折叠态:正文右侧给「展开」留位(第二行以省略号收尾),按钮贴第二行末尾(右端) - &.collapsed .rk-txt { - padding-right: 34px; - } - &.collapsed .rk-more { + // 「展开 / 收起」恒贴正文最后一行的右端(折叠=第二行、展开=最后一行),不另起一行 + .rk-more { position: absolute; right: 10px; bottom: 8px; // 与备注块同底色,压住可能蹭到的正文尾部 background: #f7f8fa; - } - .rk-more { - display: inline-block; - margin-top: 2px; font-size: 13px; color: $wk-primary; cursor: pointer;