mirror of https://github.com/rancher/ui.git
Resolves the following issues
* rancher/rancher#2744 * rancher/rancher#2743 * rancher/rander#2739 * Fix issues with user dropdown positioning
This commit is contained in:
Westly Wright
parent
771661290a
commit
145ec5f12d
|
|
@ -26,6 +26,12 @@
|
|||
</ul>
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
{{#if service.description}}
|
||||
<label class="text-muted r-mt10">Description:</label>
|
||||
{{service.description}}
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content-box col-md-3 col-md-height col-md-full-height">
|
||||
|
|
|
|||
|
|
@ -2,11 +2,11 @@
|
|||
<ul class="nav nav-tabs nav-tabs-well shadowed">
|
||||
<li class="{{if (eq activeTab '') 'active'}}">
|
||||
<span class='close' {{action 'dismiss'}}><i class="icon icon-x"></i></span>
|
||||
<a href="#" {{action 'selectTab' ''}}>{{service.name}}</a>
|
||||
<a href="#" class="clip" {{action 'selectTab' ''}}>{{service.name}}</a>
|
||||
</li>
|
||||
{{#each sidekicks as |sidekick|}}
|
||||
<li class="{{if (eq activeTab sidekick.name) 'active'}}">
|
||||
<a href="#" {{action 'selectTab' sidekick.name}}>{{sidekick.name}}</a>
|
||||
<a href="#" class="clip" {{action 'selectTab' sidekick.name}}>{{sidekick.name}}</a>
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
|
|
@ -32,7 +32,9 @@
|
|||
</div>
|
||||
{{#each sidekicks as |sidekick|}}
|
||||
<div class="{{unless (eq activeTab sidekick.name) 'hide'}}">
|
||||
{{sidekick-addtl-info sidekick=sidekick.config containers=sidekick.instances}}
|
||||
<div class="inner">
|
||||
{{sidekick-addtl-info sidekick=sidekick.config containers=sidekick.instances}}
|
||||
</div>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
/**********
|
||||
* Header (top bar)
|
||||
**********/
|
||||
* Header (top bar)
|
||||
**********/
|
||||
$topHeight: ($header-height * 0.45);
|
||||
$bottomHeight: ($header-height * 0.55);
|
||||
|
||||
|
|
@ -31,9 +31,9 @@ HEADER {
|
|||
|
||||
.dropdown {
|
||||
|
||||
&.open {
|
||||
& .icon-chevron-down {
|
||||
transform:rotate(-180deg);
|
||||
&.open {
|
||||
& .icon-chevron-down {
|
||||
transform:rotate(-180deg);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -51,13 +51,17 @@ HEADER {
|
|||
color: $midGray;
|
||||
}
|
||||
|
||||
.user-toggle {
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
color: $midGray;
|
||||
}
|
||||
.user-toggle {
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
color: $midGray;
|
||||
display: inline-block;
|
||||
height: 40px;
|
||||
z-index: 1001; /* These have to be > 990 for bootstrap on touch devices */
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
|
||||
.dropdown-menu {
|
||||
max-height: 300px;
|
||||
width: 300px;
|
||||
overflow-y: auto;
|
||||
|
|
@ -67,14 +71,14 @@ HEADER {
|
|||
color: white;
|
||||
margin: 0;
|
||||
border-radius: 0 0 2px 2px;
|
||||
|
||||
> li > A {
|
||||
color: white;
|
||||
|
||||
&:hover {
|
||||
color: $blue;
|
||||
background: rgba(43,43,43,.9);
|
||||
}
|
||||
> li > A {
|
||||
color: white;
|
||||
|
||||
&:hover {
|
||||
color: $blue;
|
||||
background: rgba(43,43,43,.9);
|
||||
}
|
||||
}
|
||||
|
||||
& > li.selected > a,
|
||||
|
|
@ -82,19 +86,19 @@ HEADER {
|
|||
& > li.selected > a:focus {
|
||||
color: $greenTwoDark
|
||||
}
|
||||
|
||||
.dropdown-header {
|
||||
color: $lightGray;
|
||||
padding: 5px 20px;
|
||||
}
|
||||
|
||||
.divider {
|
||||
background: black;
|
||||
}
|
||||
.dropdown-header {
|
||||
color: $lightGray;
|
||||
padding: 5px 20px;
|
||||
}
|
||||
|
||||
.divider {
|
||||
background: black;
|
||||
}
|
||||
|
||||
}/*end dropdown-menu*/
|
||||
}/*end dropdown*/
|
||||
|
||||
}/*end dropdown-menu*/
|
||||
}/*end dropdown*/
|
||||
|
||||
|
||||
NAV {
|
||||
float: left;
|
||||
|
|
@ -139,7 +143,7 @@ HEADER {
|
|||
.user-btn {
|
||||
float: right;
|
||||
vertical-align: top;
|
||||
padding: 5px 15px;
|
||||
padding: 5px 15px 0 15px;
|
||||
}
|
||||
|
||||
.project-btn {
|
||||
|
|
@ -154,14 +158,13 @@ HEADER {
|
|||
}
|
||||
|
||||
|
||||
.project-menu {
|
||||
margin-top: -13px;
|
||||
|
||||
.project-menu {
|
||||
margin-top: -13px;
|
||||
|
||||
padding-top: 0;
|
||||
border-radius: 2px;
|
||||
}
|
||||
}/*end project button*/
|
||||
padding-top: 0;
|
||||
border-radius: 2px;
|
||||
}
|
||||
}/*end project button*/
|
||||
.user-menu {
|
||||
transition: ease top 350ms;
|
||||
padding-top: 0;
|
||||
|
|
@ -205,20 +208,20 @@ HEADER {
|
|||
}
|
||||
|
||||
.user-logout {
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
border-top-right-radius: 2px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
padding: 18px 10px;
|
||||
color: #dfe9ee;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
&:hover {
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
border-top-right-radius: 2px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
padding: 18px 10px;
|
||||
color: #dfe9ee;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
&:hover {
|
||||
background: $blackDark;
|
||||
}
|
||||
}
|
||||
I {
|
||||
font-size: 20px;
|
||||
vertical-align: middle;
|
||||
|
|
@ -226,9 +229,9 @@ HEADER {
|
|||
} /*end user logout*/
|
||||
} /*end user auth*/
|
||||
|
||||
}/*end top row*/
|
||||
}/*end top row*/
|
||||
|
||||
/*start bottom row*/
|
||||
/*start bottom row*/
|
||||
.bottom-row {
|
||||
min-height: $bottomHeight;
|
||||
background-color: white;
|
||||
|
|
@ -291,7 +294,7 @@ HEADER {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
} /*end nav*/
|
||||
}/*end bottom row*/
|
||||
|
|
@ -314,4 +317,4 @@ HEADER {
|
|||
color: $header-link-text;
|
||||
}
|
||||
} /*end h3 */
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -64,6 +64,9 @@
|
|||
&.active {
|
||||
background: white;
|
||||
}
|
||||
a {
|
||||
max-width: 125px;
|
||||
}
|
||||
}
|
||||
.close {
|
||||
position: absolute;
|
||||
|
|
@ -114,7 +117,7 @@
|
|||
height: 100%;
|
||||
padding: 10px 0;
|
||||
border-right: 1px solid $gray-light;
|
||||
max-height: 310px;
|
||||
max-height: 215px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.state {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
<div class="content-box col-sm-12 col-md-12">
|
||||
<label class="text-muted">Service Links</label>
|
||||
<label class="text-muted">Service Links (<small>{{#link-to 'service' service.environmentId service.id class=''}} View Details {{/link-to}}</small>)</label>
|
||||
<div class="content">
|
||||
<label class="text-muted">Links</label>
|
||||
<ul class="list-unstyled">
|
||||
{{#each service.consumedServicesWithNames as |link|}}
|
||||
<li>{{#link-to 'service' link.service.environmentId link.service.id}} {{link.service.name}} {{/link-to}}</li>
|
||||
|
|
@ -8,5 +9,9 @@
|
|||
<li class="text-muted">No Links</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
{{#if service.description}}
|
||||
<label class="text-muted r-mt10">Description:</label>
|
||||
{{service.description}}
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
<div class="content-box col-sm-12 col-md-12">
|
||||
<label class="text-muted">External IPs</label>
|
||||
<label class="text-muted">External IPs (<small>{{#link-to 'service' service.environmentId service.id class=''}} View Details {{/link-to}}</small>)</label>
|
||||
<div class="content">
|
||||
<label class="text-muted">IPs</label>
|
||||
{{#if service.externalIpAddresses.length}}
|
||||
<ul class="list-unstyled" style="mergin:0 auto;">
|
||||
{{#each service.externalIpAddresses as |ip|}}
|
||||
|
|
@ -10,5 +11,9 @@
|
|||
{{/each}}
|
||||
</ul>
|
||||
{{/if}}
|
||||
{{#if service.description}}
|
||||
<label class="text-muted r-mt10">Description:</label>
|
||||
{{service.description}}
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue