overseer/assets/styles/gargoyle.scss

106 lines
1.6 KiB
SCSS

$primary-color: orangered;
$primary-color-highlight: darken($primary-color, 10%);
$box-shadow-1: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
$box-shadow-2: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
$nav-bar-height: 60px;
body{
padding: $nav-bar-height 0 0;
background: lightgrey;
}
a{
color: $primary-color;
transition: all 230ms ease-in-out;
&:hover{
color: $primary-color-highlight;
}
}
.button.button-primary,
button.button-primary,
input[type="button"].button-primary,
input[type="reset"].button-primary,
input[type="submit"].button-primary{
background-color: $primary-color;
color: white;
transition: all 230ms ease-in-out;
&:hover{
background-color: $primary-color-highlight;
}
}
.container.fluid{
max-width: 100%;
}
#nav-bar{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: $nav-bar-height;
background: #212121;
box-shadow: $box-shadow-1;
color: white;
.nav-bar-left{
float: left;
}
ul{
list-style: none;
li{
display: inline-block;
}
}
.site-logo,
.nav-link a{
padding: 10px 12px;
font-size: 2.5rem;
text-decoration: none;
}
.site-logo{
padding-left: 35px;
font-weight: bold;
}
}
#main-content{
margin-top: 25px;
padding: 20px 32px;
background: white;
box-shadow: $box-shadow-2;
}
#record-actions{
p{
margin-bottom: 0;
font-size: 2rem;
}
}
#item-header{
margin-bottom: 25px;
h1,
p{
display: inline-block;
margin-bottom: 7px;
}
.item-added-date,
.item-updated-date{
margin-bottom: 5px;
color: #666;
font-size: 1.6rem;
font-style: italic;
}
}