Style refactoring
diff --git a/views/style/sass/lib/_variables.scss b/views/style/sass/lib/_variables.scss
new file mode 100644
index 0000000..ed9981e
--- /dev/null
+++ b/views/style/sass/lib/_variables.scss
@@ -0,0 +1,21 @@
+
+$icon-font-path: '/static/suit/bootstrap/fonts/';
+//== Colors
+//
+//## Gray and brand colors for use across Bootstrap.
+
+$gray-base: #000 !default;
+$gray-darker: lighten($gray-base, 13.5%) !default; // #222
+$gray-dark: lighten($gray-base, 20%) !default; // #333
+$gray: lighten($gray-base, 33.5%) !default; // #555
+$gray-light: lighten($gray-base, 46.7%) !default; // #777
+$gray-lighter: lighten($gray-base, 93.5%) !default; // #eee
+
+$brand-primary: darken(#428bca, 6.5%) !default; // #337ab7
+$brand-success: #5cb85c !default;
+$brand-info: #5bc0de !default;
+$brand-warning: #f0ad4e !default;
+$brand-danger: #d9534f !default;
+
+// Tables
+$thead-background: #6e7277;
\ No newline at end of file
diff --git a/views/style/sass/lib/data_table.scss b/views/style/sass/lib/data_table.scss
new file mode 100644
index 0000000..a572620
--- /dev/null
+++ b/views/style/sass/lib/data_table.scss
@@ -0,0 +1,24 @@
+table.dataTable thead{
+ th div.DataTables_sort_wrapper{
+ font-weight: normal !important;
+ }
+ tr {
+ background-color: $thead-background;
+
+ th.ui-state-default {
+ background: transparent !important;
+ color: #fff !important;
+ }
+ }
+}
+
+table.dataTable tr.odd,
+table.dataTable tr.odd td.sorting_1{
+ background-color: $gray-lighter !important;
+}
+table.dataTable tr.even td.sorting_1{
+ background-color: #fff;
+}
+table.dataTable thead th div.DataTables_sort_wrapper {
+ font-weight: bold;
+}
\ No newline at end of file
diff --git a/views/style/sass/lib/footer.scss b/views/style/sass/lib/footer.scss
new file mode 100644
index 0000000..31fbfe4
--- /dev/null
+++ b/views/style/sass/lib/footer.scss
@@ -0,0 +1,24 @@
+/************************* FOOTER *************************/
+
+.footer{
+ z-index: 1001;
+ position: fixed;
+}
+
+/* FIXME */
+@media(max-width:768px) {
+ .footer{
+ display: none;
+ }
+
+ #page-content-wrapper{
+ padding-bottom: 60px;
+ }
+}
+
+.footer .content .statusMsg {
+ float: right;
+ padding: 15px 20px 0 0;
+ display: block;
+}
+/************************* END FOOTER *************************/
\ No newline at end of file
diff --git a/views/style/sass/lib/header.scss b/views/style/sass/lib/header.scss
new file mode 100644
index 0000000..e219316
--- /dev/null
+++ b/views/style/sass/lib/header.scss
@@ -0,0 +1,31 @@
+/* ************************* HEADER STYLE ************************* */
+
+.header{
+ background-color: #ffffff !important;
+ border-bottom: 3px solid #C5CCD4;
+ margin-bottom: 14px;
+ height: 85px;
+
+ .logo{
+ max-height: 80px;
+ }
+
+ a {
+ font-weight: bold;
+ }
+
+ #user-tools {
+ padding: 12px 20px 0px 0px;
+ float: right;
+ margin-top: -5px;
+
+ // hiding links on mobile
+ @media (max-width: $screen-sm-max) {
+ .user-links *:not(:last-child){
+ display: none;
+ }
+ }
+ }
+}
+
+/************************* END HEADER *************************/
diff --git a/views/style/sass/lib/login.scss b/views/style/sass/lib/login.scss
new file mode 100644
index 0000000..4cd970f
--- /dev/null
+++ b/views/style/sass/lib/login.scss
@@ -0,0 +1,54 @@
+.login{
+ #content-main {
+ background: rgba(255,255,255,0.82);
+ }
+
+ #content-main form input[type=text],
+ #content-main form input[type=password],
+ .requestDialog.ui-widget input{
+ background-color: rgb(250, 255, 189);
+ }
+ //#forgot_pwd{
+ // font-size: 11px;
+ // font-style: normal;
+ // text-decoration: none;
+ //}
+ //
+ //#create_acct{
+ // font-size: 11px;
+ // font-style: normal;
+ // text-decoration: none;
+ // padding-left: 45px;
+ //}
+
+ .row + .row {
+ margin-top: 10px;
+ }
+
+ #content-main form {
+ margin: 5px 15px 0;
+ }
+
+ .btn-primary {
+ @include button-variant($btn-primary-color, $btn-primary-bg, $btn-primary-border);
+ background: $btn-primary-bg;
+ }
+
+ .forgotLink {
+ width: 45%;
+ text-align: left;
+ float: left;
+ }
+
+ #request-account-form{
+ display:none;
+ }
+
+ #requestAccountLink {
+ margin-top: 10px;
+ cursor: pointer;
+ color: $brand-primary;
+ text-decoration: underline;
+ }
+}
+
diff --git a/views/style/sass/lib/nav.scss b/views/style/sass/lib/nav.scss
new file mode 100644
index 0000000..7c011cf
--- /dev/null
+++ b/views/style/sass/lib/nav.scss
@@ -0,0 +1,81 @@
+/************************* NAV *************************/
+
+#sidebar-wrapper {
+ -webkit-box-shadow: 3px 0px 5px 0px rgba(50, 50, 50, 0.75);
+ -moz-box-shadow: 3px 0px 5px 0px rgba(50, 50, 50, 0.75);
+ box-shadow: 3px 0px 5px 0px rgba(50, 50, 50, 0.75);
+
+ .logo{
+ max-width: 100%;
+ }
+
+ a {
+ font-weight: bold;
+ }
+
+ // ICONS
+ .icon-app {
+ background-image: url("opencloudApp.png");
+ }
+ .icon-home {
+ /* Going with darker standard color nav -- so using over png's background-image: url("Home.png"); */
+ background-image: url("Home.png");
+ }
+ .icon-deployment{
+ background-image: url("Deployments.png");
+ }
+ .icon-site{
+ background-image: url("Sites.png");
+ }
+ .icon-slice{
+ background-image: url("Slices.png");
+ }
+ .icon-user{
+ background-image: url("Users.png");
+ }
+ .icon-reservation{
+ background-image: url("Reservations.png");
+ }
+ .icon-cog{
+ background-image: url("Services.png");
+ }
+
+ // ACTIVE ICONS
+ li.active a,
+ li.focus a {
+ .icon-home{
+ background-image: url("Home_over.png");
+ }
+ .icon-deployment{
+ background-image: url("Deployments_over.png");
+ }
+ .icon-site{
+ background-image: url("Sites_over.png");
+ }
+ .icon-slice{
+ background-image: url("Slices_over.png");
+ }
+ .icon-user{
+ background-image: url("Users_over.png");
+ }
+ .icon-reservation{
+ background-image: url("Reservations_over.png");
+ }
+ .icon-cog{
+ background-image: url("Services_over.png");
+ }
+ }
+
+ [class^="icon-"]{
+ background-position: left center;
+ width:22px;
+ height:22px;
+ display: inline-block;
+ margin-right: 10px;
+ position: relative;
+ top: 5px;
+ }
+
+}
+
+/************************* END NAV *************************/
\ No newline at end of file
diff --git a/views/style/sass/lib/tabs.scss b/views/style/sass/lib/tabs.scss
new file mode 100644
index 0000000..fcb8988
--- /dev/null
+++ b/views/style/sass/lib/tabs.scss
@@ -0,0 +1,173 @@
+#hometabs {
+ border-bottom: 1px solid #105E9E;
+ font-size: 12px;
+ border: 0px;
+}
+
+.ui-tabs .ui-tabs-nav {
+ padding: 0 !important;
+}
+
+.ui-tabs-active {
+ color: #ffffff;
+ background-color: #105E9E;
+ text-shadow: rgb(46, 43, 43) 0.1em 0.1em 0.2em;
+ font-weight: normal;
+}
+
+.ui-state-focus a,
+.ui-state-focus a:link{
+ color: #ffffff;
+ background-color: #105E9E;
+ text-shadow: rgb(46, 43, 43) 0.1em 0.1em 0.2em;
+}
+
+.ui-state-default a {
+ padding: 20px !important;
+ line-height: 20px !important;
+ transition: all .5s ease-in-out;
+}
+
+.ui-state-active a,
+.ui-state-active a:link{
+ color: #ffffff !important;
+ background-color: #105E9E !important;
+ text-shadow: rgb(46, 43, 43) 0.1em 0.1em 0.2em;
+ font-weight: normal;
+ font-size: 20px;
+}
+
+.ui-tabs .ui-tabs-panel {
+ position:relative;
+}
+
+
+.nav-tabs-suit li{
+ /*background-color: #CDE7FF;*/
+ background-color: #FFFFFF;
+ border-top-left-radius: 3px;
+ border-top-right-radius: 3px;
+ border-bottom-left-radius: 0px;
+ border-bottom-right-radius: 0px;
+}
+
+.nav-tabs-suit li a {
+
+ /*background-color: #CDE7FF;*/
+ font-weight: normal;
+ color: #105E9E;
+ /*border-radius: 3px;*/
+ border-top-left-radius: 3px;
+ border-top-right-radius: 3px;
+ border-bottom-left-radius: 0px;
+ border-bottom-right-radius: 0px;
+ border: none;
+ box-shadow: none;
+}
+
+.nav-tabs-suit li.active{
+ /*Changed on Dec 11*/
+ /*background-color: #448CCA;*/
+ background-position: 50% 100%;
+ background-image:url('down_arrow.png');
+}
+
+.nav-tabs-suit li.hover{
+ /*Changed on Dec 11*/
+ /*background-color: #448CCA;*/
+ color:#ffffff;
+ /*font-size: 1.2em;*/
+ font-weight: bold;
+}
+
+.nav-tabs-suit li.active a {
+ background-color: #ffffff;
+ /*background-color: #448CCA;*/
+ background-color: #105E9E;
+ color:#ffffff;
+ font-weight:normal;
+ padding-top:10px;
+ text-decoration:none;
+}
+
+.nav-tabs-suit li.active a:after{ /*arrow added to downarrowdiv DIV*/
+ width: 0;
+ height: 0;
+ border-left: 5px solid transparent;
+ border-right: 5px solid transparent;
+ border-top: 5px solid #2f2f2f;
+ font-size: 0;
+ line-height: 0;
+}
+
+.nav-tabs-suit li.active a:hover,
+.nav-tabs-suit li a:hover{
+ background-color: #105E9E;
+ /*background-color: #515151;*/
+ font-weight:normal;
+ /*font-size: 1.2em;*/
+ color:#ffffff;
+ /*padding-top:10px;
+ text-decoration:none;*/
+}
+
+.nav-tabs>.active>a{
+ border: none;
+}
+
+.nav-tabs-suit li a{
+ font-weight: normal;
+}
+
+.nav-tabs-suit li a:hover{
+ border: none;
+ color: #ffffff;
+ padding-top:10px;
+ /*border: 1px solid;*/
+ /*letter-spacing: 1px;*/
+ /*text-shadow: rgb(46, 43, 43) 0.1em 0.1em 0.2em;*/
+}
+
+.nav-tabs-suit li.active a:hover{
+ /*border: none;*/
+}
+
+.nav-tabs-suit > li.active > a:focus {
+ background-color: #105E9E;
+ font-weight: normal;
+}
+
+.breadcrumb li a {
+ /*font-weight:bold;*/
+}
+
+.nav-tabs {
+ /*
+ border-bottom: 1px solid #B5D1EA;*/
+}
+
+.nav-tabs>li {
+ margin-bottom: 0px;
+}
+
+.nav-tabs-suit li.active a{
+ letter-spacing: 1px;
+ text-shadow: rgb(46, 43, 43) 0.1em 0.1em 0.2em;
+ /*text-shadow: none;
+ -webkit-box-shadow: none;
+ -moz-box-shadow: none;
+ box-shadow: none;
+ */
+}
+
+/*.nav-tabs-suit li.active {*/
+/*background: transparent url('home.png') no-repeat scroll center bottom;*/
+/*border-left: 5px solid transparent;
+border-right: 5px solid transparent;
+border-top: 5px solid #2f2f2f;
+font-size: 0;
+line-height: 0;
+width: 0;;
+height: 0;
+ margin: 0;
+}*/
\ No newline at end of file