diff --git a/src/patterns/01-core/props/_media.scss b/src/patterns/01-core/props/_media.scss index e50b98316020c31a04c6eedcd56d29fc67065376..fa87f208802440dbd40ef2f1fc20754355606005 100644 --- a/src/patterns/01-core/props/_media.scss +++ b/src/patterns/01-core/props/_media.scss @@ -1,5 +1,5 @@ // Media Query Ranges -$screen-xxs: 240px; +$screen-xxs: 20rem; $screen-xs: 30rem; $screen-fb: 37.5rem; $screen-sm: 40.06rem; diff --git a/src/patterns/04-components/view/_view.scss b/src/patterns/04-components/view/_view.scss index b7266ccb7cb92a2dc7914b3e860d72d14047625d..b28a23f6f0c0ab339b52c781553ffa6e0cf13229 100644 --- a/src/patterns/04-components/view/_view.scss +++ b/src/patterns/04-components/view/_view.scss @@ -13,16 +13,11 @@ $sidebar-width: 18.75rem; @include uw-contained-width; position: relative; width: 100%; + &.block-views, .block-views &, .block-layout-builder &{ padding: 0; } - @media(min-width: $screen-xl) { - .block-views &, - .block-layout-builder & { - padding: 0; - } - } } &s-projects-container{ margin-left: auto; @@ -49,11 +44,27 @@ $sidebar-width: 18.75rem; @include uw-contained-width; display: flex; gap: var(--size-1); + grid-row-gap: 0; + height: var(--size-6); justify-content: flex-end; + // Moving the rss button up for the blog news and events + margin-top: -3rem; padding: 0; .button{ margin: 0; } + .path-services & { + margin-top: 0; + @media(min-width: $screen-md) { + margin-top: -3rem; + } + } + .path-events &{ + margin-top: 0; + @media(min-width: 375px) { + margin-top: -3rem; + } + } } &-header{ grid-column: 1 / 3; @@ -83,6 +94,8 @@ $sidebar-width: 18.75rem; align-self: flex-end; grid-column: 1 / 2; grid-row: 2 / 3; + margin-bottom: var(--grid-gap); + margin-top: var(--grid-gap); width: 100%; } // With Filters @@ -90,20 +103,25 @@ $sidebar-width: 18.75rem; @media(min-width: $screen-lg) { display: grid; gap: var(--grid-gap); + grid-row-gap: 0; grid-template-columns: auto $sidebar-width; } .view-content { grid-column: 1 / 2; - margin-bottom: var(--size-6); width: 100%; } .view-filters { - .views-projects-container &{ - margin-top: var(--size-9); - } h2{ margin-top: 0; } + .views-projects-container &{ + @media(min-width: $screen-lg) { + margin-top: var(--size-1); + h2{ + margin-top: inherit; + } + } + } background: var(--uw-white); grid-column: 2 / 3; height: 0; @@ -234,14 +252,12 @@ $sidebar-width: 18.75rem; @media(min-width: $screen-sm){ display: grid; gap: var(--grid-gap); + grid-row-gap: 0; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(4, min-content); } .views-row{ margin-bottom: var(--grid-gap); - @media(min-width: $screen-sm){ - margin-bottom: 0; - } } } } @@ -259,20 +275,8 @@ $sidebar-width: 18.75rem; } } } - // Moving the rss button up for the blog news and events - .block-page-title-block{ - padding-right: 12rem; - @media(min-width: $screen-sm) { - padding-right: inherit; - } - } - .view-interact{ - margin-top: -4rem; - @media(min-width: $screen-md) { - margin-top: 0; - } - } } + .view-uw-view-news-items, .view-uw-view-blogs, .view-uw-view-events, @@ -287,7 +291,6 @@ $sidebar-width: 18.75rem; } } - .path-catalogs, .path-taxonomy, .path-services { @@ -369,31 +372,20 @@ $sidebar-width: 18.75rem; } .view{ &.with-filters{ - margin: inherit; + margin: 0; .views-element-container { grid-column: 1 / 3; } - .view-interact{ - margin-top: -3.25rem; - @media(min-width: $screen-sm) { - margin-top: -4rem; - } - } > .view-content { - margin: inherit; + margin: 0; > h2{ grid-column: 1 / 3; - margin: inherit; - //padding: 0 var(--size-2); - //@media(min-width: 75rem) { - // padding-left: 0; - // padding-right: 0; - //} + margin: 0; width: 100%; } } .view-footer{ - padding: var(--size-2); + padding: 0 0 var(--size-6) 0; text-align: center; @media(min-width: $screen-sm) { grid-column: 1 / 3; @@ -405,16 +397,12 @@ $sidebar-width: 18.75rem; } } &.view-uw-view-projects{ - .view-content{ - //grid-template-rows: auto; - //margin: inherit; - } &.view-display-id-search{ &_page{ .view-content{ margin-top: var(--size-1); @media(min-width: $screen-md) { - margin-top: var(--size-6); + margin-top: var(--size-4); } } } diff --git a/src/patterns/04-components/view/view-content/_view-content.scss b/src/patterns/04-components/view/view-content/_view-content.scss index 346a43464b413e8a5d6d0b5fbd441d892792d349..63b9a85c688ad73ed0d56ecac23a27de363c0bdc 100644 --- a/src/patterns/04-components/view/view-content/_view-content.scss +++ b/src/patterns/04-components/view/view-content/_view-content.scss @@ -9,16 +9,27 @@ &--message { margin-top: var(--size-2); } - @media(min-width: $screen-md) { + + @media(min-width: $screen-lg) { margin-top: var(--size-6); &--message { margin-top: var(--size-6); } } } - &.view-uw-view-contacts { + + &.view-uw-view-projects { .view-content { - gap: 0; + margin-top: 0; + @media(min-width: $screen-lg) { + margin-top: var(--size-105); + } + } + + &.view-uw-view-contacts { + .view-content { + gap: 0; + } } } }