cleaned alternate layouts

14f00cd7 · Olivia206 · 94b876af · 14f00cd7 · 14f00cd7 · 14f00cd7
Commit 14f00cd7 authored 10 months ago by Olivia206
--- a/assets/sass/_theme/blocks/pages.sass
+++ b/assets/sass/_theme/blocks/pages.sass
@@ -229,32 +229,23 @@
    &--alternate
        .top
            @include top-flex
-        .grid
-            article .media img
-                aspect-ratio: unset
-        @include media-breakpoint-up(desktop)
-            article
-                width: columns(4)
-                &:not(:first-child)
-                    margin-top: -5%
-                &:nth-child(even)
-                    margin-left: auto
-                &.image-portrait
-                    + .image-portrait
-                        margin-top: -30%
-                    + .image-square,
-                    + .image-landscape
-                        margin-top: -15%
+        .alternate
+            article 
+                position: relative
+                display: flex
+                flex-direction: column
+                a
+                    @include stretched-link
+                .media 
+                    margin-bottom: $spacing-2
+                    order: -1
+                    img
+                        aspect-ratio: unset
        @include in-page-without-sidebar
            .top
                .description
                    @include body-text
-            .grid
-                width: columns(10)
-                margin-left: auto
-                margin-right: auto
-                article
-                    width: columns(4)
+
    &--large
        .top
            @include top-flex

--- a/assets/sass/_theme/blocks/posts.sass
+++ b/assets/sass/_theme/blocks/posts.sass
@@ -263,20 +263,7 @@
    &--alternate .alternate
        .post .media img
            aspect-ratio: unset
-        
        @include media-breakpoint-up(desktop)
-            &:not(.without-images) 
-                .post
-                    &.right
-                        margin-left: auto
-                    &.portrait
-                        + .portrait
-                            margin-top: -30%
-                        + .square,
-                        + .landscape
-                            margin-top: -15%
-                        + .post:not(.portrait, .square, .landscape)
-                            margin-top: -5%
            &.without-images
                .right
                    margin-left: auto
@@ -288,7 +275,6 @@
                        margin-top: -5%
                    + .post:not(.portrait, .square, .landscape)
                        margin-top: -3%
-
        @include media-breakpoint-down(desktop)
            .post 
                .post-meta
@@ -298,16 +284,6 @@
                + .post
                    margin-top: $spacing-5

-        @include in-page-with-sidebar
-            .post
-                width: columns(4)
-
-        @include in-page-without-sidebar
-            width: columns(10)
-            margin-left: auto
-            margin-right: auto
-            .post
-                width: columns(4)
    &--carousel
        @include draggable-block
        .container

--- a/assets/sass/_theme/blocks/projects.sass
+++ b/assets/sass/_theme/blocks/projects.sass
@@ -16,6 +16,7 @@
                margin-right: $spacing-1
            a
                flex: 1
+                text-decoration: none
            &:hover
                &,
                a
@@ -29,34 +30,15 @@
        @include media-breakpoint-down(desktop)
            .project + .project
                margin-top: $spacing-4
-
-    .alternate
-        @include media-breakpoint-up(desktop)
-            article
-                width: columns(4)
-                &:not(:first-child)
-                    margin-top: -5%
-                &:nth-child(even)
-                    margin-left: auto
-                &.image-portrait
-                    + .image-portrait
-                        margin-top: -30%
-                    + .image-square,
-                    + .image-landscape
-                        margin-top: -15%
+    &--alternate
+        .alternate
+            @include media-breakpoint-down(desktop)
+                .project + .project
+                    margin-top: $spacing-4
        @include in-page-without-sidebar
            .top
                .description
                    @include body-text
-            .grid
-                width: columns(10)
-                margin-left: auto
-                margin-right: auto
-                article
-                    width: columns(4)
-        @include media-breakpoint-down(desktop)
-            .project + .project
-                margin-top: $spacing-4

    .large
        .project
@@ -94,7 +76,7 @@
            .project
                &-title
                    @include h2
-                    margin-bottom: space(4)
+                    margin-bottom: $spacing-1
                &-content
                    flex: 1
                .media 

--- a/assets/sass/_theme/design-system/layout.sass
+++ b/assets/sass/_theme/design-system/layout.sass
@@ -123,4 +123,28 @@ details
                position: absolute
                padding: 0
                right: 0
-                top: 0
\ No newline at end of file
+                top: 0
+
+.alternate
+    article
+        @include media-breakpoint-up(desktop)
+            width: columns(4)
+            &:not(:first-child)
+                margin-top: -5%
+            &:nth-child(even)
+                margin-left: auto
+            &.portrait
+                + .portrait
+                    margin-top: -30%
+                + .square,
+                + .landscape
+                    margin-top: -15%
+                + article:not(.portrait, .square, .landscape)
+                    margin-top: -5%
+            &.square + .square
+                margin-top: -10%
+    @include in-page-with-sidebar
+    @include in-page-without-sidebar
+        width: columns(10)
+        margin-left: auto
+        margin-right: auto
\ No newline at end of file
--- a/assets/sass/_theme/sections/projects.sass
+++ b/assets/sass/_theme/sections/projects.sass
 .project
    @include article(auto)
-    .project-title
-        @include article-title
-    
+    .project-content
+        p
+            line-height: $small-line-height
+        .project-title
+            @include article-title
    .media img
        width: 100%
    @include media-breakpoint-up(desktop)

--- a/layouts/partials/blocks/templates/pages/alternate.html
+++ b/layouts/partials/blocks/templates/pages/alternate.html
@@ -7,12 +7,12 @@
        "attributes" "class='page-title'"
 )}}

-<div class="grid">
+<div class="alternate">
  {{ range .pages }}
    {{ $page := site.GetPage .file }}
    {{ with $page }}
      {{ if .Params.image }}
-        {{ $image_class = printf "image-%s" (partial "GetImageDirection" .Params.image) }}
+        {{ $image_class = printf (partial "GetImageDirection" .Params.image) }}
      {{ else }}
        {{ $image_class = "" }}
      {{ end }}