diff --git a/opentech/static_src/src/app/src/components/SubmissionsGrid/style.scss b/opentech/static_src/src/app/src/components/SubmissionsGrid/style.scss index c6a059733cac0b3904a7f1a6354804203a1dbd1b..dc50e146f2d691f7998a0f0f8b81cce124073a33 100644 --- a/opentech/static_src/src/app/src/components/SubmissionsGrid/style.scss +++ b/opentech/static_src/src/app/src/components/SubmissionsGrid/style.scss @@ -1,6 +1,11 @@ .submissions-grid { margin: 0 -20px; + // temporary to visualise middle column + > div:nth-child(2) { + background-color: white; + } + @include media-query(tablet-landscape) { display: grid; grid-template-columns: 28% 1fr 28%; @@ -17,6 +22,10 @@ grid-template-columns: 20% 1fr 28%; } + @include media-query(desktop-medium) { + grid-template-columns: 1fr 1280px 1fr; + } + &__header { @include submission-list-item; padding: 15px 20px; diff --git a/opentech/static_src/src/sass/apply/abstracts/_variables.scss b/opentech/static_src/src/sass/apply/abstracts/_variables.scss index d77a0c1bf634adeac6ff1de38fd4e4955e404630..b18005a2a1857d91f1721313012892c4d181c69c 100644 --- a/opentech/static_src/src/sass/apply/abstracts/_variables.scss +++ b/opentech/static_src/src/sass/apply/abstracts/_variables.scss @@ -97,6 +97,7 @@ $breakpoints: ( 'tablet-landscape' '(min-width: 1024px)', 'laptop-short' '(min-width: 1024px) and (max-height: 1280px)', 'desktop' '(min-width: 1320px)', + 'desktop-medium' '(min-width: 1920px)', 'desktop-wide' '(min-width: 2556px)' ); diff --git a/opentech/static_src/src/sass/public/abstracts/_variables.scss b/opentech/static_src/src/sass/public/abstracts/_variables.scss index 8545b9184473fddf3b1265333fe22b842cc6d0cd..e501e189b0d40067423ab61d8e127718ec3e15f5 100644 --- a/opentech/static_src/src/sass/public/abstracts/_variables.scss +++ b/opentech/static_src/src/sass/public/abstracts/_variables.scss @@ -92,7 +92,7 @@ $breakpoints: ( 'tablet-portrait' '(min-width: 768px)', 'tablet-landscape' '(min-width: 1024px)', 'desktop' '(min-width: 1320px)', - 'deskop-wide' '(min-width: 2556px)' + 'desktop-wide' '(min-width: 2556px)' ); // Transition