diff --git a/web_src/css/actions.css b/web_src/css/actions.css
index e7b9a3855..1d5bea239 100644
--- a/web_src/css/actions.css
+++ b/web_src/css/actions.css
@@ -44,7 +44,7 @@
 }
 
 .run-list-item-right {
-  flex: 0 0 15%;
+  flex: 0 0 min(20%, 130px);
   display: flex;
   flex-direction: column;
   gap: 3px;
diff --git a/web_src/css/themes/theme-gitea-dark.css b/web_src/css/themes/theme-gitea-dark.css
index b98b1e638..c74f334c2 100644
--- a/web_src/css/themes/theme-gitea-dark.css
+++ b/web_src/css/themes/theme-gitea-dark.css
@@ -65,7 +65,7 @@
   --color-console-fg-subtle: #bec4c8;
   --color-console-bg: #171b1e;
   --color-console-border: #2e353b;
-  --color-console-hover-bg: #e8e8ff16;
+  --color-console-hover-bg: #292d31;
   --color-console-active-bg: #2e353b;
   --color-console-menu-bg: #252b30;
   --color-console-menu-border: #424b51;
diff --git a/web_src/css/themes/theme-gitea-light.css b/web_src/css/themes/theme-gitea-light.css
index 75fece1dd..01dd8ba4f 100644
--- a/web_src/css/themes/theme-gitea-light.css
+++ b/web_src/css/themes/theme-gitea-light.css
@@ -63,12 +63,12 @@
   /* console colors - used for actions console and console files */
   --color-console-fg: #f8f8f9;
   --color-console-fg-subtle: #bec4c8;
-  --color-console-bg: #181b1d;
-  --color-console-border: #313538;
-  --color-console-hover-bg: #ffffff16;
-  --color-console-active-bg: #313538;
-  --color-console-menu-bg: #272b2e;
-  --color-console-menu-border: #464a4d;
+  --color-console-bg: #171b1e;
+  --color-console-border: #2e353b;
+  --color-console-hover-bg: #292d31;
+  --color-console-active-bg: #2e353b;
+  --color-console-menu-bg: #252b30;
+  --color-console-menu-border: #424b51;
   /* named colors */
   --color-red: #db2828;
   --color-orange: #f2711c;
diff --git a/web_src/js/components/RepoActionView.vue b/web_src/js/components/RepoActionView.vue
index f10694cde..378f72668 100644
--- a/web_src/js/components/RepoActionView.vue
+++ b/web_src/js/components/RepoActionView.vue
@@ -526,8 +526,16 @@ export function initRepositoryActionView() {
 
 .action-summary {
   display: flex;
+  flex-wrap: wrap;
   gap: 5px;
-  margin: 0 0 0 28px;
+  margin-left: 28px;
+}
+
+@media (max-width: 767.98px) {
+  .action-commit-summary {
+    margin-left: 0;
+    margin-top: 8px;
+  }
 }
 
 /* ================ */
@@ -540,6 +548,14 @@ export function initRepositoryActionView() {
   top: 12px;
   max-height: 100vh;
   overflow-y: auto;
+  background: var(--color-body);
+  z-index: 2; /* above .job-info-header */
+}
+
+@media (max-width: 767.98px) {
+  .action-view-left {
+    position: static; /* can not sticky because multiple jobs would overlap into right view */
+  }
 }
 
 .job-artifacts-title {
@@ -701,7 +717,9 @@ export function initRepositoryActionView() {
   position: sticky;
   top: 0;
   height: 60px;
-  z-index: 1;
+  z-index: 1; /* above .job-step-container */
+  background: var(--color-console-bg);
+  border-radius: 3px;
 }
 
 .job-info-header:has(+ .job-step-container) {
@@ -739,7 +757,7 @@ export function initRepositoryActionView() {
 
 .job-step-container .job-step-summary.step-expandable:hover {
   color: var(--color-console-fg);
-  background-color: var(--color-console-hover-bg);
+  background: var(--color-console-hover-bg);
 }
 
 .job-step-container .job-step-summary .step-summary-msg {
@@ -757,17 +775,15 @@ export function initRepositoryActionView() {
   top: 60px;
 }
 
-@media (max-width: 768px) {
+@media (max-width: 767.98px) {
   .action-view-body {
     flex-direction: column;
   }
   .action-view-left, .action-view-right {
     width: 100%;
   }
-
   .action-view-left {
     max-width: none;
-    overflow-y: hidden;
   }
 }
 </style>