theme: Add responsive settings for auto-column-grid

inveniosoftware · Aug 8, 2023 · 19eb62d · 19eb62d
1 parent 869fda1
commit 19eb62d
Showing 1 changed file with 18 additions and 0 deletions.
diff --git a/invenio_theme/assets/semantic-ui/less/invenio_theme/theme/globals/site.overrides b/invenio_theme/assets/semantic-ui/less/invenio_theme/theme/globals/site.overrides
@@ -294,6 +294,10 @@ code {
   display: inline;
 }
 
+.display-grid {
+  display: grid !important;
+}
+
 /* Generator functions */
 
 .generate-margins(@max, @direction, @alias, @i: 0) when (@i =< @max) {
@@ -462,6 +466,16 @@ code {
   align-items: center;
   column-gap: 1rem;
 
+  &.no-wrap {
+    @media all and (max-width: @largestTabletScreen) {
+      grid-auto-flow: column;
+      grid-template-columns: auto max-content;
+      grid-auto-columns: max-content;
+      align-items: center;
+      column-gap: 1rem;
+    }
+  }
+
   @media all and (max-width: @largestTabletScreen) {
     grid-auto-flow: row;
     grid-template-columns: minmax(100%, 100%);
@@ -553,6 +567,10 @@ code {
   width: 50% !important;
 }
 
+.min-width-max {
+  min-width: max-content !important;
+}
+
 .flex-direction-column {
   flex-direction: column;
 }