openstack/horizon
Code Issues Proposed changes

Merge "ID Panels with long roles names should fit"

Browse Source
This commit is contained in:
Jenkins 2015-06-25 03:04:50 +00:00 committed by Gerrit Code Review
commit b4dbc62667
4 changed files with 44 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
horizon/static/horizon/js/horizon.membership.js
View File

@ -179,10 +179,6 @@ horizon.membership = {
var $roles_display = $dropdown.children('.dropdown-toggle').children('.roles_display');
var roles_to_display = [];
for (var i = 0; i < role_ids.length; i++) {
if (i === 2) {
roles_to_display.push('...');
break;
}
roles_to_display.push(horizon.membership.roles[step_slug][role_ids[i]]);
}
var text = roles_to_display.join(', ');

2
horizon/templates/horizon/client_side/_membership.html
View File

@ -12,7 +12,7 @@
<li class="dropdown role_options">
<a class="dropdown-toggle btn btn-default" data-toggle="dropdown" href="#">
<span class="roles_display">[[roles_label]]</span>
<span class="caret"></span>
<span class="fa fa-caret-down"></span>
</a>
<ul class="dropdown-menu role_dropdown clearfix">
[[#roles]]

12
openstack_dashboard/static/dashboard/scss/_variables.scss
View File

@ -15,7 +15,7 @@ $body-min-width: 900px !default;
$sidebar-background-color: #f9f9f9 !default;
$sidebar-width: 220px !default;
$border-color: #dddddd !default;
$table-bg-odd: #f9f9f9 !default;
$table-bg-odd: $table-bg-accent !default;
$content-body-padding: 15px !default;
@ -203,3 +203,13 @@ $magic-search-border-color: #cccccc !default;
$magic-search-margin-bottom: 0 !default;
$magic-search-border-radius: 3px !default;
$magic-search-margin-padding: 2px !default;
/* Member lists */
$members-list-padding: 3px !default;
$members-list-border: 1px solid $gray-light !default;
// TODO: These values are hardcoded lengths but they are actually
// very dependant on the modal size set in the theme. We need
// to eventually readdress these and calculate them dynamically
$members-list-item-width: 130px !default;
$members-list-item-max-width: 327px !default;
$members-list-roles-width: 125px !default;

41
openstack_dashboard/static/dashboard/scss/horizon.scss
View File

@ -1353,32 +1353,55 @@ label.log-length {
display: block;
}
ul.btn-group {
margin-left:0px;
padding: 3px;
margin-bottom: 0px;
border: 1px solid $gray-light;
margin-left:0;
padding: $members-list-padding;
margin-bottom: 0;
border: $members-list-border;
border-bottom: none;
&.last_stripe {
border-bottom: 1px solid $table-border-color;
}
&.light_stripe {
background-color: white;
background-color: $table-bg;
}
&.dark_stripe {
background-color: $table-bg-odd;
background-color: $table-bg-accent;
}
&:hover {
background-color: $border-color;
}
li.member {
padding: 6px 10px 5px 10px;
}
li.active {
float: right;
a:hover {
background-color: $link-hover-color;
}
}
.member,
.role_options .roles_display {
overflow: hidden;
text-overflow: ellipsis;
}
.member {
padding: $nav-link-padding;
padding-right: 0;
padding-left: $padding-base-vertical;
max-width: $members-list-item-width;
}
.role_options {
margin-left: 0;
& > a {
padding: nth($nav-link-padding, 1) $padding-small-horizontal;
.roles_display {
display: inline-block;
max-width: $members-list-roles-width;
line-height: 1;
padding-right: $padding-base-vertical;
}
}
.role_dropdown > li {
word-break: break-all;
}
}
}
}