From f5062962bb9c093921da2e98d69a025525e73314 Mon Sep 17 00:00:00 2001
From: nanaya <me@nanaya.net>
Date: Thu, 30 Jan 2025 21:28:50 +0900
Subject: [PATCH] More usable team settings page on mobile

---
 resources/css/bem/team-settings.less | 23 +++++++++++++++++------
 1 file changed, 17 insertions(+), 6 deletions(-)

diff --git a/resources/css/bem/team-settings.less b/resources/css/bem/team-settings.less
index 407ad8c3e4a..28ab78f8182 100644
--- a/resources/css/bem/team-settings.less
+++ b/resources/css/bem/team-settings.less
@@ -3,7 +3,11 @@
 
 .team-settings {
   display: grid;
-  gap: 5px;
+  gap: 15px 5px;
+
+  @media @desktop {
+    gap: 5px;
+  }
 
   &__buttons {
     display: flex;
@@ -30,20 +34,27 @@
   }
 
   &__item {
+    --grid-columns: 1fr;
+    --grid-columns-desktop: 2fr 1fr;
+    align-items: start;
     display: grid;
-    grid-template-columns: 2fr 1fr;
-    gap: 15px;
+    gap: 5px 15px;
+    grid-template-columns: var(--grid-columns);
+
+    @media @desktop {
+      --grid-columns: var(--grid-columns-desktop);
+    }
 
     &--buttons {
-      grid-template-columns: 1fr auto;
+      --grid-columns-desktop: 1fr auto;
     }
 
     &--description {
-      grid-template-columns: 1fr 1fr;
+      --grid-columns-desktop: 1fr 1fr;
     }
 
     &--image {
-      grid-template-columns: 1fr;
+      --grid-columns-desktop: 1fr;
     }
   }
 }