diff --git a/.gitignore b/.gitignore index d298be1..56b7287 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,2 @@ -public/ \ No newline at end of file +public/ +static/processed_images diff --git a/sass/style.scss b/sass/style.scss index b88cf0b..31a952b 100644 --- a/sass/style.scss +++ b/sass/style.scss @@ -1,5 +1,6 @@ $primary-color: #505050; $primary-color-dark: #282828; +$primary-color-darker: #212121; $primary-color-light: #7c7c7c; $secondary-color: #333f58; @@ -9,6 +10,7 @@ $secondary-color-dark: #09192f; $background-color: #121212; $text-color: #e2e2e2; $panel-color: $primary-color-dark; +$panel-color-dark: $primary-color-darker; $toolbar-color: $primary-color; @font-face { @@ -341,6 +343,49 @@ article.post .post-date { margin-bottom: 1em; } +.project-cards { + display: flex; + justify-content: space-around; + flex-wrap: wrap; +} + +.project-card { + width: 100%; + background-color: $panel-color-dark; + margin: 0.75em; + padding: 0 0.75em; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); +} + +@media only screen and (min-width: 600px) { + .project-card { + width: 45%; + } +} + +@media only screen and (min-width: 800px) { + .project-card { + width: 30%; + } +} + +.project-card:hover { + box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22); +} + +.project-card a { + text-decoration: none; +} + +.project-card h2 { + text-align: center; +} + +.project-card img { + max-width: 100%; +} + /* CV */ .cv.panel { diff --git a/templates/index.html b/templates/index.html index b0f100b..c6b16bd 100644 --- a/templates/index.html +++ b/templates/index.html @@ -24,11 +24,23 @@ Curriculum Vitae + + {% endblock %}