Silverwind patches (#5)

* fixes

* async

* more tweaks

Co-authored-by: silverwind <me@silverwind.io>

Author: zeripath

templates/repo/graph.tmpl

@@ -7,17 +7,15 @@
 				{{.i18n.Tr "repo.commit_graph"}}
 				<div class="ui icon buttons tiny color-buttons">
 					<div class="ui multiple selection search dropdown" id="flow-select-refs-dropdown">
-						<input type="hidden">
+						<input type="hidden" name="flow">
 						<i class="dropdown icon"></i>
-						<input type="text" class="search">
 						<div class="default text">{{.i18n.Tr "repo.commit_graph.select"}}</div>
 						<div class="menu">
 							<div class="item" data-value="...flow-hide-pr-refs">
 								<span class="truncate">
 									{{svg "octicon-eye-closed" 16 "mr-2"}}<span title="{{.i18n.Tr "repo.commit_graph.hide_pr_refs"}}">{{.i18n.Tr "repo.commit_graph.hide_pr_refs"}}</span>
 								</span>
 							</div>
-							<div class="divider"></div>
 							{{range .AllRefs}}
 								{{$refGroup := .RefGroup}}
 								{{if eq $refGroup "pull"}}

web_src/js/features/gitgraph.js

@@ -48,7 +48,7 @@ export default async function initGitGraph() {
   });
   const url = new URL(window.location);
   const params = url.searchParams;
-  const updateGraph = () => {
+  const updateGraph = async () => {
     const queryString = params.toString();
     const ajaxUrl = new URL(url);
     ajaxUrl.searchParams.set('div-only', 'true');
@@ -62,14 +62,13 @@ export default async function initGitGraph() {
     $('#rev-container').addClass('hide');
     $('#loading-indicator').removeClass('hide');
 
-    $.ajax(ajaxUrl.toString()).then((div) => {
-      $('#pagination').html($($.parseHTML(div)).find('#pagination').html());
-      $('#rel-container').html($($.parseHTML(div)).find('#rel-container').html());
-      $('#rev-container').html($($.parseHTML(div)).find('#rev-container').html());
-      $('#loading-indicator').addClass('hide');
-      $('#rel-container').removeClass('hide');
-      $('#rev-container').removeClass('hide');
-    });
+    const div = $(await $.ajax(String(ajaxUrl)));
+    $('#pagination').html(div.find('#pagination').html());
+    $('#rel-container').html(div.find('#rel-container').html());
+    $('#rev-container').html(div.find('#rev-container').html());
+    $('#loading-indicator').addClass('hide');
+    $('#rel-container').removeClass('hide');
+    $('#rev-container').removeClass('hide');
   };
   const dropdownSelected = params.getAll('branch');
   if (params.has('hide-pr-refs') && params.get('hide-pr-refs') === 'true') {

web_src/less/_base.less

@@ -1230,6 +1230,10 @@ table th[data-sortt-desc] {
   }
 }
 
+.dropdown .ui.label {
+  margin-left: 0 !important;
+}
+
 .text-label {
   display: inline-flex !important;
   align-items: center !important;

web_src/less/features/gitgraph.less

@@ -24,19 +24,15 @@
   }
 
   #flow-select-refs-dropdown {
-    vertical-align: top;
-    height: 36.8438px;
-    max-height: 36.8438px;
-    min-width: 250px;
     border-top-right-radius: 0;
     border-bottom-right-radius: 0;
-
-    div.default.text {
-      padding-top: 6.715px;
-    }
+    min-width: 250px;
+    border-right: none;
 
     .ui.label {
       max-width: 180px;
+      display: inline-flex !important;
+      align-items: center;
 
       .truncate {
         display: inline-block;
@@ -47,6 +43,20 @@
         white-space: nowrap;
       }
     }
+
+    .dropdown.icon {
+      display: none;
+    }
+
+    .default.text {
+      padding-top: 4px;
+      padding-bottom: 4px;
+    }
+
+    input.search {
+      position: relative;
+      top: 1px;
+    }
   }
 
   li {

web_src/less/themes/theme-arc-green.less

@@ -397,6 +397,10 @@ body {
   color: #9e9e9e;
 }
 
+input {
+  color: #dbdbdb;
+}
+
 /* firefox scroll bars */
 
 * {
@@ -1596,6 +1600,12 @@ a.blob-excerpt:hover {
   color: #dbdbdb;
 }
 
+.ui.active.label {
+  background: #393d4a;
+  border-color: #393d4a;
+  color: #dbdbdb;
+}
+
 a.ui.label:hover,
 a.ui.labels .label:hover {
   background-color: #505667 !important;