diff options
Diffstat (limited to 'web/app.css')
| -rw-r--r-- | web/app.css | 48 |
1 files changed, 47 insertions, 1 deletions
diff --git a/web/app.css b/web/app.css index 897fd0cbc..eb0fdf136 100644 --- a/web/app.css +++ b/web/app.css @@ -1,3 +1,13 @@ +.status-color-online { + background-color: rgba(77, 250, 144, 0.3); +} +.status-color-unknown { + background-color: rgba(250, 190, 77, 0.3); +} +.status-color-offline { + background-color: rgba(255, 84, 104, 0.3); +} + .state-indicator { position: absolute; top: -999em; @@ -12,8 +22,44 @@ } #attribution { - position: fixed; + position: absolute; bottom: 10px; right: 15px; font-size: x-small; } + +#spinner { + position: absolute; + top: 50%; + left: 50%; + height: 60px; + width: 60px; + margin-top: -30px; + margin-left: -30px; + -webkit-animation: rotation .8s infinite linear; + -moz-animation: rotation .8s infinite linear; + -o-animation: rotation .8s infinite linear; + animation: rotation .8s infinite linear; + border-left: 6px solid rgba(56, 146, 212, .15); + border-right: 6px solid rgba(56, 146, 212, .15); + border-bottom: 6px solid rgba(56, 146, 212, .15); + border-top: 6px solid rgba(56, 146, 212, .8); + border-radius: 100%; +} + +@-webkit-keyframes rotation { + from { -webkit-transform: rotate(0deg); } + to { -webkit-transform: rotate(359deg); } +} +@-moz-keyframes rotation { + from { -moz-transform: rotate(0deg); } + to { -moz-transform: rotate(359deg); } +} +@-o-keyframes rotation { + from { -o-transform: rotate(0deg); } + to { -o-transform: rotate(359deg); } +} +@keyframes rotation { + from { transform: rotate(0deg); } + to { transform: rotate(359deg); } +} |