Improve contrast for timestamps, date separators & spotlight trigger (#91)

* Improve contrast for timestamps and room list search trigger Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update screenshot Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Change timeline separator colour to primary for improved contrast Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update screenshots Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --------- Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-11-22 08:08:42 +08:00 · 2024-09-27 15:22:15 +01:00 · 2024-09-27 15:22:15 +01:00 · 8962e8cdd3
commit 8962e8cdd3
parent ef9e310a25
21 changed files with 4 additions and 4 deletions
--- a/playwright/snapshots/editing/editing.spec.ts/message-edit-history-dialog-linux.png
+++ b/playwright/snapshots/editing/editing.spec.ts/message-edit-history-dialog-linux.png
--- a/playwright/snapshots/polls/polls.spec.ts/ThreadView-with-a-poll-on-bubble-layout-linux.png
+++ b/playwright/snapshots/polls/polls.spec.ts/ThreadView-with-a-poll-on-bubble-layout-linux.png
--- a/playwright/snapshots/polls/polls.spec.ts/ThreadView-with-a-poll-on-group-layout-linux.png
+++ b/playwright/snapshots/polls/polls.spec.ts/ThreadView-with-a-poll-on-group-layout-linux.png
--- a/playwright/snapshots/right-panel/file-panel.spec.ts/file-tiles-list-linux.png
+++ b/playwright/snapshots/right-panel/file-panel.spec.ts/file-tiles-list-linux.png
--- a/playwright/snapshots/timeline/timeline.spec.ts/collapsed-gels-and-messages-irc-layout-linux.png
+++ b/playwright/snapshots/timeline/timeline.spec.ts/collapsed-gels-and-messages-irc-layout-linux.png
--- a/playwright/snapshots/timeline/timeline.spec.ts/collapsed-gels-bubble-layout-linux.png
+++ b/playwright/snapshots/timeline/timeline.spec.ts/collapsed-gels-bubble-layout-linux.png
--- a/playwright/snapshots/timeline/timeline.spec.ts/configured-room-irc-layout-linux.png
+++ b/playwright/snapshots/timeline/timeline.spec.ts/configured-room-irc-layout-linux.png
--- a/playwright/snapshots/timeline/timeline.spec.ts/event-line-inline-start-margin-irc-layout-linux.png
+++ b/playwright/snapshots/timeline/timeline.spec.ts/event-line-inline-start-margin-irc-layout-linux.png
--- a/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-and-messages-irc-layout-linux.png
+++ b/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-and-messages-irc-layout-linux.png
--- a/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-irc-layout-linux.png
+++ b/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-irc-layout-linux.png
--- a/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-modern-layout-linux.png
+++ b/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-modern-layout-linux.png
--- a/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-redaction-placeholder-linux.png
+++ b/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-redaction-placeholder-linux.png
--- a/playwright/snapshots/timeline/timeline.spec.ts/highlighted-search-results-linux.png
+++ b/playwright/snapshots/timeline/timeline.spec.ts/highlighted-search-results-linux.png
--- a/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-bubble-layout-linux.png
+++ b/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-bubble-layout-linux.png
--- a/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-irc-layout-linux.png
+++ b/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-irc-layout-linux.png
--- a/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-modern-layout-linux.png
+++ b/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-modern-layout-linux.png
--- a/playwright/snapshots/timeline/timeline.spec.ts/search-results-with-TextualEvent-linux.png
+++ b/playwright/snapshots/timeline/timeline.spec.ts/search-results-with-TextualEvent-linux.png
--- a/res/css/structures/_RoomSearch.pcss
+++ b/res/css/structures/_RoomSearch.pcss
@ -35,7 +35,7 @@ Please see LICENSE files in the repository root for full details.
    }

    .mx_RoomSearch_spotlightTriggerText {
-        color: $tertiary-content;
+        color: var(--cpd-color-text-secondary);
        flex: 1;
        min-width: 0;
        /* the following rules are to match that of a real input field */
--- a/res/css/views/messages/_TimelineSeparator.pcss
+++ b/res/css/views/messages/_TimelineSeparator.pcss
@ -12,7 +12,7 @@ Please see LICENSE files in the repository root for full details.
    display: flex;
    align-items: center;
    font: var(--cpd-font-body-md-regular);
-    color: var(--cpd-color-text-secondary);
+    color: var(--cpd-color-text-primary);
 }

 .mx_TimelineSeparator > hr {
--- a/res/themes/dark/css/_dark.pcss
+++ b/res/themes/dark/css/_dark.pcss
@ -250,7 +250,7 @@ $live-badge-color: #ffffff;
 $progressbar-bg-color: var(--cpd-color-gray-200);
 $kbd-border-color: $strong-input-border-color;
 $visual-bell-bg-color: #800;
-$event-timestamp-color: $text-secondary-color;
+$event-timestamp-color: var(--cpd-color-text-secondary);
 $composer-shadow-color: rgba(0, 0, 0, 0.28);
 $breadcrumb-placeholder-bg-color: #272c35;
 $theme-button-bg-color: #e3e8f0;
--- a/res/themes/light/css/_light.pcss
+++ b/res/themes/light/css/_light.pcss
@ -314,7 +314,7 @@ $call-light-quaternary-content: #c1c6cd;
 $progressbar-bg-color: var(--cpd-color-gray-200);
 $kbd-border-color: $strong-input-border-color;
 $visual-bell-bg-color: #faa;
-$event-timestamp-color: #acacac;
+$event-timestamp-color: var(--cpd-color-text-secondary);
 $composer-shadow-color: rgba(0, 0, 0, 0.04);
 $breadcrumb-placeholder-bg-color: #e8eef5;
 $theme-button-bg-color: $quinary-content;