atom / settings-view

🔧 Edit Atom settings
MIT License
273 stars 275 forks source link

Settings > Breadcrumb Sticky to Increase UX #1097

Closed ipaintcode closed 5 years ago

ipaintcode commented 5 years ago

Summary

Making the Settings > Breadcrumb navigation sticky for better UX and faster navigating.

Motivation

Coders and Designers that code have busy lives and any chances to save time to increase our velocity are always welcome; even in our IDE/Text Editor of choice. When looking for a new Setting or reading documentation from within Atom, having the ability to navigate back to a list or search view saves those extra seconds to our already busy day.

Describe alternatives you've considered

An alternative would be adding the CSS into Atom's custom stylesheet but having this native so everyone can benefit from nicer UX is always a win-win.

Additional context

I added a gif to demo the feature request to Atom's Core UI

Pseudo CSS

.settings-view .breadcrumb {
  position: fixed;
  z-index: 1;
  background-color: #282c34;
  width: 100%;
  border-bottom: 1px solid #181a1f;
}

.settings-view .section {
  margin-top: 5rem;
}

Gif Example Improving Navigation UX

ezgif-5-5088924807b3

simurai commented 5 years ago

@ipaintcode thanks for the issue. 🙇 You could click on the navigation on the left to go back, but I agree that some users might still want to click the breadcrumbs instead. I made a new PR #1105 with mostly your changes.