/* Theme Name: Sahithyen’s Blog Theme URI: blog.sahithyen.com Author: Sahithyen (sahtihyen@me.com) Author URI: sahithyen.com Description: A minimalistic theme for Sahithyen’s Blog Version: 1.0 Tags: black, blue, light, one-column */

/**

*
* Imports
*

**/ @import “skeleton”; @import “variables”;

/**

*
* Main
*

**/

// Typography body {

font-family: $body-font;
font-size: $font-size;
line-height: $line-height;
color: $content-color;

} @each $heading, $size in $heading-sizes {

#{$heading} {
    font-family: $heading-font;
    font-size: $size;
}

}

a {

color: $active-color;
text-decoration: none;

}

a:hover {

color: $primary-color;

}

.dropcap {

color: $primary-color;
margin-right: 0.05em;

}

/* General */ $top-bar-height: $top-bar-padding-top + ($font-size * $line-height) + $top-bar-padding-bottom + $top-bar-border-size + $search-input-border-size;

body {

padding-top: $top-bar-height + $top-bar-margin-bottom;

}

.wrapper {

min-height: 100%;
position: relative;

}

.container {

max-width: $container-width;
padding-bottom: 90px;

}

/* Loader */

.ball-scale-multiple, .loader {

width: $loader-text-width;
height: $loader-animation-size + $loader-text-margin-top + ($font-size * $line-height);

}

.loader {

font-family: $active-font;
margin: $loader-margin-top auto $loader-margin-bottom;

}

.ball-scale-multiple {

position: relative;

}

.ball-scale-multiple > div.ball {

background-color: $loader-animation-color;
border-radius: 100%;
animation-fill-mode: both;
position: absolute;
top: 0;
left: ($loader-text-width / 2) - ($loader-animation-size / 2);
opacity: 0;
margin: 0;
width: $loader-animation-size;
height: $loader-animation-size;
animation: ball-scale-multiple 1s 0s linear infinite;

}

.ball-scale-multiple > div.ball:nth-child(2) {

animation-delay: -0.4s;

}

.ball-scale-multiple > div.ball:nth-child(3) {

animation-delay: -0.2s;

}

.ball-scale-multiple > div.text {

position: absolute;
top: $loader-animation-size + $loader-text-margin-top;
left: 0;
width: $loader-text-width;
text-align: center;

} @keyframes ball-scale-multiple {

0% {
    transform: scale(0);
    opacity: 0;
}

5% {
    opacity: 1;
}

100% {
    transform: scale(1);
    opacity: 0;
}

}

/* Top bar */

.top-bar {

font-family: $active-font;
position: fixed;
top: 0;
left: 0;
right: 0;
background-color: $top-bar-color;
z-index: 1000;

}

.top-bar-inner {

padding: $top-bar-padding-top $top-bar-padding-sides $top-bar-padding-bottom;
margin: 0 $top-bar-margin-sides;
border-bottom: $top-bar-border-size solid $top-bar-border-color;

}

.top-bar .item:first-child {

margin-left: 0;

}

.top-bar .item {

margin-left: $top-bar-item-margin;

}

.top-bar form {

margin: 0;
padding: 0;

}

.top-bar input {

margin: 0;
height: $font-size * $line-height;
padding: 0;
border: none;
border-bottom: $search-input-border-size solid $active-color;
border-radius: 0;

}

.top-bar input:focus {

border: none;
border-bottom: $search-input-border-size solid $primary-color;

}

/* Articles */

.content-wrapper {

position: relative;

}

.content-info .category {

font-weight: bold;

} @media screen and (min-width: $content-info-left-min-size) {

.content-info {
    display: inline-block;
    position: absolute;
    left: -($content-info-width + $content-info-margin);
    width: $content-info-width;
    text-align: right;
}

}

/* Archive */

.archive-entry-wrapper {

position: relative;
min-height: 2 * $font-size * $line-height;
margin-bottom: 25px;

}

.archive-info .category {

font-weight: bold;

} @media screen and (min-width: $content-info-left-min-size) {

.archive-info {
    display: inline-block;
    position: absolute;
    left: -($content-info-width + $content-info-margin);
    width: $content-info-width;
    text-align: right;
}

}

/* Footer */

footer {

position: absolute;
bottom: 0;
left: 0;
right: 0;

}

.footer-bar {

background-color: $footer-bar-color;

}

.footer-bar-inner {

margin: 0 $footer-bar-margin-sides;
padding: $footer-bar-padding-top $footer-bar-padding-sides $footer-bar-padding-bottom;
border-top: $footer-bar-border-size solid $footer-bar-border-color;

}