From 9ef30af822abd72a46a25d8be10501f3c7bc831d Mon Sep 17 00:00:00 2001
From: Olivia206 <olivia.simonet206@gmail.com>
Date: Thu, 19 Sep 2024 13:03:55 +0200
Subject: [PATCH] project index wip

---
 assets/sass/_configuration.sass |  5 +++
 assets/sass/_style.sass         | 57 +++++++++++++++++++++++++++++++--
 config/_default/config.yaml     |  8 ++++-
 3 files changed, 67 insertions(+), 3 deletions(-)

diff --git a/assets/sass/_configuration.sass b/assets/sass/_configuration.sass
index c5a8a4b..890a450 100644
--- a/assets/sass/_configuration.sass
+++ b/assets/sass/_configuration.sass
@@ -21,6 +21,11 @@ $h1-size: pxToRem(35)
 $h1-font-family: $body-font-family
 $h1-size-desktop: pxToRem(85)
 $h1-weight: $heading-font-weight
+$h2-font-family: $h1-font-family
+$h2-size: pxToRem(35)
+$h2-size-desktop: pxToRem(49)
+
+$meta-font-family: $heading-font-family
 
 // header
 $header-background: $yellow
diff --git a/assets/sass/_style.sass b/assets/sass/_style.sass
index a0db2c4..b3f9239 100644
--- a/assets/sass/_style.sass
+++ b/assets/sass/_style.sass
@@ -11,6 +11,11 @@ main
     .posts__page &
         background-color: $green
 
+body:not(.page__home) 
+    .media,
+    figure
+        mix-blend-mode: multiply
+
 // Yellow hero
 .page__home,
 .posts__page
@@ -164,7 +169,6 @@ footer#document-footer
             justify-content: space-between
         figure
             max-width: pxToRem(192)
-            mix-blend-mode: multiply
     @include media-breakpoint-down(desktop)
         .block-gallery--grid 
             padding: 0
@@ -183,4 +187,53 @@ footer#document-footer
             .hero-text
                 margin-top: var(--header-height)
                 padding-top: $spacing-4
-        
\ No newline at end of file
+
+// Projects
+.projects__section
+    main
+        margin-top: var(--header-height)
+        .container
+            max-width: unset
+            width: auto
+        @include media-breakpoint-up(xl)
+            display: flex
+            gap: var(--grid-gutter)
+            .hero
+                flex: 1
+                > .container
+                    padding-right: 0
+                .hero-text
+                    margin-top: 0
+                    width: columns(4)
+                    @include media-breakpoint-down(xxl)
+                        h1
+                            font-size: pxToRem(75)
+            .document-content
+                flex: 1
+                padding-top: $spacing-6
+                > .container
+                    padding-left: 0
+                .project
+                    flex-direction: row
+                    &-content
+                        width: columns(5)
+                    .media
+                        width: columns(3)
+.projects
+    .project
+        &-description
+            @include meta
+        .media img
+            aspect-ratio: 320/399
+    @include media-breakpoint-down(desktop)
+        .project-content .project-title
+            @include h2
+    @include media-breakpoint-up(desktop)
+        &.projects--list
+            .project        
+                margin-bottom: $spacing-4
+                padding-bottom: $spacing-4
+            .project-description
+                display: flex
+                flex-direction: column
+                justify-content: space-between
\ No newline at end of file
diff --git a/config/_default/config.yaml b/config/_default/config.yaml
index 07cdad6..61a612c 100644
--- a/config/_default/config.yaml
+++ b/config/_default/config.yaml
@@ -10,4 +10,10 @@ params:
   image_sizes:
     design_system:
       lightbox:
-        disabled: true
\ No newline at end of file
+        disabled: true
+  projects:
+    index:
+      layout: list
+  posts:
+    index:
+      layout: grid
\ No newline at end of file