mirror of https://github.com/bigchaindb/site.git
more menu tweaks
This commit is contained in:
parent
041ba7b2f8
commit
16f22fb7a6
GPG Key ID:
606EEEF3C479A91F
|
|
@ -5,6 +5,14 @@
|
|||
}
|
||||
|
||||
.dropdown-toggle {
|
||||
box-shadow: none;
|
||||
cursor: default;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
|
|
@ -22,7 +30,7 @@
|
|||
top: 100%;
|
||||
left: 0;
|
||||
z-index: 10;
|
||||
display: none;
|
||||
display: block;
|
||||
float: left;
|
||||
min-width: 10rem;
|
||||
padding: $spacer / 4 0;
|
||||
|
|
@ -39,6 +47,10 @@
|
|||
max-height: 20rem;
|
||||
overflow-y: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
transition: .2s $timing-bounce;
|
||||
opacity: 0;
|
||||
transform: scale(1, 0);
|
||||
transform-origin: top;
|
||||
|
||||
@media (max-width: 27rem), (max-height: 27rem) {
|
||||
max-height: 11.25rem;
|
||||
|
|
@ -73,7 +85,8 @@
|
|||
|
||||
.dropdown-menu.show,
|
||||
.dropdown:hover > .dropdown-menu {
|
||||
display: block;
|
||||
transform: scale(1, 1);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.dropdown > .dropdown-toggle:active {
|
||||
|
|
|
|||
|
|
@ -161,6 +161,7 @@
|
|||
@media ($screen-md) {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -17,9 +17,7 @@
|
|||
|
||||
.select2-selection__placeholder {
|
||||
color: #999;
|
||||
|
||||
margin-top: 5px;
|
||||
|
||||
float: left;
|
||||
}
|
||||
|
||||
|
|
@ -33,13 +31,10 @@
|
|||
|
||||
.select2-selection__choice {
|
||||
background-color: #e4e4e4;
|
||||
|
||||
border: 1px solid #aaa;
|
||||
border-radius: 4px;
|
||||
cursor: default;
|
||||
|
||||
float: left;
|
||||
|
||||
margin-right: 5px;
|
||||
margin-top: 5px;
|
||||
padding: 0 5px;
|
||||
|
|
@ -48,10 +43,8 @@
|
|||
.select2-selection__choice__remove {
|
||||
color: #999;
|
||||
cursor: pointer;
|
||||
|
||||
display: inline-block;
|
||||
font-weight: $font-weight-bold;
|
||||
|
||||
margin-right: 2px;
|
||||
|
||||
&:hover {
|
||||
|
|
|
|||
|
|
@ -19,7 +19,18 @@
|
|||
{% assign active = 'active' %}
|
||||
{% endif %}
|
||||
|
||||
{% unless link.items %}
|
||||
<a class="menu__link {{ active }} js-tracking-menu" href="{{ link.url }}">{{ link.title }}</a>
|
||||
{% endunless %}
|
||||
|
||||
{% for item in link.items %}
|
||||
{% assign active = nil %}
|
||||
{% if page.url contains item.url %}
|
||||
{% assign active = 'active' %}
|
||||
{% endif %}
|
||||
|
||||
<a class="menu__link menu__link--secondary {{ active }} js-tracking-menu" href="{{ item.url }}">{{ item.title }}</a>
|
||||
{% endfor %}
|
||||
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
|
@ -34,7 +45,6 @@
|
|||
|
||||
<a class="menu__link {{ active }} js-tracking-menu" href="{{ link.url }}">{{ link.title }}</a>
|
||||
|
||||
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -19,39 +19,37 @@
|
|||
|
||||
<div class="grid__col grid__col--4">
|
||||
|
||||
<div class="menu-overflow">
|
||||
{% for link in site.data.menus.main %}
|
||||
{% for link in site.data.menus.main %}
|
||||
|
||||
{% assign active = nil %}
|
||||
{% if page.url contains link.url %}
|
||||
{% assign active = 'active' %}
|
||||
{% endif %}
|
||||
{% assign active = nil %}
|
||||
{% if page.url contains link.url %}
|
||||
{% assign active = 'active' %}
|
||||
{% endif %}
|
||||
|
||||
{% if link.items %}
|
||||
<div class="dropdown">
|
||||
<a class="menu__link {{ active }} js-tracking-menu dropdown-toggle"
|
||||
data-toggle="dropdown"
|
||||
aria-haspopup="true"
|
||||
aria-expanded="false"
|
||||
id="dropdownMenuButton"
|
||||
href="{{ link.url }}">{{ link.title }}
|
||||
</a>
|
||||
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
|
||||
{% for item in link.items %}
|
||||
{% assign active = nil %}
|
||||
{% if page.url contains item.url %}
|
||||
{% assign active = 'active' %}
|
||||
{% endif %}
|
||||
<a class="dropdown-item {{ active }}" href="{{ item.url }}">{{ item.title }}</a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% if link.items %}
|
||||
<div class="dropdown dropdown--hover">
|
||||
<a class="menu__link {{ active }} js-tracking-menu dropdown-toggle"
|
||||
data-toggle="dropdown"
|
||||
aria-haspopup="true"
|
||||
aria-expanded="false"
|
||||
id="dropdownMenuButton"
|
||||
href="{{ link.url }}">{{ link.title }}
|
||||
</a>
|
||||
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
|
||||
{% for item in link.items %}
|
||||
{% assign active = nil %}
|
||||
{% if page.url contains item.url %}
|
||||
{% assign active = 'active' %}
|
||||
{% endif %}
|
||||
<a class="dropdown-item {{ active }}" href="{{ item.url }}">{{ item.title }}</a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
<a class="menu__link {{ active }} js-tracking-menu" href="{{ link.url }}">{{ link.title }}</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% else %}
|
||||
<a class="menu__link {{ active }} js-tracking-menu" href="{{ link.url }}">{{ link.title }}</a>
|
||||
{% endif %}
|
||||
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -325,9 +325,9 @@ Logo can be used with a base class and modifier classes for size & color:
|
|||
### Dropdowns
|
||||
|
||||
<div class="dropdown">
|
||||
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
Dropdown button
|
||||
</button>
|
||||
<a class="dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
Hover me
|
||||
</a>
|
||||
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
|
||||
<a class="dropdown-item" href="#">Action</a>
|
||||
<a class="dropdown-item" href="#">Another action</a>
|
||||
|
|
|
|||
Loading…
Reference in New Issue