First pass at sub-bar redesign. #1245
Conversation
| <span | ||
| className="sub-bar__button" | ||
| onClick={onPopOutProject} | ||
| >Full screen</span> |
There was a problem hiding this comment.
I find the icons more usable here (the eye finds what it’s looking for more quickly if it doesn’t have to read the words). And I have never noticed students finding them unintuitive. Have you?
There was a problem hiding this comment.
Just looking for ways to increase overall clarity and discoverability. Anecdotally I see a lot of students don't know that those icons are even actions at all, let alone what they do. Would you be averse to icon + text?
| @@ -71,6 +71,7 @@ | |||
| :root { | |||
| --color-low-contrast-gray: #eee; | |||
| --color-chrome: #e2e2e2; | |||
| --color-border: #bbb; | |||
There was a problem hiding this comment.
do we really need another gray tone?
There was a problem hiding this comment.
I'd say yes. I tried the existing ones but they looked ugly and too pronounced.
|
|
||
| .sub-bar { | ||
| box-shadow: var(--box-shadow); | ||
| font-size: var(--font-size-menu); |
There was a problem hiding this comment.
I think we need a new name for this font size variable!
There was a problem hiding this comment.
Perhaps. It's becoming a general goto "base" font-size.
| border-left: 0.1em solid var(--color-border); | ||
| padding: 0 1em; | ||
| height: var(--size-sub-bar); | ||
| line-height: var(--size-sub-bar); |
There was a problem hiding this comment.
Can we not use percentages here?
| @@ -566,11 +583,16 @@ body { | |||
| /** @define notification-list */ | |||
|
|
|||
| .notification-list__notification { | |||
| margin: 0.2rem 0; | |||
| font-size: var(--font-size-menu); | |||
There was a problem hiding this comment.
This seems unrelated to the other stuff in here?
There was a problem hiding this comment.
Somewhat. Kinda rolling it into general "chrome/menu/etc." design tweaks to reign in the sizing and spacing of everything and make things look more standard. Would you be totally averse to keeping it in here?
|
Made some comments. Will shoot over changes soon. But any thoughts on how to fix those errors? I don't see how that's not valid BEM syntax. |
|
@iamnickvolpe ah sorry I forgot to address that originally—you just have a typo in the |
|
@iamnickvolpe any interest in picking this back up? would love to see these designs give a little bit of a “fresh new look” for the new school year! |
This is the first part of a story to add some more functionality to editor labels, which includes a notification about poorly-formatted code and the ability to fix it.