UX: Hide branch/private repo options in admin theme import modal

app/assets/javascripts/admin/controllers/modals/admin-import-theme.js.es6

@@ -18,6 +18,7 @@ export default Ember.Controller.extend(ModalFunctionality, {
   localFile: null,
   uploadUrl: null,
   urlPlaceholder: "https://github.com/discourse/sample_theme",
+  advancedVisible: false,
 
   @computed("loading", "remote", "uploadUrl", "local", "localFile")
   importDisabled(isLoading, isRemote, uploadUrl, isLocal, localFile) {
@@ -50,6 +51,10 @@ export default Ember.Controller.extend(ModalFunctionality, {
       this.set("localFile", $("#file-input")[0].files[0]);
     },
 
+    toggleAdvanced() {
+      this.set("advancedVisible", !this.get("advancedVisible"));
+    },
+
     importTheme() {
       let options = {
         type: "POST"

app/assets/javascripts/admin/templates/modal/admin-import-theme.hbs

@@ -1,4 +1,4 @@
-{{#d-modal-body class='upload-selector' title="admin.customize.theme.import_theme"}}
+{{#d-modal-body class='upload-selector import-theme' title="admin.customize.theme.import_theme"}}
   <div class="radios">
     {{radio-button name="upload" id="local" value="local" selection=selection}}
     <label class="radio" for="local">{{i18n 'upload_selector.from_my_computer'}}</label>
@@ -15,13 +15,21 @@
     {{#if remote}}
       <div class="inputs">
         <div class='repo'>
+          <div class="label">{{i18n 'admin.customize.theme.import_web_tip'}}</div>
           {{input value=uploadUrl placeholder=urlPlaceholder}}
-        <span class="description">{{i18n 'admin.customize.theme.import_web_tip'}}</span>
         </div>
+
+        {{d-button
+          class="btn-small advanced-repo"
+          action=(action "toggleAdvanced")
+          label='admin.customize.theme.import_web_advanced'}}
+
+        {{#if advancedVisible}}
           <div class='branch'>
+            <div class="label">{{i18n 'admin.customize.theme.remote_branch'}}</div>
             {{input value=branch placeholder="master"}}
-        <span class="description">{{i18n 'admin.customize.theme.remote_branch'}}</span>
           </div>
+
           <div class='check-private'>
             <label>
               {{input type="checkbox" checked=privateChecked}}
@@ -32,12 +40,13 @@
             {{#if privateChecked}}
             {{#if publicKey}}
             <div class='public-key'>
-            {{i18n 'admin.customize.theme.public_key'}}
+              <div class="label">{{i18n 'admin.customize.theme.public_key'}}</div>
               {{textarea readonly=true value=publicKey}}
             </div>
             {{/if}}
             {{/if}}
           {{/if}}
+        {{/if}}
       </div>
     {{/if}}
   </div>

app/assets/stylesheets/desktop/upload.scss

@@ -31,6 +31,9 @@
         font-style: italic;
         margin: 5px 0 0 0;
       }
+      .label {
+        margin: 0 0 5px 0;
+      }
     }
   }
   .radios:last-child:not(:nth-child(2)) {
@@ -49,3 +52,11 @@
     padding: 7px 10px;
   }
 }
+
+.import-theme {
+  min-width: 650px;
+}
+
+.advanced-repo {
+  margin-top: 10px;
+}

config/locales/client.en.yml

@@ -3383,6 +3383,7 @@ en:
           edit_css_html_help: "You have not edited any CSS or HTML"
           delete_upload_confirm: "Delete this upload? (Theme CSS may stop working!)"
           import_web_tip: "Repository containing theme"
+          import_web_advanced: "Advanced..."
           import_file_tip: ".tar.gz or .dcstyle.json file containing theme"
           is_private: "Theme is in a private git repository"
           remote_branch: "Branch name (optional)"