mirror of https://github.com/rancher/ui.git
Stuff
This commit is contained in:
Vincent Fiduccia
parent
8e1ac47e2c
commit
169dfd3366
|
|
@ -36,6 +36,8 @@ export default Ember.Component.extend(HoverDropdown, {
|
|||
mesosReady : Ember.computed.alias('projects.orchestrationState.mesosReady'),
|
||||
isCaas : Ember.computed.equal('app.mode',C.MODE.CAAS),
|
||||
isOss : Ember.computed.equal('app.mode',C.MODE.OSS),
|
||||
accessEnabled : Ember.computed.alias('access.enabled'),
|
||||
|
||||
stacks : null,
|
||||
|
||||
// Component options
|
||||
|
|
|
|||
|
|
@ -82,35 +82,37 @@
|
|||
{{/each}}
|
||||
</ul>
|
||||
|
||||
<div class="dropdown nav-user">
|
||||
<button class="btn bg-primary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
|
||||
{{#if accessEnabled}}
|
||||
{{identity-avatar link=false identity=access.identity}}
|
||||
{{else}}
|
||||
<div class="gh-avatar">
|
||||
<div class="gh-placeholder">
|
||||
<i class="icon icon-user"></i>
|
||||
<ul class="nav-user dropdown">
|
||||
<li>
|
||||
<a class="btn bg-primary dropdown-toggle" role="button" aria-haspopup="true" aria-expanded="false" aria-label={{t 'nav.user.label' username=session.user}}>
|
||||
{{#if accessEnabled}}
|
||||
{{identity-avatar link=false identity=access.identity}}
|
||||
{{else}}
|
||||
<div class="gh-avatar">
|
||||
<div class="gh-placeholder">
|
||||
<i class="icon icon-user"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
<span class="sr-only">{{t 'nav.srToggleDropdown'}}</span>
|
||||
<i class="icon icon-chevron-down"></i>
|
||||
</button>
|
||||
{{/if}}
|
||||
<span class="sr-only">{{t 'nav.srToggleDropdown'}}</span>
|
||||
<i class="icon icon-chevron-down"></i>
|
||||
</a>
|
||||
|
||||
<ul class="dropdown-menu dropdown-menu-right" data-dropdown-id="header-user-menu">
|
||||
r {{#if accessEnabled}}
|
||||
<li role="presentation" class="user-auth">
|
||||
{{identity-block avatar=false identity=access.identity}}
|
||||
{{#link-to "logout" class="user-logout"}}<i class="icon icon-logout"></i> {{t 'nav.user.logout'}}{{/link-to}}
|
||||
</li>
|
||||
{{/if}}
|
||||
<ul class="dropdown-menu dropdown-menu-right" data-dropdown-id="header-user-menu">
|
||||
{{#if accessEnabled}}
|
||||
<li role="presentation" class="user-auth">
|
||||
{{identity-block avatar=false identity=access.identity}}
|
||||
</li>
|
||||
{{/if}}
|
||||
|
||||
<li><a href="#"></a></li>
|
||||
<li><a href="#">Something else here</a></li>
|
||||
<li role="separator" class="divider"></li>
|
||||
{{#link-to "logout" class="user-logout"}}<i class="icon icon-logout"></i> {{t 'nav.user.logout'}}{{/link-to}}
|
||||
</ul>
|
||||
</div>
|
||||
<li role="separator" class="divider"></li>
|
||||
<li><a href="#">Settings</a></li>
|
||||
<li><a href="#">Billing</a></li>
|
||||
<li role="separator" class="divider"></li>
|
||||
{{#link-to "logout" class="user-logout"}}<i class="icon icon-logout"></i> {{t 'nav.user.logout'}}{{/link-to}}
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
{{#if (and projects.current (not hosts.length))}}
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import Ember from 'ember';
|
|||
export default Ember.Helper.extend({
|
||||
intl: Ember.inject.service(),
|
||||
|
||||
compute(params, options) {
|
||||
compute(params) {
|
||||
let key = params[0];
|
||||
let fallback = params[1];
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
import Ember from 'ember';
|
||||
import C from 'ui/utils/constants';
|
||||
import { positionDropdown } from 'ui/utils/position-dropdown';
|
||||
|
||||
const DROPDOWNCLOSETIMER = 250;
|
||||
const PARENT = 'HEADER NAV';
|
||||
|
|
@ -228,7 +229,12 @@ export default Ember.Mixin.create({
|
|||
if (body.hasClass('touch')) {
|
||||
Ember.$('BODY').addClass('nav-dropdown-open');
|
||||
}
|
||||
|
||||
drpd.addClass('invisible');
|
||||
drpd.addClass('block');
|
||||
positionDropdown(drpd, el, drpd.hasClass('dropdown-menu-right'));
|
||||
drpd.removeClass('invisible');
|
||||
|
||||
if (el.attr('aria-expanded')) {
|
||||
el.attr('aria-expanded', true);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -65,6 +65,7 @@
|
|||
// @import "app/styles/totrash/components/dropdown"; //from bootstrap
|
||||
@import "app/styles/components/badge-state";
|
||||
@import "app/styles/components/page-header";
|
||||
@import "app/styles/components/dropdown";
|
||||
|
||||
//******************************************
|
||||
// Pages
|
||||
|
|
|
|||
|
|
@ -0,0 +1,79 @@
|
|||
// The dropdown wrapper (div)
|
||||
.dropup,
|
||||
.dropdown {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
// The dropdown menu (ul)
|
||||
.dropdown-menu {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
display: none; // none by default, but block on "open" of the menu
|
||||
float: left;
|
||||
min-width: 160px;
|
||||
padding: 5px 0;
|
||||
margin: 2px 0 0; // override default ul
|
||||
list-style: none;
|
||||
text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)
|
||||
background-color: $dropdown-bg;
|
||||
border: 1px solid $dropdown-border; // IE8 fallback
|
||||
border: 1px solid $dropdown-border;
|
||||
background-clip: padding-box;
|
||||
|
||||
// Links within the dropdown menu
|
||||
> li > a {
|
||||
display: block;
|
||||
padding: 3px 20px;
|
||||
clear: both;
|
||||
font-weight: normal;
|
||||
color: $dropdown-link-color;
|
||||
white-space: nowrap; // prevent links from randomly breaking onto new lines
|
||||
|
||||
// Hover/Focus state
|
||||
&:hover,
|
||||
&:focus {
|
||||
text-decoration: none;
|
||||
color: $dropdown-link-hover-color;
|
||||
background-color: $dropdown-link-hover-bg;
|
||||
}
|
||||
}
|
||||
|
||||
// Active state
|
||||
> .active > a {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $dropdown-link-active-color;
|
||||
text-decoration: none;
|
||||
outline: 0;
|
||||
background-color: $dropdown-link-active-bg;
|
||||
}
|
||||
}
|
||||
|
||||
// Disabled state
|
||||
//
|
||||
// Gray out text and ensure the hover/focus state remains gray
|
||||
> .disabled > a {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $dropdown-link-disabled-color;
|
||||
}
|
||||
|
||||
// Nuke hover/focus effects
|
||||
&:hover,
|
||||
&:focus {
|
||||
text-decoration: none;
|
||||
background-color: transparent;
|
||||
// cursor: @cursor-disabled;
|
||||
}
|
||||
}
|
||||
|
||||
.divider {
|
||||
margin-top: 2px;
|
||||
margin-bottom: 3px;
|
||||
border-top: 1px solid $dropdown-divider-bg;
|
||||
}
|
||||
}
|
||||
|
|
@ -35,7 +35,6 @@
|
|||
@import "app/styles/lacsso/components/button";
|
||||
@import "app/styles/lacsso/components/banners";
|
||||
@import "app/styles/lacsso/components/badges";
|
||||
@import "app/styles/lacsso/components/dropdowns";
|
||||
@import "app/styles/lacsso/components/tables";
|
||||
@import "app/styles/lacsso/components/tabs";
|
||||
@import "app/styles/lacsso/components/tooltip";
|
||||
|
|
|
|||
|
|
@ -153,3 +153,35 @@
|
|||
.clip { @include clip }
|
||||
.force-wrap { @include force-wrap }
|
||||
|
||||
// Only display content to screen readers
|
||||
//
|
||||
// See: http://a11yproject.com/posts/how-to-hide-content
|
||||
.sr-only {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
clip: rect(0,0,0,0);
|
||||
border: 0;
|
||||
}
|
||||
|
||||
// Use in conjunction with .sr-only to only display content when it's focused.
|
||||
// Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
|
||||
// Credit: HTML5 Boilerplate
|
||||
.sr-only-focusable {
|
||||
&:active,
|
||||
&:focus {
|
||||
position: static;
|
||||
width: auto;
|
||||
height: auto;
|
||||
margin: 0;
|
||||
overflow: visible;
|
||||
clip: auto;
|
||||
}
|
||||
}
|
||||
|
||||
[role="button"] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,88 +0,0 @@
|
|||
// The dropdown wrapper (div)
|
||||
.dropup,
|
||||
.dropdown {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
// The dropdown menu (ul)
|
||||
.dropdown-menu {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
display: none; // none by default, but block on "open" of the menu
|
||||
float: left;
|
||||
min-width: 160px;
|
||||
padding: 5px 0;
|
||||
margin: 2px 0 0; // override default ul
|
||||
list-style: none;
|
||||
text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)
|
||||
background-color: $light-grey;
|
||||
border: 1px solid $light-grey; // IE8 fallback
|
||||
border: 1px solid $light-grey;
|
||||
background-clip: padding-box;
|
||||
|
||||
// Links within the dropdown menu
|
||||
> li > a {
|
||||
display: block;
|
||||
padding: 3px 20px;
|
||||
clear: both;
|
||||
font-weight: normal;
|
||||
color: $primary;
|
||||
white-space: nowrap; // prevent links from randomly breaking onto new lines
|
||||
}
|
||||
}
|
||||
|
||||
// Hover/Focus state
|
||||
.dropdown-menu > li > a {
|
||||
&:hover,
|
||||
&:focus {
|
||||
text-decoration: none;
|
||||
color: $primary;
|
||||
background-color: $primary;
|
||||
}
|
||||
}
|
||||
|
||||
// Active state
|
||||
.dropdown-menu > .active > a {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $secondary;
|
||||
text-decoration: none;
|
||||
outline: 0;
|
||||
background-color: $mid-grey;
|
||||
}
|
||||
}
|
||||
|
||||
// Disabled state
|
||||
//
|
||||
// Gray out text and ensure the hover/focus state remains gray
|
||||
|
||||
.dropdown-menu > .disabled > a {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $mid-grey;
|
||||
}
|
||||
|
||||
// Nuke hover/focus effects
|
||||
&:hover,
|
||||
&:focus {
|
||||
text-decoration: none;
|
||||
background-color: transparent;
|
||||
// cursor: @cursor-disabled;
|
||||
}
|
||||
}
|
||||
|
||||
// // Open state for the dropdown
|
||||
// .open {
|
||||
// // Show the menu
|
||||
// > .dropdown-menu {
|
||||
// display: block;
|
||||
// }
|
||||
|
||||
// // Remove the outline when :focus is triggered
|
||||
// > a {
|
||||
// outline: 0;
|
||||
// }
|
||||
// }
|
||||
|
|
@ -1,8 +1,19 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="44px" height="21pt" viewBox="227 24 330 150" version="1.1">
|
||||
<g id="surface1">
|
||||
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 553.601562 60.40625 L 550.085938 39.308594 C 548.957031 32.535156 546.320312 26.992188 544.222656 26.992188 C 542.125 26.992188 540.410156 32.609375 540.410156 39.476562 L 540.410156 44.992188 C 540.410156 51.859375 534.792969 57.476562 527.925781 57.476562 L 522.414062 57.476562 C 522.011719 57.476562 521.617188 57.492188 521.226562 57.515625 L 521.226562 72.683594 C 521.617188 72.703125 522.011719 72.71875 522.414062 72.71875 L 543.167969 72.71875 C 550.035156 72.71875 554.730469 67.179688 553.601562 60.40625 "/>
|
||||
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 516.328125 58.453125 C 512.519531 59.765625 509.929688 62.253906 509.929688 65.097656 C 509.929688 67.941406 512.519531 70.433594 516.328125 71.742188 Z "/>
|
||||
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 503.84375 42.546875 L 470.1875 42.546875 C 469.90625 42.546875 469.632812 42.570312 469.359375 42.589844 L 434.808594 42.589844 C 434.402344 42.589844 434.007812 42.628906 433.617188 42.691406 L 433.617188 39.476562 C 433.617188 32.609375 431.902344 26.992188 429.808594 26.992188 C 427.710938 26.992188 425.074219 32.535156 423.945312 39.308594 L 420.429688 60.40625 C 419.300781 67.175781 423.996094 72.71875 430.859375 72.71875 L 451.617188 72.71875 C 453.753906 72.71875 455.773438 72.386719 457.535156 71.800781 C 456.875 75.339844 453.777344 78.019531 450.050781 78.019531 L 420.941406 78.019531 C 416.230469 78.019531 412.648438 73.789062 413.421875 69.144531 L 416.371094 51.464844 C 417.144531 46.816406 413.5625 42.589844 408.855469 42.589844 L 263.992188 42.589844 C 260.90625 42.589844 258.253906 44.425781 257.054688 47.066406 L 229.773438 88.566406 C 229.308594 89.269531 229.367188 90.191406 229.910156 90.835938 L 235.203125 97.085938 C 235.867188 97.867188 237.027344 97.984375 237.828125 97.351562 L 256.371094 82.71875 L 256.371094 171.511719 C 256.371094 175.71875 259.78125 179.132812 263.992188 179.132812 L 305.117188 179.132812 C 309.328125 179.132812 312.738281 175.71875 312.738281 171.511719 L 312.738281 140.632812 C 312.738281 136.421875 316.152344 133.011719 320.359375 133.011719 L 423.027344 133.011719 C 427.234375 133.011719 430.648438 136.421875 430.648438 140.632812 L 430.648438 171.511719 C 430.648438 175.71875 434.058594 179.132812 438.269531 179.132812 L 479.394531 179.132812 C 483.601562 179.132812 487.015625 175.71875 487.015625 171.511719 L 487.015625 138.28125 L 465.171875 138.28125 C 458.308594 138.28125 452.691406 132.660156 452.691406 125.796875 L 452.691406 104.425781 C 452.691406 100.359375 454.667969 96.742188 457.703125 94.460938 L 457.703125 119.964844 C 457.703125 126.832031 463.320312 132.449219 470.1875 132.449219 L 503.84375 132.449219 C 510.710938 132.449219 516.328125 126.832031 516.328125 119.964844 L 516.328125 55.03125 C 516.328125 48.164062 510.710938 42.546875 503.84375 42.546875 "/>
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 70.1 32.9" style="enable-background:new 0 0 70.1 32.9;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#0876A9;}
|
||||
</style>
|
||||
<g id="Group_293" transform="translate(0.011)">
|
||||
<path id="Path_423" class="st0" d="M70.1,7.2l-0.8-4.6C69.1,1.2,68.5,0,68,0c-0.5,0-0.8,1.2-0.8,2.7v1.2c0,1.5-1.2,2.7-2.7,2.7
|
||||
h-1.5v3.3h4.7c1.2,0,2.3-0.9,2.3-2.2C70.1,7.6,70.1,7.4,70.1,7.2"/>
|
||||
<path id="Path_424" class="st0" d="M59.3,3.4H44.4c-0.1,0-0.2,0-0.3,0V2.7c0-1.5-0.3-2.7-0.8-2.7s-1,1.2-1.3,2.7l-0.8,4.6
|
||||
c-0.2,1.2,0.5,2.4,1.7,2.6c0.2,0,0.4,0.1,0.5,0H48c0.4,0,0.9-0.1,1.3-0.2c-0.1,0.8-0.8,1.4-1.6,1.4h-6.3c-0.9,0-1.6-0.7-1.6-1.6
|
||||
c0-0.1,0-0.2,0-0.3l0.6-3.8c0.1-0.9-0.5-1.7-1.4-1.9c-0.1,0-0.2,0-0.3,0H7.5c-0.6,0-1.2,0.4-1.5,1l-5.9,9c-0.1,0.1-0.1,0.3,0,0.5
|
||||
l1.1,1.4c0.1,0.2,0.4,0.2,0.5,0.1c0,0,0,0,0,0l4-3.1v19.2c0,0.9,0.7,1.6,1.6,1.6c0,0,0,0,0,0h8.9c0.9,0,1.6-0.7,1.6-1.6
|
||||
c0,0,0,0,0,0v-6.7c0-0.9,0.7-1.6,1.6-1.6c0,0,0,0,0,0h22.2c0.9,0,1.6,0.7,1.6,1.6c0,0,0,0,0,0v6.7c0,0.9,0.7,1.6,1.6,1.6
|
||||
c0,0,0,0,0,0H54c0.9,0,1.6-0.7,1.6-1.6c0,0,0,0,0,0v-7.2h-4.7c-1.5,0-2.7-1.2-2.7-2.7v-4.6c0-0.8,0.4-1.6,1.1-2.2v5.5
|
||||
c0,1.5,1.2,2.7,2.7,2.7h7.3c1.5,0,2.7-1.2,2.7-2.7V6.1C62,4.6,60.8,3.4,59.3,3.4C59.3,3.4,59.3,3.4,59.3,3.4"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 3.2 KiB After Width: | Height: | Size: 1.5 KiB |
Loading…
Reference in New Issue