1
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-04-26 14:28:25 -04:00
jarv.is/assets/sass/pages/_projects.scss
Jake Jarvis 363b4edf1c
shift asset processing to webpack (#424)
also migrated SASS to latest syntax (via dart-sass) and vastly simplified light/dark theme logic
2021-06-19 17:19:01 -04:00

88 lines
1.6 KiB
SCSS

@use "../abstracts/themes";
// Video Styles
div.layout-projects {
padding-top: 1.5em;
padding-bottom: 0.75em;
h1 {
margin-top: 0;
margin-bottom: 0.4em;
text-align: center;
letter-spacing: -0.005em;
a {
color: inherit;
}
}
div#content > p {
text-align: center;
}
div#github-cards {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-evenly;
align-items: flex-start;
width: 100%;
div.github-card {
flex-grow: 1;
display: block;
width: 416px;
padding: 12px 16px;
margin: 8px;
border: 1px solid;
border-radius: 6px;
font-size: 0.9em;
@include themes.themed(color, "medium-dark");
@include themes.themed(border-color, "kinda-light");
a.repo-name {
font-size: 1.2em;
font-weight: 600;
}
p.repo-description {
margin: 4px 0 8px 0;
}
div.repo-meta {
display: inline-block;
margin-right: 12px;
font-size: 0.925em;
@include themes.themed(color, "medium");
svg {
display: inline-block;
position: relative;
top: 3px;
margin-right: 2px;
fill: currentColor;
}
span.repo-language-color {
display: inline-block;
width: 14px;
height: 14px;
border-radius: 50%;
position: relative;
top: 2px;
margin-right: 2px;
}
}
}
}
}
// Responsive
@mixin responsive() {
div.layout-projects {
// stylelint-disable-block block-no-empty
}
}