src/assets/styles/styles.css
/* HTML Overrides */
body {
background: #f5f5f5;
height: auto;
}
/* Navbar */
.navbar-inverse {
background-color: #323a45;
}
.navbar-inverse .navbar-brand {
color: #ffffff;
}
.navbar-inverse .navbar-nav > li > a {
color: #ffffff;
}
.navbar {
margin-bottom: 0;
}
#about-section {
background-color: #f5f5f5;
height: auto;
padding-top: 25px;
padding-bottom: 25px;
border-bottom: solid 2px #5b616b;
}
#about-section * {
color: #323a45;
}
#about-logo {
padding-top: 25px;
}
.clear-value {
padding-top: 30px;
outline: none;
}
/* Angular Material overrides */
md-toolbar:not(.md-menu-toolbar) {
background-color: #5b616b;
}
md-toolbar h1 {
color: white;
}
.md-button.md-primary.md-raised {
background-color: #0071bc;
}
/* Cards - Graphs - Layout */
#dash-side-number {
font-size: 3.5vw;
margin-bottom: 10px;
margin-top: 0px;
padding-bottom: 10px;
padding-top: 10px;
}
#dash-side-name {
padding-top: 0.65em;
}
#dash-main-number {
font-size: 5.5vw;
padding-top: 10px;
margin-bottom: 25px;
}
#dash-small-number {
font-size: 2.8vw;
padding-top: 10px;
margin-bottom: 10px;
}
#spacer {
margin-top: 50px;
margin-bottom: 50px;
}
.right-lead {
margin: 10px;
}
#line-chart{
margin-bottom: 100px;
}
.filters {
margin-top: 23px;
padding-top: 10px;
}
.graph-card {
padding: 20px;
margin-top: 0px;
}
.right-card {
padding-top: 0px;
margin-top: 0px;
margin-bottom: 10px;
}
.fa-arrow-down {
color: #009F69;
}
.fa-arrow-up {
color: #F7464A;
}
/* Footer */
footer {
background-color: #323a45;
/*margin-top: 100px;*/
color: #ffffff;
padding-top: 20px;
padding-bottom: 20px;
font-weight: 400;
}
footer p {
margin: 0;
}
footer a {
color: white;
text-decoration: underline;
}
.footer-icon {
height: 40px;
}
#techbar {
margin-top: 20px;
padding-bottom: 40px;
}
#produced {
color: #F7464A;
}
#reduced {
color: #009F69;
}
/* 404 message */
#status {
height: 400px;
}
#status h1 {
font-size: 10em;
color: #444444;
}
#status h3 {
font-weight:200;
color: #444444;
}
.error {
color: red;
}
.hint {
position: absolute;
right: auto;
bottom: 7px;
font-size: 12px;
line-height: 14px;
transition: all 0.3s cubic-bezier(0.55, 0, 0.55, 0.2);
color: grey;
}
.card-spacing {
margin-bottom: 10px;
}
/******************************************
Angular Material Directives
*******************************************/
/* Switch - Toggle */
.switchdemoBasicUsage .inset {
padding-left: 25px;
padding-top: 25px;
}
md-content, md-sidenav {
background: #f5f5f5;
}