Bug 195018 - Web Inspector: Dark Mode: unreadable text in bezier curve editor numeric input fields
Summary: Web Inspector: Dark Mode: unreadable text in bezier curve editor numeric inpu...
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Web Inspector (show other bugs)
Version: WebKit Nightly Build
Hardware: All All
: P3 Normal
Assignee: Devin Rousso
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2019-02-25 14:48 PST by Matt Baker
Modified: 2019-02-27 13:25 PST (History)
5 users (show)

See Also:


Attachments
[Image] Dark Mode - curve editor (1010.71 KB, image/png)
2019-02-25 14:48 PST, Matt Baker
no flags Details
Patch (6.78 KB, patch)
2019-02-27 11:36 PST, Devin Rousso
no flags Details | Formatted Diff | Diff
[Image] After Patch is applied (48.80 KB, image/png)
2019-02-27 11:36 PST, Devin Rousso
no flags Details
Patch (6.89 KB, patch)
2019-02-27 12:58 PST, Devin Rousso
no flags Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Matt Baker 2019-02-25 14:48:51 PST
Created attachment 362928 [details]
[Image] Dark Mode - curve editor

See attached screenshot.
Comment 1 Radar WebKit Bug Importer 2019-02-25 14:49:37 PST
<rdar://problem/48378541>
Comment 2 Devin Rousso 2019-02-27 11:36:43 PST
Created attachment 363109 [details]
Patch
Comment 3 Devin Rousso 2019-02-27 11:36:59 PST
Created attachment 363110 [details]
[Image] After Patch is applied
Comment 4 Nikita Vasilyev 2019-02-27 11:50:53 PST
(In reply to Devin Rousso from comment #3)
> Created attachment 363110 [details]
> [Image] After Patch is applied

The up and down buttons are still light. It's a WebKit bug.
I don't think we can (or should) do anything here with CSS.
Comment 5 Nikita Vasilyev 2019-02-27 12:09:54 PST
Comment on attachment 363109 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=363109&action=review

This fixes the bug and includes some nice refactoring!

> Source/WebInspectorUI/UserInterface/Views/BezierEditor.css:-139
> -    border-radius: 4px;
> -    box-shadow: inset 0 0 1px 1px hsl(0, 0%, 89%);

You changed the style of the inputs. They look fine but it would be nice to mention it in the changelog because I could've missed it.

> Source/WebInspectorUI/UserInterface/Views/BezierEditor.css:-180
> -@media (prefers-color-scheme: dark) {
> -    .bezier-editor > .bezier-preview-timing {
> -        border-top-color: var(--text-color-tertiary);
> -    }
> -
> -    .bezier-editor > .bezier-container .bezier-curve {
> -        stroke: white;
> -    }
> -
> -    .bezier-editor > .bezier-container .linear-curve {
> -        stroke: var(--text-color-tertiary);
> -    }
> -
> -    .bezier-editor > .bezier-preview {
> -        border-bottom-color: var(--text-color-tertiary);
> -    }
> -
> -    .bezier-editor > .bezier-preview > div {
> -        background-color: var(--glyph-color-active);
> -    }
> -
> -    .bezier-editor > .bezier-container .control-handle {
> -        fill: var(--glyph-color-active);
> -    }
> -
> -    .bezier-editor > .bezier-container .control-line {
> -        stroke: var(--glyph-color-active);
> -    }

Nice! There are many `@media (prefers-color-scheme: dark)` sections that could be refactored fairly straightforwardly.
Comment 6 Matt Baker 2019-02-27 12:24:04 PST
Comment on attachment 363109 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=363109&action=review

r=me

>> Source/WebInspectorUI/UserInterface/Views/BezierEditor.css:-139
>> -    box-shadow: inset 0 0 1px 1px hsl(0, 0%, 89%);
> 
> You changed the style of the inputs. They look fine but it would be nice to mention it in the changelog because I could've missed it.

It's a simple enough patch, but I agree that only mentioning the clean-up and not the main fix is confusing.
Comment 7 Devin Rousso 2019-02-27 12:58:24 PST
Created attachment 363118 [details]
Patch
Comment 8 WebKit Commit Bot 2019-02-27 13:24:58 PST
Comment on attachment 363118 [details]
Patch

Clearing flags on attachment: 363118

Committed r242151: <https://trac.webkit.org/changeset/242151>
Comment 9 WebKit Commit Bot 2019-02-27 13:25:00 PST
All reviewed patches have been landed.  Closing bug.