DesignSafe-CI / DS-User-Guide

User Guide for DesignSafe
https://www.designsafe-ci.org/user-guide/
0 stars 8 forks source link

Top-Level and 2nd-Level Nav Items Not Distinct #75

Open wesleyboar opened 3 weeks ago

wesleyboar commented 3 weeks ago

Problem

Top-level nav items look the same as 2nd-level nav items that are active or open:

Examples

sans 3rd-level with 3rd-level
DS GH-75 b DS GH-75 a

[!NOTE] The original design would only have this problem for 2nd-level items that do not have 3rd-level items. The problem exists on TACC-Docs also.

Screenshots | original design | problem on TACC | | - | - | | DS GH-75 design | DS GH-75 on TACC |
wesleyboar commented 3 weeks ago

@silviamazzoni, does this accurately describe a problem you reported to me?

wesleyboar commented 3 weeks ago

Solutions

❌ A. Increase Size of Top-Level Nav

From 14px to whatever the next size font up is.

a b c
DS GH-75 fix a DS GH-75 fix b DS GH-75 fix TACC

✅ B. Use Different UI for Active State

Use something else e.g. text color or background color of text item.

  1. Highlight the active area, like background color around that nav element?
  2. Swap all nav text color to something else (slightly off black, or something along those lines), then keep the title black. — M.S.