From 7b6e32c2388efca2964e27c51d574c70a5bd6842 Mon Sep 17 00:00:00 2001
From: Kris <kris.aubuchon@discourse.org>
Date: Thu, 19 Oct 2023 12:20:03 -0400
Subject: [PATCH] UX: move global option to sidebar modal footer, shorten
 translation (#24024)

---
 .../components/modal/sidebar-section-form.hbs | 50 +++++++++----------
 .../stylesheets/common/base/sidebar.scss      | 40 +++++++++------
 config/locales/client.en.yml                  |  2 +-
 3 files changed, 51 insertions(+), 41 deletions(-)

diff --git a/app/assets/javascripts/discourse/app/components/modal/sidebar-section-form.hbs b/app/assets/javascripts/discourse/app/components/modal/sidebar-section-form.hbs
index 7016b68ce20..4d9e3633913 100644
--- a/app/assets/javascripts/discourse/app/components/modal/sidebar-section-form.hbs
+++ b/app/assets/javascripts/discourse/app/components/modal/sidebar-section-form.hbs
@@ -82,34 +82,8 @@
           class="btn-flat btn-text add-link"
         />
       {{/if}}
-
-      {{#if (and this.currentUser.admin)}}
-        <div
-          class="row-wrapper mark-public-wrapper
-            {{if this.transformedModel.sectionType '-disabled'}}"
-        >
-          <label class="checkbox-label">
-            {{#if this.transformedModel.sectionType}}
-              <DTooltip
-                @icon="check-square"
-                @content={{i18n "sidebar.sections.custom.always_public"}}
-                class="always-public-tooltip"
-              />
-            {{else}}
-              <Input
-                @type="checkbox"
-                @checked={{this.transformedModel.public}}
-                class="mark-public"
-                disabled={{this.transformedModel.sectionType}}
-              />
-            {{/if}}
-            <span>{{i18n "sidebar.sections.custom.public"}}</span>
-          </label>
-        </div>
-      {{/if}}
     </form>
   </:body>
-
   <:footer>
     <DButton
       @action={{this.save}}
@@ -119,6 +93,30 @@
       id="save-section"
       class="btn-primary"
     />
+    {{#if (and this.currentUser.admin)}}
+      <div
+        class="mark-public-wrapper
+          {{if this.transformedModel.sectionType '-disabled'}}"
+      >
+        <label class="checkbox-label">
+          {{#if this.transformedModel.sectionType}}
+            <DTooltip
+              @icon="check-square"
+              @content={{i18n "sidebar.sections.custom.always_public"}}
+              class="always-public-tooltip"
+            />
+          {{else}}
+            <Input
+              @type="checkbox"
+              @checked={{this.transformedModel.public}}
+              class="mark-public"
+              disabled={{this.transformedModel.sectionType}}
+            />
+          {{/if}}
+          <span>{{i18n "sidebar.sections.custom.public"}}</span>
+        </label>
+      </div>
+    {{/if}}
     {{#if this.canDelete}}
       <DButton
         @icon="trash-alt"
diff --git a/app/assets/stylesheets/common/base/sidebar.scss b/app/assets/stylesheets/common/base/sidebar.scss
index f4ef150d1aa..9a23d722973 100644
--- a/app/assets/stylesheets/common/base/sidebar.scss
+++ b/app/assets/stylesheets/common/base/sidebar.scss
@@ -200,16 +200,7 @@
     .link-icon {
       grid-column: 2;
     }
-    &.mark-public-wrapper {
-      margin-top: 1em;
-      padding-bottom: 0;
-      &.-disabled label {
-        cursor: not-allowed;
-      }
-      label {
-        grid-column: 1 / -1;
-      }
-    }
+
     .input-group {
       margin: 0 0.5em;
       @include breakpoint(mobile-large) {
@@ -239,11 +230,32 @@
     }
   }
   .modal-footer {
-    display: flex;
-    justify-content: space-between;
-
+    display: grid;
+    grid-template-columns: auto 1fr auto;
+    gap: 0.5em;
+    @include breakpoint(mobile-extra-large) {
+      grid-template-columns: auto 1fr;
+      justify-items: left;
+      .mark-public-wrapper {
+        grid-row: 1;
+        grid-column: 1 / span 2;
+      }
+      .checkbox-label {
+        padding: 0 0 0.5em 0;
+      }
+    }
+    .reset-link,
     .delete {
-      margin-right: 0;
+      margin: 0;
+      justify-self: right;
+    }
+    .mark-public-wrapper {
+      &.-disabled label {
+        cursor: not-allowed;
+      }
+      .checkbox-label {
+        margin: 0;
+      }
     }
   }
   .select-kit.multi-select .multi-select-header .formatted-selection {
diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml
index 4b1b97fdf40..2f449543cef 100644
--- a/config/locales/client.en.yml
+++ b/config/locales/client.en.yml
@@ -4493,7 +4493,7 @@ en:
           delete: "Delete"
           delete_confirm: "Are you sure you want to delete this section?"
           reset_confirm: "Are you sure you want to reset this section to default?"
-          public: "Make this section public and visible to everyone"
+          public: "Visible to everyone"
           always_public: "Content in this section is always public"
           more_menu: "More menu"
           links: