// colors (edit these to change the colors of parts of the site's design) $body-bg-color: white; // background color $header-title-color: blue; // color of title of website $header-bg-color: white; // color of nav bar $footer-color: silver; // color of footer icons $post-title-color: gray; // color of post titles $post-date-color: darkgray; // color of post dates $page-title-color: gray; // color of page titles
body{
background-color: white;
}
.header .container {
padding-top: 1em; // edit to move nav bar up or down
}
.navbar-light .navbar-brand{
color: $header-title-color;
}
.navbar {
background-color: white;
}
.footer{
margin-top: 4em;
}
.social-media-list li{
display: inline; margin-right: 1em;
}
.svg-icon{
fill: $footer-color; width: 1em;
}
.grid-square-og {
height: 100%; object-fit: contain;
}
.grid-masonry {
border: none; padding-top: 0.5em;
}
.image-container{
display: inline-block; padding: 0.5em;
}
@media (min-width: 576px){
.image-container { height: 183px; width: 183px; overflow: hidden; }
}
@media (min-width: 768px){
.image-container { height: 240px; width: 240px; overflow: hidden; }
}
@media (min-width: 992px){
.image-container { height: 322px; width: 322px; overflow: hidden; }
}
@media (min-width: 1200px){
.image-container { height: 380px; width: 380px; overflow: hidden; }
}
.post-title{
font-size: 1.5em; color: $post-title-color;
}
.post-date{
font-size: 0.9em; color: $post-date-color;
}
.post-content{
margin-top: 1em;
}
.post img{
padding-top: 0.5em; padding-bottom: 0.5em;
}
.post-text-container{
margin-top: 0.5em; // edit to move post title/date/content up or down
}
.page-title{
font-size: 2em; color: $page-title-color; margin-bottom: 0.5em;
}