mirror of
https://github.com/torproject/support.git
synced 2024-11-23 17:29:43 +00:00
Fix navs and menus
This commit is contained in:
parent
d2b758b764
commit
6d46d59281
@ -476,14 +476,36 @@ pre {
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
.hamburger .navbar-toggler {
|
||||
margin-left: 93%;
|
||||
margin-top: -10%;
|
||||
label {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.hamburger:hover .hamburger-menu {
|
||||
display: block;
|
||||
#menu-toggle {
|
||||
display: none; /* hide the checkbox */
|
||||
}
|
||||
|
||||
#nav-toggle {
|
||||
display: none; /* hide the checkbox */
|
||||
}
|
||||
|
||||
.side-toggler {
|
||||
float:right !important;
|
||||
}
|
||||
|
||||
#menu-toggle:checked + .burger-menu {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#nav-toggle:checked + .hamburger-menu {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.navbar-toggler:hover .chevron-up {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.navbar-toggler:hover .chevron-down {
|
||||
display: none;
|
||||
}
|
||||
|
||||
a.side-nav.active {
|
||||
@ -497,6 +519,7 @@ a.side-nav.active {
|
||||
.chevron {
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
margin: -10px;
|
||||
}
|
||||
|
||||
.chevron-up {
|
||||
@ -521,20 +544,4 @@ a.side-nav.active {
|
||||
|
||||
|
||||
|
||||
.burger button {
|
||||
float: right !important;
|
||||
margin-top: -50px;
|
||||
}
|
||||
|
||||
.burger:hover .burger-menu {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.burger:hover .chevron-up {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.burger:hover .chevron-down{
|
||||
display: none;
|
||||
}
|
||||
}
|
45
assets/static/bootstrap.css
vendored
45
assets/static/bootstrap.css
vendored
@ -6872,13 +6872,32 @@ pre {
|
||||
.dropdown:hover .dropdown-menu {
|
||||
display: block; }
|
||||
|
||||
.hamburger .navbar-toggler {
|
||||
margin-left: 93%;
|
||||
margin-top: -10%; }
|
||||
label {
|
||||
cursor: pointer; }
|
||||
|
||||
.hamburger:hover .hamburger-menu {
|
||||
#menu-toggle {
|
||||
display: none;
|
||||
/* hide the checkbox */ }
|
||||
|
||||
#nav-toggle {
|
||||
display: none;
|
||||
/* hide the checkbox */ }
|
||||
|
||||
.side-toggler {
|
||||
float: right !important; }
|
||||
|
||||
#menu-toggle:checked + .burger-menu {
|
||||
display: block; }
|
||||
|
||||
#nav-toggle:checked + .hamburger-menu {
|
||||
display: block; }
|
||||
|
||||
.navbar-toggler:hover .chevron-up {
|
||||
display: block !important; }
|
||||
|
||||
.navbar-toggler:hover .chevron-down {
|
||||
display: none; }
|
||||
|
||||
a.side-nav.active {
|
||||
color: #7D4698 !important; }
|
||||
|
||||
@ -6887,7 +6906,8 @@ a.side-nav.active {
|
||||
|
||||
.chevron {
|
||||
height: 50px;
|
||||
width: 50px; }
|
||||
width: 50px;
|
||||
margin: -10px; }
|
||||
|
||||
.chevron-up {
|
||||
display: none !important; }
|
||||
@ -6902,20 +6922,7 @@ a.side-nav.active {
|
||||
|
||||
nav.smalltopics {
|
||||
display: block;
|
||||
width: 100%; }
|
||||
|
||||
.burger button {
|
||||
float: right !important;
|
||||
margin-top: -50px; }
|
||||
|
||||
.burger:hover .burger-menu {
|
||||
display: block; }
|
||||
|
||||
.burger:hover .chevron-up {
|
||||
display: block !important; }
|
||||
|
||||
.burger:hover .chevron-down {
|
||||
display: none; } }
|
||||
width: 100%; } }
|
||||
/* Support Portal Styles
|
||||
*
|
||||
*/
|
||||
|
File diff suppressed because one or more lines are too long
@ -1,5 +1,6 @@
|
||||
<!doctype html>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" href="{{ '/static/bootstrap.css'|asseturl }}">
|
||||
<link rel="stylesheet" href="{{ '/static/fonts/open-iconic/font/css/open-iconic-bootstrap.css'|asseturl }}">
|
||||
|
||||
|
@ -3,39 +3,40 @@
|
||||
<img src="{{ '/static/images/tor-logo.svg' }}" >
|
||||
<span class="sr-only">Tor Logo</span>
|
||||
</a>
|
||||
<div class="container-fluid d-block hamburger">
|
||||
<button class="btn navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<label for="nav-toggle">
|
||||
<a class="btn btn-lg btn-primary navbar-toggler" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse hamburger-menu" id="navbarSupportedContent">
|
||||
<div class="justify-content-md-center mx-auto pt-2">
|
||||
<ul class="navbar-nav offset-md-2">
|
||||
{% set menubag = 'menu+' + this.alt %}
|
||||
{% for id, item in bag(menubag).items() %}
|
||||
<li{% if this.is_child_of(item.path) %} class="nav-item active" {% else %} class="nav-item"{% endif %}>
|
||||
<a class="nav-link" href="{{ item.path }}">{{ item.label }}
|
||||
{% if this.is_child_of(item.path) %}
|
||||
<span class="sr-only">(current)</span>
|
||||
{% endif %}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="mt-2 btn-group dropdown pr-2">
|
||||
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
English
|
||||
</button>
|
||||
<div class="dropdown-menu">
|
||||
<a class="dropdown-item" href="#">Spanish</a>
|
||||
<a class="dropdown-item" href="#">French</a>
|
||||
<a class="dropdown-item" href="#">Something else here</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a class="dropdown-item" href="#">Separated link</a>
|
||||
</div>
|
||||
</div>
|
||||
<a class="btn text-primary bg-white btn-light pull-right mt-2" href="https://www.torproject.org/download/download-easy.html.en"><i class="glyphicon-glyphicon-arrow-down"></i>Download Tor Browser</a>
|
||||
</a>
|
||||
</label>
|
||||
<input type="checkbox" id="nav-toggle"/>
|
||||
<div class="collapse navbar-collapse hamburger-menu" id="navbarSupportedContent">
|
||||
<div class="justify-content-md-center mx-auto pt-2">
|
||||
<ul class="navbar-nav">
|
||||
{% set menubag = 'menu+' + this.alt %}
|
||||
{% for id, item in bag(menubag).items() %}
|
||||
<li{% if this.is_child_of(item.path) %} class="nav-item active" {% else %} class="nav-item"{% endif %}>
|
||||
<a class="nav-link" href="{{ item.path }}">{{ item.label }}
|
||||
{% if this.is_child_of(item.path) %}
|
||||
<span class="sr-only">(current)</span>
|
||||
{% endif %}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="mt-2 btn-group dropdown pr-2">
|
||||
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
English
|
||||
</button>
|
||||
<div class="dropdown-menu">
|
||||
<a class="dropdown-item" href="#">Spanish</a>
|
||||
<a class="dropdown-item" href="#">French</a>
|
||||
<a class="dropdown-item" href="#">Something else here</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a class="dropdown-item" href="#">Separated link</a>
|
||||
</div>
|
||||
</div>
|
||||
<a class="btn text-primary bg-white btn-light pull-right mt-2" href="https://www.torproject.org/download/download-easy.html.en"><i class="glyphicon-glyphicon-arrow-down"></i>Download Tor Browser</a>
|
||||
</div>
|
||||
|
||||
</nav>
|
||||
|
@ -3,22 +3,23 @@
|
||||
<a class="text-primary bg-white font-weight-bold navbar-brand" href="#collapseTopicsNav">
|
||||
Topics
|
||||
</a>
|
||||
<div class="burger">
|
||||
<button class="navbar-toggler chevron" type="button" data-toggle="collapse" data-target="#navbarSupportedTopicsContent" aria-controls="navbarSupportedTopicsContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<label class="side-toggler" for="menu-toggle">
|
||||
<a class="btn btn-lg outline-primary text-primary navbar-toggler chevron" data-toggle="collapse" data-target="#navbarSupportedTopicsContent" aria-controls="navbarSupportedTopicsContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="oi oi-chevron-top chevron-up"></span>
|
||||
<span class="oi oi-chevron-bottom chevron-down"></span>
|
||||
</button>
|
||||
</a>
|
||||
</label>
|
||||
<input type="checkbox" id="menu-toggle"/>
|
||||
|
||||
<div class="collapse navbar-collapse burger-menu" id="navbarSupportedTopicsContent">
|
||||
<ul class="nav nav-pills flex-column">
|
||||
{% set topicbag = 'topics+' + this.alt %}
|
||||
{% for id, item in bag(topicbag).items() %}
|
||||
<li{% if this.is_child_of(item.path) %} class="nav-item" {% else %} class="toc-entry toc-h2 nav-item"{% endif %}>
|
||||
<a role="button" {% if this.is_child_of(item.path) %} class="side-nav active" {% else %} class="side-nav" {% endif %} href="{{ item.path }}">{{ item.label }}</a>
|
||||
</li>
|
||||
<div class="collapse navbar-collapse burger-menu" id="navbarSupportedTopicsContent">
|
||||
<ul class="nav nav-pills flex-column">
|
||||
{% set topicbag = 'topics+' + this.alt %}
|
||||
{% for id, item in bag(topicbag).items() %}
|
||||
<li{% if this.is_child_of(item.path) %} class="nav-item" {% else %} class="toc-entry toc-h2 nav-item"{% endif %}>
|
||||
<a role="button" {% if this.is_child_of(item.path) %} class="side-nav active" {% else %} class="side-nav" {% endif %} href="{{ item.path }}">{{ item.label }}</a>
|
||||
</li>
|
||||
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<hr />
|
||||
</nav>
|
||||
|
Loading…
Reference in New Issue
Block a user