|
1 | 1 | {% capture logo_path %}{{ site.logo }}{% endcapture %}
|
2 | 2 |
|
3 | 3 | <div class="masthead">
|
4 |
| - <div class="masthead__inner-wrap"> |
5 |
| - <div class="masthead__menu"> |
6 |
| - <nav id="site-nav" class="nav__topbar" aria-label="Top Bar"> |
7 |
| - <!-- More accessible as a screen reader will group the title and image in the same link --> |
8 |
| - {% unless logo_path == empty %} |
9 |
| - <a class="site-logo" href="{{ '/' | relative_url }}"> |
10 |
| - <img src="{{ logo_path | relative_url }}" alt="Welcome to the pyOpenSci website. The pyOpenSci logo is a purple flower opening over the O (for open)."> |
11 |
| - </a> |
12 |
| - {% endunless %} |
| 4 | + <nav id="site-nav" class="masthead__menu" aria-label="Top Bar"> |
| 5 | + <!-- More accessible as a screen reader will group the title and image in the same link --> |
| 6 | + {% unless logo_path == empty %} |
| 7 | + <a class="site-logo" href="{{ '/' | relative_url }}"> |
| 8 | + <img src="{{ logo_path | relative_url }}" alt="Welcome to the pyOpenSci website. The pyOpenSci logo is a purple flower opening over the O (for open)."> |
| 9 | + </a> |
| 10 | + {% endunless %} |
13 | 11 |
|
14 |
| - <ul class="nav__links"> |
15 |
| - {%- for alink in site.data.navigation.main -%} |
16 |
| - <!-- If there are sub links drop down nav to display --> |
17 |
| - {% if alink.sub-nav %} |
18 |
| - <li class="dropdown"> |
19 |
| - <button class="dropbtn" tabindex="0" aria-expanded="false">{{ alink.title }} <i class="fas fa-caret-down"></i> |
20 |
| - </button> |
21 |
| - <ul class="dropdown-content"> |
22 |
| - {% for subnav in alink.sub-nav %} |
23 |
| - <li> |
24 |
| - <a href="{{ subnav.url | relative_url }}" class="masthead__menu-item hover-underline">{{ subnav.title }} |
25 |
| - {% if subnav.icon %} <i class="{{ subnav.icon }}"></i> {% endif %} |
26 |
| - </a> |
27 |
| - </li> |
28 |
| - {% endfor %} |
29 |
| - </ul> |
30 |
| - </li> |
31 |
| - {% else %} |
| 12 | + <div class="spacer"></div> |
| 13 | + |
| 14 | + <ul class="nav__links"> |
| 15 | + {%- for alink in site.data.navigation.main -%} |
| 16 | + <!-- If there are sub links drop down nav to display --> |
| 17 | + {% if alink.sub-nav %} |
| 18 | + <li class="dropdown"> |
| 19 | + <button class="dropbtn" tabindex="0" aria-expanded="false"> |
| 20 | + {{ alink.title }} <i class="fas fa-caret-down"></i> |
| 21 | + </button> |
| 22 | + <ul class="dropdown-content"> |
| 23 | + {% for subnav in alink.sub-nav %} |
32 | 24 | <li>
|
33 |
| - <a href="{{ alink.url | relative_url }}" class="hover-underline">{{ alink.title }}</a> |
| 25 | + <a |
| 26 | + href="{{ subnav.url | relative_url }}" |
| 27 | + class="masthead__menu-item hover-underline" |
| 28 | + >{{ subnav.title }} |
| 29 | + {% if subnav.icon %} |
| 30 | + <i class="{{ subnav.icon }}"></i> |
| 31 | + {% endif %} |
| 32 | + </a> |
34 | 33 | </li>
|
35 |
| - {% endif %} |
36 |
| - {% endfor %} |
37 |
| - <li> |
38 |
| - |
39 |
| - </li> |
40 |
| - </ul> |
41 |
| - |
42 |
| - {% if site.search == true %} |
43 |
| - <button class="search__toggle" type="button"> |
44 |
| - <span class="visually-hidden">{{ site.data.ui-text[site.locale].search_label | default: "Toggle search" }}</span> |
45 |
| - <i class="fas fa-search"></i> |
46 |
| - </button> |
47 |
| - {% endif %} |
| 34 | + {% endfor %} |
| 35 | + </ul> |
| 36 | + </li> |
| 37 | + {% else %} |
| 38 | + <li> |
| 39 | + <a href="{{ alink.url | relative_url }}" class="hover-underline"> |
| 40 | + {{ alink.title }} |
| 41 | + </a> |
| 42 | + </li> |
| 43 | + {% endif %} |
| 44 | + {% endfor %} |
| 45 | + </ul> |
48 | 46 |
|
| 47 | + {% if site.search == true %} |
| 48 | + <button class="search__toggle" type="button"> |
| 49 | + <span class="visually-hidden">{{ site.data.ui-text[site.locale].search_label | default: "Toggle search" }}</span> |
| 50 | + <i class="fas fa-search"></i> |
| 51 | + </button> |
| 52 | + {% endif %} |
49 | 53 |
|
50 |
| - <ul class="hidden-links hidden"></ul> |
51 |
| - <!-- Burger button - span class for screen readers--> |
52 |
| - <button class="hamburger__btn-toggle" type="button" count="1" aria-expanded="false"> |
53 |
| - <span class="visually-hidden">Toggle top navigation menu</span> <!--screen readers--> |
54 |
| - <div class="burger__icon"></div> |
55 |
| - </button> |
56 |
| - </nav> |
57 |
| - </div> |
58 |
| - </div> |
59 |
| - </div> |
| 54 | + <ul class="hidden-links hidden"></ul> |
| 55 | + <!-- Burger button - span class for screen readers--> |
| 56 | + <button class="hamburger__btn-toggle" type="button" count="1" aria-expanded="false"> |
| 57 | + <span class="visually-hidden">Toggle top navigation menu</span> <!--screen readers--> |
| 58 | + <div class="burger__icon"></div> |
| 59 | + </button> |
| 60 | + </nav> |
| 61 | +</div> |
0 commit comments