mywebsite/css/main.scss
2021-04-03 20:28:37 +05:00

165 lines
2.9 KiB
SCSS

body {
font: 1.2em/1.4em 'cascadia';
background: #acbb94;
margin: 1em auto;
padding: 0 5%;
font-family: 'cascadia';
}
h1, h2 {line-height: 1.2em}
hr {border: 1px solid #000}
a {color: #3c555f} /* main blog links color */
a {font-size: 17.8px;}
a {text-decoration: none}
.title-main {
color: #554a46;
padding-bottom: 4px;
margin-top: 25px;
margin-bottom: 23px; /* space inbetween "Posts" and first blog title*/
font-weight: bold;
font-size: 30px;
}
.posts {
padding-left: 20px;
padding-top: 2px;
margin: 7px;
margin-right: 3px;
color: #43302c;
text-decoration: underline;
}
.home-text {
color: #3c555f;
font-size: 19px;
font-weight: bold;
}
.browse-text {
color: #3c555f;
font-size: 19px;
font-weight: bold;
}
.info-text {
color: #3c555f;
font-size: 19px;
font-weight: bold;
}
.contact-aqua {
text-align: left;
color: rgb(221, 82, 82); /* contact title main color */
padding-left: 1px;
padding-top: .4px;
padding-bottom: 1px;
margin-top: 2px;
text-decoration: underline;
}
.contact {
text-align: left;
padding-left: 4px;
padding-top: 5px;
color: #3b2d2a;
}
.hrefgit {
color: #3b2d2a;
text-decoration: underline;
}
.hrefpgp {
color: #3b2d2a;
text-decoration: underline;
}
.post-title {
color: #3c555f; /* homepage index dot color */
text-decoration: underline;
}
.blog-context {
color: #43302c; /* blog description color*/
font-size: 17px;
}
.post-title {list-style-position: inside;}
.main {
max-width: 50;
}
header {position: sticky; top: 0; background: #acbb94;}
header img {vertical-align: bottom;}
header img {float: right;}
.back-home-site {
align-text: center;
color: rgb(0, 255, 0);
}
* {
box-sizing: border-box;
}
/* Style inputs */
input[type=text], select, textarea {
width: 100%;
padding: 12px;
border: 1px solid #ccc;
margin-top: 6px;
margin-bottom: 16px;
resize: vertical;
}
input[type=submit] {
background-color: #3c555f;
color: white;
padding: 12px 20px;
border: none;
cursor: pointer;
}
input[type=submit]:hover {
background-color: #acbb94;
}
/* Style the container/contact section */
.container {
border-radius: 5px;
background-color: #acbb94;
padding: 10px;
}
/* Create two columns that float next to eachother */
.column {
float: left;
width: 50%;
margin-top: 6px;
padding: 20px;
}
/* Clear floats after the columns */
.row:after {
content: "";
display: table;
clear: both;
}
/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
.column, input[type=submit] {
width: 100%;
margin-top: 0;
}
}