Show HN: Vue Dark Mode – A Minimalist Dark Design System for Vue.js

Re:Show HN: Vue Dark Mode – A Minimalist Dark Design System ... by darekkay on Thursday November 01, 2018 @12:45PM (#18355856)

Please, please don't make your UI components unaccessible by removing the focus ring("outline: 0"). You're basically excluding all keyboard users from using your widgets, because I simply cannot tell which element is currently focussed.

If you really find the default browser focus ring ugly, feel free to style it or provide another alternative (like a box shadow).

[ Parent | on HN ]

Re:Show HN: Vue Dark Mode – A Minimalist Dark Design System ... by wulfmann on Thursday November 01, 2018 @02:19PM (#18356841)

I don't understand what you mean. It's just using border instead of outline. It would still show as active if focus is from a keyboard. The changes are not tied to click events.

[ Parent | on HN ]

Re:Show HN: Vue Dark Mode – A Minimalist Dark Design System ... by detaro on Thursday November 01, 2018 @02:22PM (#18356868)

Most of the elements do not change visually at all when tabbed to?

[ Parent | on HN ]

Re:Show HN: Vue Dark Mode – A Minimalist Dark Design System ... by wulfmann on Thursday November 01, 2018 @02:23PM (#18356884)

That's a browser implementation and an html issue. They're just displaying the items here, not putting them in a true form.

If you put these components into a <form> tab would work fine. The :focus state would still happen, and that's what's styled.

edit: I see what you're saying. I was only looking at form inputs, but i see no focus state on buttons as you said.

[ Parent | on HN ]

Re:Show HN: Vue Dark Mode – A Minimalist Dark Design System ... by sbr464 on Thursday November 01, 2018 @02:19PM (#18356836)

I agree also. Another method, albeit more advanced, is an option to not show on mouse clicks, and do show when using the keyboard or cycling through tab indexes etc.

[ Parent | on HN ]

Re:Show HN: Vue Dark Mode – A Minimalist Dark Design System ... by LeCoupa on Saturday November 03, 2018 @09:45AM (#18370127)

You're right. I just fixed this. :-)

[ Parent | on HN ]