add firmware page
Change-Id: I3d9a2ec068e3542a848dada63a6bbebe9869bf2f
Signed-off-by: Michael Davis <michael.s.davis@ibm.com>
diff --git a/app/common/styles/base/buttons.scss b/app/common/styles/base/buttons.scss
index 2f53391..6bda87f 100644
--- a/app/common/styles/base/buttons.scss
+++ b/app/common/styles/base/buttons.scss
@@ -3,7 +3,7 @@
@include fontFamilyBold;
text-transform: none;
border-radius: 3px;
- padding: .5rem 2rem .5rem;
+ padding: .5rem 1rem .5rem;
height: auto;
border: 0;
overflow: hidden;
@@ -55,7 +55,7 @@
}
.btn-secondary {
color: $secbtn__text;
- background: transparent;
+ background: $white;
border: 2px solid $secbtn__border;
min-height: 40px;
&:hover {
diff --git a/app/common/styles/base/colors.scss b/app/common/styles/base/colors.scss
index a5a9d1b..42fea1b 100644
--- a/app/common/styles/base/colors.scss
+++ b/app/common/styles/base/colors.scss
@@ -13,11 +13,14 @@
$btn__disabled-txt: #a6a5a6;
$btn__disabled-bg: #d8d8d8;
+//Disabled table elements
+$disabled-row: #dddee0;
+$disabled-row-txt: #999999;
+
// Dark background
$darkbg__grey: #E3ECEC;
$darkbg__accent: #79a6f6;
$darkbg__primary: #19273c;
-$active: #648FFF;
// Light Background
$lightbg__grey: #b8c1c1;
@@ -69,7 +72,7 @@
$not-present: $medium-lightbg;
// Links
-$links: #648FFF;
+$links: #3f71ec;
$links__hover: $lightbg__primary;
$links__visited: #8ea7ea;
$links__disabled: rgba(27, 40, 52, 0.70);
diff --git a/app/common/styles/base/core.scss b/app/common/styles/base/core.scss
index 3dc8fea..9cf4b09 100644
--- a/app/common/styles/base/core.scss
+++ b/app/common/styles/base/core.scss
@@ -12,9 +12,7 @@
a {
color: $links;
- &:visited {
- color: $links__visited;
- }
+ text-decoration: none;
&:hover {
text-decoration: underline;
}
diff --git a/app/common/styles/base/icons.scss b/app/common/styles/base/icons.scss
new file mode 100644
index 0000000..8d61548
--- /dev/null
+++ b/app/common/styles/base/icons.scss
@@ -0,0 +1,98 @@
+.icon {
+ display: inline-block;
+ width: 20px;
+ height: 20px;
+ position: relative;
+ speak: none;
+ &:hover {
+ cursor: pointer;
+ }
+ &.icon-as-spacer {
+ text-indent: -9999px;
+ }
+}
+
+.icon__more {
+ fill: $medblue;
+ stroke: $medblue;
+ background: $white;
+ overflow: visible;
+}
+
+.icon__more-dropdown {
+ background: $lightgrey;
+ position: absolute;
+ right: 3px;
+ white-space: normal;
+ word-wrap: normal;
+ z-index: 200;
+ padding: 1em;
+ font-size: 1em;
+ box-shadow: 2px 4px 5px $medgrey;
+}
+
+.icon__bar-arrow {
+ &:before {
+ content: '\21E5';
+ position: absolute;
+ font-size: 1.7em;
+ vertical-align: middle;
+ transform: rotate(90deg);
+ display: inline-block;
+ left: 0px;
+ top: -5px;
+ }
+}
+
+.icon__warning{
+ margin-right: .7em;
+ margin-top: -2px;
+ &:before {
+ content: '!';
+ color: $alert__error;
+ position: absolute;
+ left: 55%;
+ top: 40%;
+ font-size: .7em;
+ }
+ &:after {
+ content: '\025b3';
+ position: absolute;
+ left: 0;
+ top: -10%;
+ color: $alert__error;
+ font-size: 1.5em;
+ }
+}
+
+.icon__info{
+ margin-top: -4px;
+ margin-right: .5em;
+ width: 25px;
+ height: 25px;
+ fill: $medblue;
+ float: left;
+}
+
+.icon__up-arrow {
+ margin-right: 1em;
+ &:before {
+ content: '\029C0';
+ position: absolute;
+ font-size: 3em;
+ left: 0;
+ top: -50%;
+ transform: rotate(90deg);
+ }
+}
+.icon__down-arrow {
+ margin-right: 1em;
+ &:before {
+ content: '\029C0';
+ position: absolute;
+ font-size: 3em;
+ left: -4px;
+ top: -50%;
+ transform: rotate(-90deg);
+ }
+}
\ No newline at end of file
diff --git a/app/common/styles/base/index.scss b/app/common/styles/base/index.scss
index 5e10e93..81d255d 100644
--- a/app/common/styles/base/index.scss
+++ b/app/common/styles/base/index.scss
@@ -4,6 +4,7 @@
@import 'mixins';
@import 'core';
@import 'typography';
-@import 'utility';
@import 'buttons';
@import 'forms';
+@import 'icons';
+@import 'utility';
\ No newline at end of file
diff --git a/app/common/styles/base/mixins.scss b/app/common/styles/base/mixins.scss
index e33a44f..e868354 100644
--- a/app/common/styles/base/mixins.scss
+++ b/app/common/styles/base/mixins.scss
@@ -109,41 +109,66 @@
-webkit-animation: progress 2s linear infinite;
-moz-animation: progress 2s linear infinite;
animation: progress 2s linear infinite;
- background-size: 130% 100%;
+ background-size: 165% 100%;
@-webkit-keyframes progress {
0% {
- background-position: 0 0;
+ background-position: -70px 0;
}
100% {
- background-position: -70px 0;
+ background-position: 0 0;
}
}
@-moz-keyframes progress {
0% {
- background-position: 0 0;
+ background-position: -70px 0;
}
100% {
- background-position: -70px 0;
+ background-position: 0 0;
}
}
@-ms-keyframes progress {
0% {
- background-position: 0 0;
+ background-position: -70px 0;
}
100% {
- background-position: -70px 0;
+ background-position: 0 0;
}
}
@keyframes progress {
0% {
- background-position: 0 0;
+ background-position: -70px 0;
}
100% {
- background-position: -70px 0;
+ background-position: 0 0;
}
}
}
+
+@mixin table-row-save {
+ @-webkit-keyframes row-flash {
+ from { background-color: $lightblue; }
+ to { background-color: inherit; }
+ }
+ @-moz-keyframes row-flash {
+ from { background-color: $lightblue; }
+ to { background-color: inherit; }
+ }
+ @-o-keyframes row-flash {
+ from { background-color: $lightblue; }
+ to { background-color: inherit; }
+ }
+ @keyframes row-flash {
+ from { background-color: $lightblue; }
+ to { background-color: inherit; }
+ }
+ .row-flash {
+ -webkit-animation: row-flash 1s infinite; /* Safari 4+ */
+ -moz-animation: row-flash 1s infinite; /* Fx 5+ */
+ -o-animation: row-flash 1s infinite; /* Opera 12+ */
+ animation: row-flash 1s infinite; /* IE 10+ */
+ }
+}
\ No newline at end of file
diff --git a/app/common/styles/base/utility.scss b/app/common/styles/base/utility.scss
index 80449f5..d381101 100644
--- a/app/common/styles/base/utility.scss
+++ b/app/common/styles/base/utility.scss
@@ -34,7 +34,7 @@
justify-content: center;
flex-direction: column;
background: transparent;
- border: 0px;
+ border: 0;
margin: 0;
&:hover {
color: $lightbg__accent;
@@ -74,4 +74,20 @@
.transitionAll {
transition: all .5s ease;
+}
+
+//Uploading
+.uploading {
+ @include indeterminate-bar;
+ font-weight: 700;
+ padding: .2em 6em .2em 1em;
+ margin: .8em 0;
+ width: 100%;
+}
+
+.accessible-text {
+ height: 0;
+ width: 0;
+ position: absolute;
+ overflow: hidden;
}
\ No newline at end of file