aboutsummaryrefslogtreecommitdiffstats
path: root/gui/app/views/main.html
diff options
context:
space:
mode:
authorchenjiankun <chenjiankun1@huawei.com>2017-07-24 04:13:56 +0000
committerchenjiankun <chenjiankun1@huawei.com>2017-07-27 04:02:50 +0000
commitedbe3568a052da8afd24b6877c4c6fdcc7627ba3 (patch)
tree54e1870ad8171471a97c1e07bd9a0f4146e07bb1 /gui/app/views/main.html
parent869d5fdb0b7a6070a78b4ec21d6b6c1cba14da6c (diff)
Yardstick GUI & GUI deployment
JIRA: YARDSTICK-758 As E release plan, we have the need of yardstick GUI. This patch is GUI front end code and deployment. The backend code is yardstick API. Change-Id: Ib15f78bcc50168c7828beff97256e9939c6da809 Signed-off-by: chenjiankun <chenjiankun1@huawei.com>
Diffstat (limited to 'gui/app/views/main.html')
-rw-r--r--gui/app/views/main.html174
1 files changed, 174 insertions, 0 deletions
diff --git a/gui/app/views/main.html b/gui/app/views/main.html
new file mode 100644
index 000000000..d5f7a3af3
--- /dev/null
+++ b/gui/app/views/main.html
@@ -0,0 +1,174 @@
+<div>
+ <div ng-include="'views/layout/header.html'"></div>
+</div>
+<div ng-include="'views/layout/sideNav.html'"></div>
+
+
+<div style="margin-top:80px;margin-left:100px;display:flex;flex-direction:row">
+ <!--<div ncy-breadcrumb></div>-->
+ <div>
+ <ol class="progressDefine">
+ <li data-step="1" ng-click="gotoProject();" style="cursor:pointer" ng-class="{'is-complete':projectShow}">
+ Project
+ </li>
+ <li data-step="2" ng-class="{'is-complete':taskShow}">
+ Task
+ </li>
+
+ <li data-step="3" ng-class="{'progressDefine__last':reportShow}">
+ Reporting
+ </li>
+
+ </ol>
+ </div>
+
+
+</div>
+
+
+
+
+
+
+
+
+
+<div ui-view></div>
+
+
+
+<style>
+ .stepsContent {
+ display: flex;
+ flex-direction: row;
+ justify-content: space-around;
+ margin-left: 120px;
+ margin-top: 100px;
+ }
+
+ .stepItem {
+ display: flex;
+ flex-direction: column;
+ }
+
+ .nextButton {
+ margin-left: 500px;
+ }
+
+ .progressDefine {
+ list-style: none;
+ margin: 0;
+ padding: 0;
+ display: table;
+ table-layout: fixed;
+ width: 100%;
+ color: #849397;
+ }
+
+ .progressDefine>li {
+ position: relative;
+ display: table-cell;
+ text-align: center;
+ font-size: 0.8em;
+ }
+
+ .progressDefine>li:before {
+ content: attr(data-step);
+ display: block;
+ margin: 0 auto;
+ background: #DFE3E4;
+ width: 3em;
+ height: 3em;
+ text-align: center;
+ margin-bottom: 0.25em;
+ line-height: 3em;
+ border-radius: 100%;
+ position: relative;
+ z-index: 5;
+ }
+
+ .progressDefine>li:after {
+ content: '';
+ position: absolute;
+ display: block;
+ background: #DFE3E4;
+ width: 100%;
+ height: 0.5em;
+ top: 1.25em;
+ left: 50%;
+ margin-left: 1.5em\9;
+ z-index: -1;
+ }
+
+ .progressDefine>li:last-child:after {
+ display: none;
+ }
+
+ .progressDefine>li.is-complete {
+ color: #e95420;
+ }
+
+ .progressDefine>li.is-complete:before,
+ .progressDefine>li.is-complete:after {
+ color: #FFF;
+ background: #e95420;
+ }
+
+ .progressDefine>li.is-active {
+ color: #3498DB;
+ }
+
+ .progressDefine>li.is-active:before {
+ color: #FFF;
+ background: #3498DB;
+ }
+ /**
+ * Needed for IE8
+ */
+
+ .progressDefine__last:after {
+ display: none !important;
+ }
+ /**
+ * Size Extensions
+ */
+
+ .progressDefine--medium {
+ font-size: 1.5em;
+ }
+
+ .progressDefine--large {
+ font-size: 2em;
+ }
+ /**
+ * Some Generic Stylings
+ */
+
+ *,
+ *:after,
+ *:before {
+ box-sizing: border-box;
+ }
+
+ h1 {
+ margin-bottom: 1.5em;
+ }
+
+ .progressDefine {
+ margin-bottom: 3em;
+ }
+
+ a {
+ color: #3498DB;
+ text-decoration: none;
+ }
+
+ a:hover {
+ text-decoration: underline;
+ }
+ /*
+ body {
+ text-align: center;
+ color: #444;
+ }*/
+</style>