Clone button enhancements (#33362)

- Add box-shadow to default tippy theme
- Make colors for tabs match the ones from `.ui.tabular.menu`
- Remove tippy arrow and slightly offset tooltip closer to the button
- Fix setting of `aria-haspopup` when default role is used with tippy

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>

3 files changed, 8 insertions, 2 deletions

diff --git a/web_src/css/modules/tippy.css b/web_src/css/modules/tippy.css
index 55b9751cc6..4438a31c9d 100644
--- a/web_src/css/modules/tippy.css
+++ b/web_src/css/modules/tippy.css
@@ -28,6 +28,10 @@
   z-index: 1;
 }
 
+.tippy-box[data-theme="default"] {
+  box-shadow: 0 6px 18px var(--color-shadow);
+}
+
 /* bare theme, no styling at all, except box-shadow */
 .tippy-box[data-theme="bare"] {
   border: none;
diff --git a/web_src/css/repo.css b/web_src/css/repo.css
index c40b175638..2752174f86 100644
--- a/web_src/css/repo.css
+++ b/web_src/css/repo.css
@@ -1630,7 +1630,7 @@ td .commit-summary {
 }
 
 .repo-button-row-left {
-  flex: 1;
+  flex-grow: 1;
 }
 
 .repo-button-row .button {
diff --git a/web_src/css/repo/clone.css b/web_src/css/repo/clone.css
index 3f6a1323fe..c6887fbf16 100644
--- a/web_src/css/repo/clone.css
+++ b/web_src/css/repo/clone.css
@@ -20,10 +20,12 @@
 .clone-panel-tab .item {
   padding: 5px 10px;
   background: none;
+  color: var(--color-text-light-2);
 }
 
 .clone-panel-tab .item.active {
-  border-bottom: 3px solid var(--color-secondary);
+  color: var(--color-text-dark);
+  border-bottom: 3px solid currentcolor;
 }
 
 .clone-panel-tab + .divider {