External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-02-17 19:20:05 -03:30
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1475 from marshmalien/feat/style_upgrade_page

Browse Source 
Style migrations-pending page
This commit is contained in:
Marliana Lara
2018-03-09 11:47:34 -05:00
committed by GitHub
parent 882ed4d05a 6f23147d98
commit bfbbb95256
4 changed files with 70 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
awx/ui/client/installing.template.ejs
View File

@@ -5,6 +5,7 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script>var $basePath = '{{ STATIC_URL }}'</script>
<link rel="shortcut icon" href="{{ STATIC_URL }}assets/favicon.ico?v={{version}}" /> <link rel="shortcut icon" href="{{ STATIC_URL }}assets/favicon.ico?v={{version}}" />
<title ng-bind="tabTitle"></title> <title ng-bind="tabTitle"></title>
<% htmlWebpackPlugin.files.css.forEach(file => {%> <% htmlWebpackPlugin.files.css.forEach(file => {%>
@@ -20,16 +21,14 @@
</script> </script>
</head> </head>
<body> <body>
<div class="jumbotron"> <div class="at-Upgrade--panel">
<div class="container-fluid" id="content-container"> <img src="{% static 'assets/logo-header.svg' %}" width="200"/>
<div class="span4"> <span class="at-Upgrade--header at-Upgrade--loading"><span class="at-Upgrade--brand" ng-bind="BRAND_NAME"></span> is Upgrading</span>
<img style="float:left" src="{% static 'assets/logo-header.svg' %}" width="200"/> <span class="fa-4x at-Upgrade--icon"><i class="fa fa-refresh fa-spin"></i></span>
<div class="content-heading"><h1>AWX is Upgrading</h1></div> <span class="at-Upgrade--text">
<p> <p><span class="at-Upgrade--brand" ng-bind="BRAND_NAME"></span>is currently upgrading.</p>
AWX is currently upgrading or installing, this page will refresh when done. <p>This page will refresh when complete.</p>
</p> </span>
</div>
</div>
</div> </div>
</body> </body>
</html> </html>

4
awx/ui/client/lib/theme/_variables.less
View File

@@ -69,6 +69,7 @@
@at-space-3x: 15px; @at-space-3x: 15px;
@at-space-4x: 20px; @at-space-4x: 20px;
@at-space-5x: 25px; @at-space-5x: 25px;
@at-space-10x: 50px;
// 4. Breakpoints --------------------------------------------------------------------------------- // 4. Breakpoints ---------------------------------------------------------------------------------
@@ -117,6 +118,7 @@
@at-color-disabled: @at-gray-d7; @at-color-disabled: @at-gray-d7;
@at-color-body-background-dark: @at-gray-70; @at-color-body-background-dark: @at-gray-70;
@at-color-body-background-light: @at-gray-eb;
@at-color-body-text-dark: @at-white; @at-color-body-text-dark: @at-white;
@at-color-body-background: @at-gray-fc; @at-color-body-background: @at-gray-fc;
@at-color-body-text: @at-gray-70; @at-color-body-text: @at-gray-70;
@@ -209,6 +211,8 @@
@at-font-size-list-row-item-tag: 10px; @at-font-size-list-row-item-tag: 10px;
@at-font-size-list-row-action: 19px; @at-font-size-list-row-action: 19px;
@at-font-size-list-row-action-icon: 19px; @at-font-size-list-row-action-icon: 19px;
@at-font-size-jumbotron-heading: 24px;
@at-font-size-jumbotron-text: @at-font-size-4x;
@at-font-weight-body: @at-font-weight; @at-font-weight-body: @at-font-weight;
@at-font-weight-heading: @at-font-weight-2x; @at-font-weight-heading: @at-font-weight-2x;

1
awx/ui/client/lib/theme/index.less
View File

@@ -115,6 +115,7 @@
@import '../../src/shared/download-standard-out.block.less'; @import '../../src/shared/download-standard-out.block.less';
@import '../../src/shared/media-object.block.less'; @import '../../src/shared/media-object.block.less';
@import '../../src/shared/text-label'; @import '../../src/shared/text-label';
@import '../../src/shared/upgrade/upgrade.block.less';
@import '../../src/smart-status/smart-status.block.less'; @import '../../src/smart-status/smart-status.block.less';
@import '../../src/standard-out/standard-out.block.less'; @import '../../src/standard-out/standard-out.block.less';
@import '../../src/system-tracking/date-picker/date-picker.block.less'; @import '../../src/system-tracking/date-picker/date-picker.block.less';

55
awx/ui/client/src/shared/upgrade/upgrade.block.less Normal file
View File

@@ -0,0 +1,55 @@
.at-Upgrade--panel {
align-items: center;
background-color: @at-color-body-background-light;
color: @at-color-body-text;
display: flex;
flex-direction: column;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: @at-font-size-jumbotron-text;
justify-content: center;
margin-top: @at-space-10x;
padding: @at-space-10x;
}
.at-Upgrade--header {
display: flex;
font-size: @at-font-size-jumbotron-heading;
margin-top: @at-space-2x;
}
.at-Upgrade--text {
align-items: center;
display: flex;
flex-flow: column;
}
.at-Upgrade--brand {
margin-right: .4em;
}
.at-Upgrade--icon {
color: @at-gray-b7;
}
.at-Upgrade--loading:after {
content: "\2026";
display: inline-block;
overflow: hidden;
position: absolute;
vertical-align: bottom;
width: 0px;
animation: ellipsis steps(4, end) 1500ms infinite;
-webkit-animation: ellipsis steps(4, end) 1500ms infinite;
}
@keyframes ellipsis {
to {
width: 30px;
}
}
@-webkit-keyframes ellipsis {
to {
width: 30px;
}
}