UX Changes to the License workflow

adding the Tower logo and a sentence to the license screen when no license is present
This commit is contained in:
Jared Tabor 2016-06-02 14:50:15 -07:00
parent 40abf57b4a
commit 7c489ae4c8
3 changed files with 34 additions and 4 deletions

View File

@ -74,6 +74,7 @@
<div class="Panel">
<div class="License-titleText">{{title}}</div>
<div class="License-body">
<div class="License-helperText" ng-if="licenseMissing">Welcome to Ansible Tower! Please complete the steps below to acquire a license.</div>
<div class="AddPermissions-directions" ng-if="licenseMissing">
<span class="AddPermissions-directionNumber">
1

View File

@ -18,7 +18,7 @@
}
.MainMenu--licenseMissing{
justify-content: flex-end;
justify-content: space-between;
}
.MainMenu-logo,
@ -35,6 +35,11 @@
margin: 20px;
}
.MainMenu-logoImage--licenseMissing:hover{
cursor:default;
background-color: @default-bg!important;
}
.MainMenu-item {
padding: 0 20px;
}
@ -192,6 +197,27 @@
display: none;
}
.MainMenu-item--licenseMissing{
justify-content: space-between!important;
display:flex!important;
align-items: center!important;
flex: initial!important;
padding-top:0px;
}
// .MainMenu-item--licenseMissing:hover{
// padding-top:5px;
// border-bottom: 5px solid @menu-link-btm-hov;
// border-left: 0px;
// padding-left: 21px;
// padding-right: 21px;
// margin-right: -1px;
// }
.MainMenu-itemImage--licenseMissing{
font-size: 20px!important;
}
.MainMenu {
flex-direction: row;
flex-wrap: wrap;

View File

@ -3,9 +3,9 @@
<a id="main_menu_logo"
href="/#/"
class="MainMenu-logo ng-cloak"
ng-hide="licenseMissing"
ng-class="{'is-loggedOut' : !$root.current_user.username}">
ng-class="{'is-loggedOut' : !$root.current_user.username, 'MainMenu-logoImage--licenseMissing': licenseMissing}">
<img class="MainMenu-logoImage"
ng-class="{'MainMenu-logoImage--licenseMissing': licenseMissing}"
ng-src="/static/assets/tower-logo-header.svg">
</a>
@ -182,13 +182,16 @@
<a class="MainMenu-item MainMenu-item--notMobile MainMenu-item--right"
id="main_menu_logout_link"
ng-href="/#/logout"
ng-class="{'is-currentRoute' : isCurrentState('logout'), 'is-loggedOut' : !$root.current_user.username}"
ng-class="{'is-currentRoute' : isCurrentState('logout'),
'is-loggedOut' : !$root.current_user.username,
'MainMenu-item--licenseMissing' : licenseMissing}"
aw-tool-tip="Log Out"
data-placement="bottom"
data-trigger="hover"
data-container="body"
data-tooltip_inner_class="tooltip-inner--logOut">
<i class="MainMenu-itemImage fa fa-power-off"
ng-class="{'MainMenu-itemImage--licenseMissing' : licenseMissing}"
alt="Log Out">
</i>
</a>