Backport: Fix layout of the topics editing form (#4971) (#4993)

Author: kzmi

public/css/index.css

@@ -2309,7 +2309,7 @@ function initTopicbar() {
 
     mgrBtn.click(function() {
         viewDiv.hide();
-        editDiv.show();
+        editDiv.css('display', ''); // show Semantic UI Grid
     })
 
     saveBtn.click(function() {
@@ -2334,7 +2334,7 @@ function initTopicbar() {
                 }
             }
         }).done(function() {
-            editDiv.hide();
+            editDiv.css('display', 'none'); // hide Semantic UI Grid
             viewDiv.show();
         }).fail(function(xhr) {
             alert(xhr.responseJSON.message)

public/js/index.js

@@ -1743,7 +1743,6 @@ tbody.commit-list {
 
 #topic_edit {
     margin-top:5px;
-    display: none;
 }
 
 #repo-topic {

public/less/_repository.less

@@ -28,7 +28,7 @@
 		{{if .IsRepositoryAdmin}}<a id="manage_topic" style="cursor:pointer;margin-left:10px;">{{.i18n.Tr "repo.topic.manage_topics"}}</a>{{end}}
 		</div>
 		{{if .IsRepositoryAdmin}}
-		<div class="ui repo-topic-edit grid" id="topic_edit" >
+		<div class="ui repo-topic-edit grid" id="topic_edit" style="display:none">
 			<div class="fourteen wide column">
 				<div class="ui fluid multiple search selection dropdown">
 					<input type="hidden" name="topics" value="{{range $i, $v := .Topics}}{{.Name}}{{if lt (Add $i 1) (len $.Topics)}},{{end}}{{end}}">
@@ -38,7 +38,7 @@
 					<div class="text"></div>
 				</div>
 			</div>
-			<div class="one wide column">
+			<div class="two wide column">
 				<a class="ui compact button primary" href="javascript:;" id="save_topic"
 				data-link="{{.RepoLink}}/topics">{{.i18n.Tr "repo.topic.done"}}</a>
 			</div>