Fix movie columns

LkeMitchll · Mar 6, 2023 · eb3d3a2 · eb3d3a2
1 parent 027bf23
commit eb3d3a2
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 2 deletions.
diff --git a/src/_includes/css/blocks/movies.css b/src/_includes/css/blocks/movies.css
@@ -1,11 +1,13 @@
 .movies {
-  @media (max-width: 900px) {
+  --cols: 2;
+
+  @media screen and (min-width: 700px) {
     & {
       --cols: 3;
     }
   }
 
-  @media (min-width: 900px) {
+  @media screen and (min-width: 900px) {
     & {
       --cols: 6;
 

diff --git a/src/_includes/css/compositions/columns.css b/src/_includes/css/compositions/columns.css
@@ -1,6 +1,7 @@
 .columns {
   display: grid;
   grid-gap: var(--row-gap, var(--space-large)) var(--gap, var(--space-large));
+  grid-template-columns: repeat(var(--cols, 1), minmax(0, 1fr));
 
   &[data-row-gap="none"] {
     grid-row-gap: 0;