3 files changed, 20 insertions, 6 deletions
diff --git a/web_src/css/modules/button.css b/web_src/css/modules/button.css
index 87b9ddf292..4e133852f1 100644
--- a/web_src/css/modules/button.css
+++ b/web_src/css/modules/button.css
@@ -63,6 +63,8 @@
 }
 .ui.labeled.button > .button {
   margin: 0;
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
 }
 .ui.labeled.button > .label {
   display: flex;
@@ -70,6 +72,14 @@
   margin: 0 0 0 -1px !important;
   font-size: 1em;
   border-color: var(--color-light-border);
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+}
+.ui.labeled.button > .label:hover {
+  background: var(--color-hover);
+}
+.ui.labeled.button > .button:hover + .label {
+  border-left-color: var(--color-secondary-dark-2);
 }
 
 .ui.button > .icon:not(.button) {
diff --git a/web_src/css/modules/label.css b/web_src/css/modules/label.css
index 2032b2c84b..1e42668aa1 100644
--- a/web_src/css/modules/label.css
+++ b/web_src/css/modules/label.css
@@ -107,7 +107,7 @@ a.ui.label:hover {
 a.ui.basic.label:hover {
   text-decoration: none;
   color: var(--color-text);
-  border-color: var(--color-light-border);
+  border-color: var(--color-secondary-dark-2);
   background: var(--color-hover);
 }
 
diff --git a/web_src/css/repo/header.css b/web_src/css/repo/header.css
index 55e704ed10..b70691435f 100644
--- a/web_src/css/repo/header.css
+++ b/web_src/css/repo/header.css
@@ -36,11 +36,6 @@
   gap: 0.25em;
 }
 
-.repo-buttons .ui.labeled.button > .label:hover {
-  color: var(--color-primary-light-2);
-  background: var(--color-light);
-}
-
 .repo-buttons button[disabled] ~ .label {
   opacity: var(--opacity-disabled);
   color: var(--color-text-dark);
@@ -67,3 +62,12 @@
 .repo-buttons .ui.labeled.button.disabled > .button {
   pointer-events: none !important;
 }
+
+@media (max-width: 767.98px) {
+  .repo-buttons .ui.button,
+  .repo-buttons .ui.label {
+    padding-left: 8px;
+    padding-right: 8px;
+    margin: 0;
+  }
+}