From a736ff5f69bfbf349e91a8f839c381af26ac841c Mon Sep 17 00:00:00 2001
From: Penar Musaraj <pmusaraj@gmail.com>
Date: Mon, 20 Sep 2021 09:52:03 -0400
Subject: [PATCH] DEV: Clean up some styles (#14374)

---
 .../admin/addon/templates/badges-award.hbs    |  6 +-
 .../admin/addon/templates/badges-show.hbs     | 82 ++++++++++---------
 .../admin/addon/templates/user-badges.hbs     |  4 +-
 .../admin/addon/templates/web-hooks-show.hbs  | 10 +--
 .../stylesheets/common/admin/admin_base.scss  | 24 +-----
 app/assets/stylesheets/common/admin/api.scss  |  2 -
 .../stylesheets/common/admin/badges.scss      | 10 +--
 .../stylesheets/common/admin/customize.scss   |  4 +-
 app/assets/stylesheets/desktop/discourse.scss | 11 +--
 app/assets/stylesheets/desktop/group.scss     |  8 --
 app/assets/stylesheets/desktop/user.scss      |  4 -
 .../stylesheets/mobile/admin_customize.scss   |  5 --
 app/assets/stylesheets/mobile/user.scss       |  4 -
 13 files changed, 62 insertions(+), 112 deletions(-)

diff --git a/app/assets/javascripts/admin/addon/templates/badges-award.hbs b/app/assets/javascripts/admin/addon/templates/badges-award.hbs
index 52bed376233..1020f6369df 100644
--- a/app/assets/javascripts/admin/addon/templates/badges-award.hbs
+++ b/app/assets/javascripts/admin/addon/templates/badges-award.hbs
@@ -4,7 +4,7 @@
 
   {{#if model}}
     <form class="form-horizontal">
-      <div class="badge-preview">
+      <div class="badge-preview control-group">
         {{#if model}}
           {{icon-or-image model}}
           <span class="badge-display-name">{{model.name}}</span>
@@ -12,11 +12,11 @@
           <span class="badge-placeholder">{{i18n "admin.badges.mass_award.no_badge_selected"}}</span>
         {{/if}}
       </div>
-      <div>
+      <div class="control-group">
         <h4>{{i18n "admin.badges.mass_award.upload_csv"}}</h4>
         <input type="file" id="massAwardCSVUpload" accept=".csv" onchange={{action "updateFileSelected"}}>
       </div>
-      <div>
+      <div class="control-group">
         <label>
           {{input type="checkbox" checked=replaceBadgeOwners}}
           {{i18n "admin.badges.mass_award.replace_owners"}}
diff --git a/app/assets/javascripts/admin/addon/templates/badges-show.hbs b/app/assets/javascripts/admin/addon/templates/badges-show.hbs
index e71ed63bb32..736d1b8b431 100644
--- a/app/assets/javascripts/admin/addon/templates/badges-show.hbs
+++ b/app/assets/javascripts/admin/addon/templates/badges-show.hbs
@@ -1,6 +1,6 @@
 {{#d-section class="current-badge content-body"}}
   <form class="form-horizontal">
-    <div>
+    <div class="control-group">
       <label for="name">{{i18n "admin.badges.name"}}</label>
       {{#if readOnly}}
         {{input type="text" name="name" value=buffered.name disabled=true}}
@@ -14,9 +14,9 @@
       {{/if}}
     </div>
 
-    <div>
+    <div class="control-group">
       <label for="graphic">{{i18n "admin.badges.graphic"}}</label>
-      <div class="radios">
+      <div class="radios inline-form full-width">
         <label class="radio-label" for="badge-icon">
           {{radio-button
             name="badge-icon"
@@ -59,7 +59,7 @@
       {{/if}}
     </div>
 
-    <div>
+    <div class="control-group">
       <label for="badge_type_id">{{i18n "admin.badges.badge_type"}}</label>
       {{combo-box
         name="badge_type_id"
@@ -70,7 +70,7 @@
       }}
     </div>
 
-    <div>
+    <div class="control-group">
       <label for="badge_grouping_id">{{i18n "admin.badges.badge_grouping"}}</label>
 
       <div class="badge-grouping-control">
@@ -90,7 +90,7 @@
       </div>
     </div>
 
-    <div>
+    <div class="control-group">
       <label for="description">{{i18n "admin.badges.description"}}</label>
       {{#if buffered.system}}
         {{textarea name="description" value=buffered.description disabled=true}}
@@ -104,7 +104,7 @@
       {{/if}}
     </div>
 
-    <div>
+    <div class="control-group">
       <label for="long_description">{{i18n "admin.badges.long_description"}}</label>
       {{#if buffered.system}}
         {{textarea name="long_description" value=buffered.long_description disabled=true}}
@@ -119,7 +119,7 @@
     </div>
 
     {{#if siteSettings.enable_badge_sql}}
-      <div>
+      <div class="control-group">
         <label for="query">{{i18n "admin.badges.query"}}</label>
         {{ace-editor content=buffered.query mode="sql" disabled=readOnly}}
       </div>
@@ -132,21 +132,21 @@
           {{i18n "loading"}}
         {{/if}}
 
-        <div>
+        <div class="control-group">
           <label>
             {{input type="checkbox" checked=buffered.auto_revoke disabled=readOnly}}
             {{i18n "admin.badges.auto_revoke"}}
           </label>
         </div>
 
-        <div>
+        <div class="control-group">
           <label>
             {{input type="checkbox" checked=buffered.target_posts disabled=readOnly}}
             {{i18n "admin.badges.target_posts"}}
           </label>
         </div>
 
-        <div>
+        <div class="control-group">
           <label for="trigger">{{i18n "admin.badges.trigger"}}</label>
           {{combo-box
             name="trigger"
@@ -159,39 +159,41 @@
       {{/if}}
     {{/if}}
 
-    <div>
-      <label>
-        {{input type="checkbox" checked=buffered.allow_title}}
-        {{i18n "admin.badges.allow_title"}}
-      </label>
-    </div>
+    <div class="control-group">
+      <div>
+        <label>
+          {{input type="checkbox" checked=buffered.allow_title}}
+          {{i18n "admin.badges.allow_title"}}
+        </label>
+      </div>
 
-    <div>
-      <label>
-        {{input type="checkbox" checked=buffered.multiple_grant disabled=readOnly}}
-        {{i18n "admin.badges.multiple_grant"}}
-      </label>
-    </div>
+      <div>
+        <label>
+          {{input type="checkbox" checked=buffered.multiple_grant disabled=readOnly}}
+          {{i18n "admin.badges.multiple_grant"}}
+        </label>
+      </div>
 
-    <div>
-      <label>
-        {{input type="checkbox" checked=buffered.listable disabled=readOnly}}
-        {{i18n "admin.badges.listable"}}
-      </label>
-    </div>
+      <div>
+        <label>
+          {{input type="checkbox" checked=buffered.listable disabled=readOnly}}
+          {{i18n "admin.badges.listable"}}
+        </label>
+      </div>
 
-    <div>
-      <label>
-        {{input type="checkbox" checked=buffered.show_posts disabled=readOnly}}
-        {{i18n "admin.badges.show_posts"}}
-      </label>
-    </div>
+      <div>
+        <label>
+          {{input type="checkbox" checked=buffered.show_posts disabled=readOnly}}
+          {{i18n "admin.badges.show_posts"}}
+        </label>
+      </div>
 
-    <div>
-      <label>
-        {{input type="checkbox" checked=buffered.enabled}}
-        {{i18n "admin.badges.enabled"}}
-      </label>
+      <div>
+        <label>
+          {{input type="checkbox" checked=buffered.enabled}}
+          {{i18n "admin.badges.enabled"}}
+        </label>
+      </div>
     </div>
 
     <div class="buttons">
diff --git a/app/assets/javascripts/admin/addon/templates/user-badges.hbs b/app/assets/javascripts/admin/addon/templates/user-badges.hbs
index a5e66640d3c..1b401b7e42c 100644
--- a/app/assets/javascripts/admin/addon/templates/user-badges.hbs
+++ b/app/assets/javascripts/admin/addon/templates/user-badges.hbs
@@ -14,7 +14,7 @@
       <p>{{i18n "admin.badges.no_badges"}}</p>
     {{else}}
       <form class="form-horizontal">
-        <div>
+        <div class="control-group">
           <label>{{i18n "admin.badges.badge"}}</label>
           {{combo-box
             filterable=true
@@ -23,7 +23,7 @@
             onChange=(action (mut selectedBadgeId))
           }}
         </div>
-        <div>
+        <div class="control-group">
           <label>{{i18n "admin.badges.reason"}}</label>
           {{input type="text" value=badgeReason}}<br><small>{{i18n "admin.badges.reason_help"}}</small>
         </div>
diff --git a/app/assets/javascripts/admin/addon/templates/web-hooks-show.hbs b/app/assets/javascripts/admin/addon/templates/web-hooks-show.hbs
index 83540a03da4..40a365f814b 100644
--- a/app/assets/javascripts/admin/addon/templates/web-hooks-show.hbs
+++ b/app/assets/javascripts/admin/addon/templates/web-hooks-show.hbs
@@ -6,13 +6,13 @@
 <div class="web-hook-container">
   <p>{{i18n "admin.web_hooks.detailed_instruction"}}</p>
   <form class="web-hook form-horizontal">
-    <div>
+    <div class="control-group">
       <label for="payload-url">{{i18n "admin.web_hooks.payload_url"}}</label>
       {{text-field name="payload-url" value=model.payload_url placeholderKey="admin.web_hooks.payload_url_placeholder"}}
       {{input-tip validation=urlValidation}}
     </div>
 
-    <div>
+    <div class="control-group">
       <label for="content-type">{{i18n "admin.web_hooks.content_type"}}</label>
       {{combo-box
         content=contentTypes
@@ -22,13 +22,13 @@
       }}
     </div>
 
-    <div>
+    <div class="control-group">
       <label for="secret">{{i18n "admin.web_hooks.secret"}}</label>
       {{text-field name="secret" value=model.secret placeholderKey="admin.web_hooks.secret_placeholder"}}
       {{input-tip validation=secretValidation}}
     </div>
 
-    <div class="cbox10">
+    <div class="control-group">
       <label>{{i18n "admin.web_hooks.event_chooser"}}</label>
       <div>
         {{radio-button class="subscription-choice" name="subscription-choice" value="individual" selection=model.webHookType}}
@@ -48,7 +48,7 @@
       </div>
     </div>
 
-    <div class="filters">
+    <div class="filters control-group">
       <div class="filter">
         <label>{{d-icon "circle" class="tracking"}}{{i18n "admin.web_hooks.categories_filter"}}</label>
         {{category-selector
diff --git a/app/assets/stylesheets/common/admin/admin_base.scss b/app/assets/stylesheets/common/admin/admin_base.scss
index b3f46e4dd29..922b62587b0 100644
--- a/app/assets/stylesheets/common/admin/admin_base.scss
+++ b/app/assets/stylesheets/common/admin/admin_base.scss
@@ -598,29 +598,11 @@ $mobile-breakpoint: 700px;
   }
 }
 
-.groups,
 .badges,
 .web-hook-container {
-  .form-horizontal {
-    & > div {
-      margin-bottom: 20px;
-    }
-    .d-editor-textarea-wrapper {
-      max-width: 60%;
-      .d-editor-button-bar {
-        overflow: hidden;
-      }
-    }
-    input,
-    textarea,
-    select,
-    .select-box {
-      width: 350px;
-    }
-    input[type="checkbox"],
-    input[type="radio"] {
-      width: 20px;
-    }
+  input[type="text"],
+  textarea {
+    min-width: 350px;
   }
 }
 
diff --git a/app/assets/stylesheets/common/admin/api.scss b/app/assets/stylesheets/common/admin/api.scss
index b7e19b66655..91d25c87a5c 100644
--- a/app/assets/stylesheets/common/admin/api.scss
+++ b/app/assets/stylesheets/common/admin/api.scss
@@ -252,8 +252,6 @@ table.api-keys {
     border-bottom: var(--primary-low) 1px solid;
   }
   .filters {
-    margin: 5px 0;
-    padding-bottom: 5px;
     border-bottom: var(--primary-low) 1px solid;
     .filter {
       margin-bottom: 1em;
diff --git a/app/assets/stylesheets/common/admin/badges.scss b/app/assets/stylesheets/common/admin/badges.scss
index 71cf7b3260e..a22bbdd3739 100644
--- a/app/assets/stylesheets/common/admin/badges.scss
+++ b/app/assets/stylesheets/common/admin/badges.scss
@@ -80,15 +80,7 @@
       width: 350px;
     }
   }
-  .form-horizontal {
-    .radios {
-      display: flex;
-
-      .radio-label {
-        margin-right: 1.5em;
-      }
-    }
-
+  .current-badge {
     .ace-wrapper {
       position: relative;
       height: 270px;
diff --git a/app/assets/stylesheets/common/admin/customize.scss b/app/assets/stylesheets/common/admin/customize.scss
index 8954f928985..f7a9f7721cd 100644
--- a/app/assets/stylesheets/common/admin/customize.scss
+++ b/app/assets/stylesheets/common/admin/customize.scss
@@ -351,7 +351,9 @@
       }
     }
     .setting-label {
-      width: 25%;
+      @include breakpoint(tablet, min-width) {
+        width: 25%;
+      }
       word-wrap: break-word;
       h3 {
         margin-top: 0;
diff --git a/app/assets/stylesheets/desktop/discourse.scss b/app/assets/stylesheets/desktop/discourse.scss
index cf56fab5be9..8fb5a9dd553 100644
--- a/app/assets/stylesheets/desktop/discourse.scss
+++ b/app/assets/stylesheets/desktop/discourse.scss
@@ -122,14 +122,9 @@ input {
 }
 
 .form-horizontal {
-  .hide {
-    display: none;
-  }
-
-  input,
-  textarea,
-  select {
-    display: inline-block;
+  input[type="text"],
+  input[type="password"],
+  textarea {
     margin-bottom: 0;
   }
 
diff --git a/app/assets/stylesheets/desktop/group.scss b/app/assets/stylesheets/desktop/group.scss
index eb919c8d968..606b402ff8e 100644
--- a/app/assets/stylesheets/desktop/group.scss
+++ b/app/assets/stylesheets/desktop/group.scss
@@ -34,14 +34,6 @@
   width: 85%;
 }
 
-.group-manage {
-  .form-horizontal {
-    button {
-      float: none;
-    }
-  }
-}
-
 .groups-form.groups-notifications-form {
   width: 500px;
   max-width: 100%;
diff --git a/app/assets/stylesheets/desktop/user.scss b/app/assets/stylesheets/desktop/user.scss
index f1141c2ca71..21f6c458eca 100644
--- a/app/assets/stylesheets/desktop/user.scss
+++ b/app/assets/stylesheets/desktop/user.scss
@@ -8,10 +8,6 @@
   }
 }
 
-.form-horizontal .control-group.category {
-  margin-top: 18px;
-}
-
 .user-profile-hidden {
   font-size: 1.5em;
   text-align: center;
diff --git a/app/assets/stylesheets/mobile/admin_customize.scss b/app/assets/stylesheets/mobile/admin_customize.scss
index 8f814da4bb5..08a0cce3a17 100644
--- a/app/assets/stylesheets/mobile/admin_customize.scss
+++ b/app/assets/stylesheets/mobile/admin_customize.scss
@@ -10,11 +10,6 @@ body .admin-customize {
     margin-bottom: 1em;
   }
 
-  .form-horizontal.theme.settings .setting-label,
-  .admin-container .select-kit {
-    width: 100%;
-  }
-
   .admin-container {
     display: flex;
     flex-wrap: wrap;
diff --git a/app/assets/stylesheets/mobile/user.scss b/app/assets/stylesheets/mobile/user.scss
index 6ec106d8c52..50fe7b87a11 100644
--- a/app/assets/stylesheets/mobile/user.scss
+++ b/app/assets/stylesheets/mobile/user.scss
@@ -308,10 +308,6 @@
   }
 }
 
-.form-horizontal .control-group.category {
-  margin-top: 18px;
-}
-
 .paginated-topics-list {
   margin-top: 20px;
 }