From 0da0ce293bc174ae42e06da8ef6c6ac673108ff1 Mon Sep 17 00:00:00 2001 From: yoy Date: Fri, 17 Oct 2025 09:17:09 +0200 Subject: [PATCH] fix: Use on_surface instead of on_surface_variant if applicable --- .../calendar/gui/eventeditor-view/AttendeeListEditor.ts | 4 ++-- .../gui/eventeditor-view/CalendarEventEditDialog.ts | 2 +- .../calendar/gui/eventeditor-view/RepeatRuleEditor.ts | 6 +++--- .../calendar/gui/eventpopup/ContactPreviewView.ts | 2 +- src/common/gui/SidebarSection.ts | 2 +- src/common/gui/base/Expander.ts | 2 +- src/common/gui/base/NavButton.ts | 2 +- src/common/gui/base/buttons/BannerButton.ts | 2 +- src/common/gui/base/buttons/OutlineButton.ts | 2 +- src/common/gui/base/buttons/RowButton.ts | 2 +- src/common/gui/main-styles.ts | 2 +- src/common/gui/titles/MenuTitle.ts | 2 +- src/common/subscription/BuyOptionBox.ts | 2 +- src/common/support/pages/SupportTopicPage.ts | 2 +- src/mail-app/gui/date/EventBannerImpl.ts | 2 +- src/mail-app/mail/view/CollapsedMailView.ts | 2 +- src/mail-app/mail/view/ConversationViewer.ts | 2 +- src/mail-app/mail/view/LabelsPopup.ts | 2 +- src/mail-app/mail/view/MailRow.ts | 2 +- src/mail-app/mail/view/MailViewerHeader.ts | 2 +- src/mail-app/settings/SettingsView.ts | 2 +- 21 files changed, 24 insertions(+), 24 deletions(-) diff --git a/src/calendar-app/calendar/gui/eventeditor-view/AttendeeListEditor.ts b/src/calendar-app/calendar/gui/eventeditor-view/AttendeeListEditor.ts index aefaf376e2..81f97eb392 100644 --- a/src/calendar-app/calendar/gui/eventeditor-view/AttendeeListEditor.ts +++ b/src/calendar-app/calendar/gui/eventeditor-view/AttendeeListEditor.ts @@ -52,7 +52,7 @@ export class AttendeeListEditor implements Component { m(".flex-grow.flex.flex-column.gap-vpad.pb.pt.fit-height", { style: { width: px(attrs.width) } }, [ this.renderOrganizer(attrs.model, organizer), m(".flex.flex-column.gap-vpad-s", [ - m("small.uppercase.b.text-ellipsis", { style: { color: theme.on_surface_variant } }, lang.get("guests_label")), + m("small.uppercase.b.text-ellipsis", { style: { color: theme.on_surface } }, lang.get("guests_label")), whoModel.canModifyGuests ? this.renderGuestsInput(whoModel, attrs.logins, attrs.recipientsSearch) : null, this.renderSendUpdateCheckbox(attrs.model.editModels.whoModel), this.renderGuestList(attrs, organizer), @@ -218,7 +218,7 @@ export class AttendeeListEditor implements Component { const selected = options.find((option) => option.address === address) ?? options[0] return m(".flex.col", [ - m("small.uppercase.pb-s.b.text-ellipsis", { style: { color: theme.on_surface_variant } }, lang.get("organizer_label")), + m("small.uppercase.pb-s.b.text-ellipsis", { style: { color: theme.on_surface } }, lang.get("organizer_label")), m(Card, { style: { padding: `0` } }, [ m(".flex.flex-column", [ m(".flex.pl-vpad-s.pr-vpad-s", [ diff --git a/src/calendar-app/calendar/gui/eventeditor-view/CalendarEventEditDialog.ts b/src/calendar-app/calendar/gui/eventeditor-view/CalendarEventEditDialog.ts index 074341f242..69bebeb0b9 100644 --- a/src/calendar-app/calendar/gui/eventeditor-view/CalendarEventEditDialog.ts +++ b/src/calendar-app/calendar/gui/eventeditor-view/CalendarEventEditDialog.ts @@ -145,7 +145,7 @@ export class EventEditorDialog { { height: "100%", "background-color": theme.surface_container, - color: theme.on_surface_variant, + color: theme.on_surface, }, ) .addShortcut({ diff --git a/src/calendar-app/calendar/gui/eventeditor-view/RepeatRuleEditor.ts b/src/calendar-app/calendar/gui/eventeditor-view/RepeatRuleEditor.ts index b1cad8787d..2a9db8e579 100644 --- a/src/calendar-app/calendar/gui/eventeditor-view/RepeatRuleEditor.ts +++ b/src/calendar-app/calendar/gui/eventeditor-view/RepeatRuleEditor.ts @@ -96,7 +96,7 @@ export class RepeatRuleEditor implements Component { [ this.hasUnsupportedRules ? this.renderUnsupportedAdvancedRulesWarning() : null, m(".flex.col", [ - m("small.uppercase.pb-s.b.text-ellipsis", { style: { color: theme.on_surface_variant } }, lang.getTranslationText("frequency_title")), + m("small.uppercase.pb-s.b.text-ellipsis", { style: { color: theme.on_surface } }, lang.getTranslationText("frequency_title")), m( Card, { @@ -137,7 +137,7 @@ export class RepeatRuleEditor implements Component { } return m(".flex.col", [ - m("small.uppercase.pb-s.b.text-ellipsis", { style: { color: theme.on_surface_variant } }, lang.get("calendarRepeatStopCondition_label")), + m("small.uppercase.pb-s.b.text-ellipsis", { style: { color: theme.on_surface } }, lang.get("calendarRepeatStopCondition_label")), m( Card, { @@ -169,7 +169,7 @@ export class RepeatRuleEditor implements Component { } return m(".flex.col", [ - m("small.uppercase.pb-s.b.text-ellipsis", { style: { color: theme.on_surface_variant } }, lang.get("interval_title")), + m("small.uppercase.pb-s.b.text-ellipsis", { style: { color: theme.on_surface } }, lang.get("interval_title")), m( Card, { diff --git a/src/calendar-app/calendar/gui/eventpopup/ContactPreviewView.ts b/src/calendar-app/calendar/gui/eventpopup/ContactPreviewView.ts index e1d564b1b4..4406d2855a 100644 --- a/src/calendar-app/calendar/gui/eventpopup/ContactPreviewView.ts +++ b/src/calendar-app/calendar/gui/eventpopup/ContactPreviewView.ts @@ -144,7 +144,7 @@ const ActionButtons = pureComponent((contact: Contact) => { } const phoneButtonColors = { borderColor: theme.on_surface_variant, - color: theme.on_surface_variant, + color: theme.on_surface, } const singleEmailAdress = contact.mailAddresses.length === 1 diff --git a/src/common/gui/SidebarSection.ts b/src/common/gui/SidebarSection.ts index 654cf913df..bd412641ab 100644 --- a/src/common/gui/SidebarSection.ts +++ b/src/common/gui/SidebarSection.ts @@ -25,7 +25,7 @@ export class SidebarSection implements Component { { "data-testid": `section:${lang.getTestId(name)}`, style: { - color: theme.on_surface_variant, + color: theme.on_surface, }, }, [ diff --git a/src/common/gui/base/Expander.ts b/src/common/gui/base/Expander.ts index bf2cd1d028..11b1908dae 100644 --- a/src/common/gui/base/Expander.ts +++ b/src/common/gui/base/Expander.ts @@ -62,7 +62,7 @@ export class ExpanderButton implements Component { `${a.isBig ? "span" : "small"}`, { style: { - color: a.color || theme.on_surface_variant, + color: a.color || theme.on_surface, }, }, a.isUnformattedLabel ? label : label.toUpperCase(), diff --git a/src/common/gui/base/NavButton.ts b/src/common/gui/base/NavButton.ts index d4e98c466f..8ccc838a10 100644 --- a/src/common/gui/base/NavButton.ts +++ b/src/common/gui/base/NavButton.ts @@ -119,7 +119,7 @@ export class NavButton implements Component { href: this._getUrl(a.href), style: { "font-size": a.fontSize ? px(a.fontSize) : "", - color: this._draggedOver || isNavButtonSelected(a) ? theme.primary : theme.on_surface_variant, + color: this._draggedOver || isNavButtonSelected(a) ? theme.primary : theme.on_surface, ...(isCurrent && { background: theme.state_bg_active }), }, title: lang.getTranslationText(a.label), diff --git a/src/common/gui/base/buttons/BannerButton.ts b/src/common/gui/base/buttons/BannerButton.ts index 04299bab37..a98f5568aa 100644 --- a/src/common/gui/base/buttons/BannerButton.ts +++ b/src/common/gui/base/buttons/BannerButton.ts @@ -23,7 +23,7 @@ export class BannerButton implements Component { class: `border-radius center ${attrs.class} ${attrs.disabled ? "disabled" : ""}`, style: { border: `2px solid ${attrs.disabled ? theme.on_surface_variant : attrs.borderColor}`, - color: attrs.disabled ? theme.on_surface_variant : attrs.color, + color: attrs.disabled ? theme.on_surface : attrs.color, padding: px(size.vpad_small), minWidth: "60px", }, diff --git a/src/common/gui/base/buttons/OutlineButton.ts b/src/common/gui/base/buttons/OutlineButton.ts index 8062ddf40d..38c0f0ec6e 100644 --- a/src/common/gui/base/buttons/OutlineButton.ts +++ b/src/common/gui/base/buttons/OutlineButton.ts @@ -31,7 +31,7 @@ export class OutlineButton implements ClassComponent { disabled: attrs.disabled, style: { borderColor: theme.outline, - color: theme.on_surface_variant, + color: theme.on_surface, }, class: this.resolveClasses(attrs.expanded, attrs.disabled), } as BaseButtonAttrs) diff --git a/src/common/gui/base/buttons/RowButton.ts b/src/common/gui/base/buttons/RowButton.ts index 6a15901d8f..3dda096b80 100644 --- a/src/common/gui/base/buttons/RowButton.ts +++ b/src/common/gui/base/buttons/RowButton.ts @@ -25,7 +25,7 @@ export class RowButton implements Component { const attrs = vnode.attrs const label = lang.getTranslationText(attrs.label) const text = lang.getTranslationText(attrs.text ?? attrs.label) - const color = attrs.selected ? theme.primary : theme.on_surface_variant + const color = attrs.selected ? theme.primary : theme.on_surface return m(BaseButton, { label: attrs.label, text: m( diff --git a/src/common/gui/main-styles.ts b/src/common/gui/main-styles.ts index aa7b4a8c0b..67383d59e9 100644 --- a/src/common/gui/main-styles.ts +++ b/src/common/gui/main-styles.ts @@ -2662,7 +2662,7 @@ styles.registerStyle("main", () => { ".custom-color-container .inputWrapper:before": { // slash in content is content alt. so that it's ignored by screen readers content: '"#" / ""', - color: theme.on_surface_variant, + color: theme.on_surface, }, ".success-container": { "background-color": theme.success_container, diff --git a/src/common/gui/titles/MenuTitle.ts b/src/common/gui/titles/MenuTitle.ts index ba3e07415d..39d8f481ef 100644 --- a/src/common/gui/titles/MenuTitle.ts +++ b/src/common/gui/titles/MenuTitle.ts @@ -8,6 +8,6 @@ export type MenuTitleAttrsType = { // used in sidebar section title and inside setting view menus export class MenuTitle implements Component { view({ attrs }: Vnode): Children { - return m("small.uppercase.b", { style: { color: theme.on_surface_variant } }, attrs.content) + return m("small.uppercase.b", { style: { color: theme.on_surface } }, attrs.content) } } diff --git a/src/common/subscription/BuyOptionBox.ts b/src/common/subscription/BuyOptionBox.ts index e5c92db568..34c54ab4e8 100644 --- a/src/common/subscription/BuyOptionBox.ts +++ b/src/common/subscription/BuyOptionBox.ts @@ -250,7 +250,7 @@ export class BuyOptionBox implements Component { ".span.strike.pt-s", { style: { - color: theme.on_surface_variant, + color: theme.on_surface, fontSize: px(size.font_size_base), ...(!isApplePrice && { "justify-self": "end" }), }, diff --git a/src/common/support/pages/SupportTopicPage.ts b/src/common/support/pages/SupportTopicPage.ts index 60fc20c9f9..d45f36d9ee 100644 --- a/src/common/support/pages/SupportTopicPage.ts +++ b/src/common/support/pages/SupportTopicPage.ts @@ -83,7 +83,7 @@ class WasThisHelpful implements Component { view({ attrs: { goToContactSupportPage, goToSolutionWasHelpfulPage, topicName } }: Vnode): Children { return m( ".flex.flex-column.gap-vpad-s", - m("small.uppercase.b.text-ellipsis", { style: { color: theme.on_surface_variant } }, lang.get("wasThisHelpful_msg")), + m("small.uppercase.b.text-ellipsis", { style: { color: theme.on_surface } }, lang.get("wasThisHelpful_msg")), m(Card, { shouldDivide: true }, [ m(SectionButton, { text: "yes_label", diff --git a/src/mail-app/gui/date/EventBannerImpl.ts b/src/mail-app/gui/date/EventBannerImpl.ts index 164e27970a..9e677a0a01 100644 --- a/src/mail-app/gui/date/EventBannerImpl.ts +++ b/src/mail-app/gui/date/EventBannerImpl.ts @@ -148,7 +148,7 @@ export class EventBannerImpl implements ClassComponent { class: styles.isSingleColumnLayout() ? "plr-vpad" : "pr-vpad-l pl-vpad-l", style: { "background-color": theme.surface_container_high, - color: theme.on_surface_variant, + color: theme.on_surface, }, }, [ diff --git a/src/mail-app/mail/view/CollapsedMailView.ts b/src/mail-app/mail/view/CollapsedMailView.ts index 2f215d2cc4..6d37e67c3e 100644 --- a/src/mail-app/mail/view/CollapsedMailView.ts +++ b/src/mail-app/mail/view/CollapsedMailView.ts @@ -31,7 +31,7 @@ export class CollapsedMailView implements Component { "aria-expanded": "false", "data-testid": "collapsed-mail-view", style: { - color: theme.on_surface_variant, + color: theme.on_surface, }, onclick: () => viewModel.expandMail(Promise.resolve()), onkeyup: (e: KeyboardEvent) => { diff --git a/src/mail-app/mail/view/ConversationViewer.ts b/src/mail-app/mail/view/ConversationViewer.ts index 8e1811230c..45915e30db 100644 --- a/src/mail-app/mail/view/ConversationViewer.ts +++ b/src/mail-app/mail/view/ConversationViewer.ts @@ -193,7 +193,7 @@ export class ConversationViewer implements Component { ".font-weight-600.center.mt-l" + "." + responsiveCardHMargin(), { style: { - color: theme.on_surface_variant, + color: theme.on_surface, }, }, lang.get("loading_msg"), diff --git a/src/mail-app/mail/view/LabelsPopup.ts b/src/mail-app/mail/view/LabelsPopup.ts index 46e1e4a20c..ee5a2071e8 100644 --- a/src/mail-app/mail/view/LabelsPopup.ts +++ b/src/mail-app/mail/view/LabelsPopup.ts @@ -73,7 +73,7 @@ export class LabelsPopup implements ModalComponent { .sort((labelA, labelB) => labelA.label.name.localeCompare(labelB.label.name)) .map((labelState) => { const { label, state } = labelState - const color = theme.on_surface_variant + const color = theme.on_surface const canToggleLabel = state === LabelState.Applied || state === LabelState.AppliedToSome || !this.isMaxLabelsReached const opacity = !canToggleLabel ? 0.5 : undefined diff --git a/src/mail-app/mail/view/MailRow.ts b/src/mail-app/mail/view/MailRow.ts index b1763c7ac4..7a13e27eff 100644 --- a/src/mail-app/mail/view/MailRow.ts +++ b/src/mail-app/mail/view/MailRow.ts @@ -348,7 +348,7 @@ export class MailRow implements VirtualRow { style: { // in dark theme override saturation to aid readability. This is not relative but absolute saturation. We preserve the hue. border: `2px solid ${getLabelColor(theme.on_surface_variant)}`, - color: getLabelColor(theme.on_surface_variant), + color: getLabelColor(theme.on_surface), padding: `0px ${size.vpad_xsm}px 1px`, marginRight: px(size.vpad_xsm), minWidth: px(16), diff --git a/src/mail-app/mail/view/MailViewerHeader.ts b/src/mail-app/mail/view/MailViewerHeader.ts index 49a10b4fe3..bc4d5cb262 100644 --- a/src/mail-app/mail/view/MailViewerHeader.ts +++ b/src/mail-app/mail/view/MailViewerHeader.ts @@ -189,7 +189,7 @@ export class MailViewerHeader implements Component { }, hoverText: folderInfo.name, }), - m(".small.font-weight-600.selectable.no-wrap", { style: { color: theme.on_surface_variant } }, [ + m(".small.font-weight-600.selectable.no-wrap", { style: { color: theme.on_surface } }, [ m(".noprint", dateTime), // show the short date when viewing m(".noscreen", dateTimeFull), // show the date with year when printing ]), diff --git a/src/mail-app/settings/SettingsView.ts b/src/mail-app/settings/SettingsView.ts index 6d7ae9f082..788f7e0f00 100644 --- a/src/mail-app/settings/SettingsView.ts +++ b/src/mail-app/settings/SettingsView.ts @@ -799,7 +799,7 @@ export class SettingsView extends BaseTopLevelView implements TopLevelView