From 36863be907058e98f5d0147f3555c7a7df63c229 Mon Sep 17 00:00:00 2001
From: silverwind <me@silverwind.io>
Date: Thu, 22 Oct 2020 20:08:19 +0200
Subject: [PATCH 1/3] fixes

---
 templates/repo/graph.tmpl                |  4 +---
 web_src/less/_base.less                  |  4 ++++
 web_src/less/features/gitgraph.less      | 16 ++++++++--------
 web_src/less/themes/theme-arc-green.less | 10 ++++++++++
 4 files changed, 23 insertions(+), 11 deletions(-)

diff --git a/templates/repo/graph.tmpl b/templates/repo/graph.tmpl
index 7634b9365f480..775947af19bf5 100644
--- a/templates/repo/graph.tmpl
+++ b/templates/repo/graph.tmpl
@@ -7,9 +7,8 @@
 				{{.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">
@@ -18,7 +17,6 @@
 								</span>
 								<!--<button id="flow-hide-pr-refs" class="ui labelled icon button {{if .HidePRRefs}} active{{end}}" title="{{.i18n.Tr "repo.commit_graph.hide_pr_refs"}}">{{svg "octicon-git-pull-request" 16 "mr-2"}}{{.i18n.Tr "repo.commit_graph.hide_pr_refs"}}</button>-->
 							</div>
-							<div class="divider"></div>
 							{{range .AllRefs}}
 								{{$refGroup := .RefGroup}}
 								{{if eq $refGroup "pull"}}
diff --git a/web_src/less/_base.less b/web_src/less/_base.less
index 81111d82fae56..ddf687aa84c03 100644
--- a/web_src/less/_base.less
+++ b/web_src/less/_base.less
@@ -1213,6 +1213,10 @@ table th[data-sortt-desc] {
   }
 }
 
+.dropdown .ui.label {
+  margin-left: 0 !important;
+}
+
 .text-label {
   display: inline-flex !important;
   align-items: center !important;
diff --git a/web_src/less/features/gitgraph.less b/web_src/less/features/gitgraph.less
index 9d74a6bf43f7d..201452069e99a 100644
--- a/web_src/less/features/gitgraph.less
+++ b/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,10 @@
         white-space: nowrap;
       }
     }
+
+    .dropdown.icon {
+      display: none;
+    }
   }
 
   li {
diff --git a/web_src/less/themes/theme-arc-green.less b/web_src/less/themes/theme-arc-green.less
index 5924594b0921b..22db66e86fabd 100644
--- a/web_src/less/themes/theme-arc-green.less
+++ b/web_src/less/themes/theme-arc-green.less
@@ -393,6 +393,10 @@ body {
   color: #9e9e9e;
 }
 
+input {
+  color: #dbdbdb;
+}
+
 /* firefox scroll bars */
 
 * {
@@ -1590,6 +1594,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;

From 8ad05154851a07c6f66087d03f9531bb07c4c304 Mon Sep 17 00:00:00 2001
From: silverwind <me@silverwind.io>
Date: Thu, 22 Oct 2020 20:16:19 +0200
Subject: [PATCH 2/3] async

---
 web_src/js/features/gitgraph.js | 17 ++++++++---------
 1 file changed, 8 insertions(+), 9 deletions(-)

diff --git a/web_src/js/features/gitgraph.js b/web_src/js/features/gitgraph.js
index 57dbc8949bb59..6e4cb264bebf2 100644
--- a/web_src/js/features/gitgraph.js
+++ b/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($($.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 dropdownSelected = params.getAll('branch');
   if (params.has('hide-pr-refs') && params.get('hide-pr-refs') === 'true') {

From cb192c2c56916ba1a3c4c00d5ef71a8cb18edbb0 Mon Sep 17 00:00:00 2001
From: silverwind <me@silverwind.io>
Date: Thu, 22 Oct 2020 20:25:25 +0200
Subject: [PATCH 3/3] more tweaks

---
 web_src/js/features/gitgraph.js     |  8 ++++----
 web_src/less/features/gitgraph.less | 10 ++++++++++
 2 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/web_src/js/features/gitgraph.js b/web_src/js/features/gitgraph.js
index 6e4cb264bebf2..38ac523f7f146 100644
--- a/web_src/js/features/gitgraph.js
+++ b/web_src/js/features/gitgraph.js
@@ -62,10 +62,10 @@ export default async function initGitGraph() {
     $('#rev-container').addClass('hide');
     $('#loading-indicator').removeClass('hide');
 
-    const div = await $.ajax(String(ajaxUrl));
-    $('#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());
+    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');
diff --git a/web_src/less/features/gitgraph.less b/web_src/less/features/gitgraph.less
index 201452069e99a..9c1f026e5ff71 100644
--- a/web_src/less/features/gitgraph.less
+++ b/web_src/less/features/gitgraph.less
@@ -47,6 +47,16 @@
     .dropdown.icon {
       display: none;
     }
+
+    .default.text {
+      padding-top: 4px;
+      padding-bottom: 4px;
+    }
+
+    input.search {
+      position: relative;
+      top: 1px;
+    }
   }
 
   li {