portfolio/assets/styles/main.scss

85 lines
1.3 KiB
SCSS
Executable file

@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville&display=swap');
$lg-breakpoint: 1500px;
$md-breakpoint: 1000px;
$sm-breakpoint: 900px;
$xs-breakpoint: 400px;
$primary: #4ba05f;
$secondary: #a04b8c;
@import './reset.scss';
@import './components/profile.scss';
@import './components/projects.scss';
@import './components/technologies.scss';
@import './components/links.scss';
@import './components/typography.scss';
@import './components/footer.scss';
@import './components/contact.scss';
@import './components/button.scss';
@import './components/chips.scss';
body {
min-height: 100vh;
display: flex;
flex-direction: column;
}
.hidden {
display: none;
}
.container {
width: 70%;
margin: 0 auto;
}
//#2e7d32
.typo, body {
font-family: 'Libre Baskerville', serif;
}
section {
border-bottom: 1px solid gray;
padding-bottom: 1em;
}
section:last-of-type {
border-bottom: 0;
}
.about-header {
margin: 2em 0;
}
@media (min-width: $lg-breakpoint) {
.container {
width: 58%;
}
}
@media (min-width: $md-breakpoint) {
.container {
width: 65%;
}
}
@media (max-width: $md-breakpoint) {
.container {
width: 75%;
}
}
@media (max-width: $sm-breakpoint) {
.container {
width: 90%;
}
}
@media (max-width: $xs-breakpoint) {
}