From 71fc850df4dc724391a77afbb9beab33622a6102 Mon Sep 17 00:00:00 2001
From: infinite-persistence <inf.persistence@gmail.com>
Date: Mon, 29 Nov 2021 20:36:45 +0800
Subject: [PATCH] Settings Page: maximize width usage in mobile

---
 ui/scss/component/_main.scss   | 4 ++++
 ui/scss/component/section.scss | 8 ++++++++
 2 files changed, 12 insertions(+)

diff --git a/ui/scss/component/_main.scss b/ui/scss/component/_main.scss
index 266d66428..9de19cd56 100644
--- a/ui/scss/component/_main.scss
+++ b/ui/scss/component/_main.scss
@@ -278,6 +278,10 @@
   margin-top: var(--spacing-m);
   padding: 0 var(--spacing-m);
 
+  @media (max-width: $breakpoint-small) {
+    padding: 0 0;
+  }
+
   .card__subtitle {
     margin: 0 0 var(--spacing-s) 0;
     font-size: var(--font-small);
diff --git a/ui/scss/component/section.scss b/ui/scss/component/section.scss
index 37e75f347..4a5af8e41 100644
--- a/ui/scss/component/section.scss
+++ b/ui/scss/component/section.scss
@@ -216,6 +216,14 @@
   }
 }
 
+.card__main-actions.settings__row {
+  @media (max-width: $breakpoint-small) {
+    padding: var(--spacing-s);
+    margin-top: 0;
+    margin-bottom: 0;
+  }
+}
+
 .settings__row--title {
   min-width: 100%;
   align-self: flex-start;