Skip to content

Commit f5ba609

Browse files
committed
fix(ui): fix navigation buttons height and hover consistency
- Fix nav-right buttons not stretching to full header height - Add explicit hover styles for nav-right buttons - Ensure consistent hover effect across left and right navigation
1 parent 8dda17e commit f5ba609

2 files changed

Lines changed: 19 additions & 3 deletions

File tree

src/widgets/DiffView.vue

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -240,15 +240,23 @@ export default class DiffView extends Vue {
240240
241241
.nav-right {
242242
display: flex;
243-
align-items: center;
243+
align-items: stretch;
244+
background: var(--color-bg-normal);
244245
border-left: 1px solid var(--color-border-default);
245246
246247
.nav-icon {
248+
background: transparent;
249+
height: auto;
247250
border-left: 1px solid var(--color-border-default);
248251
249252
&:first-child {
250253
border-left: none;
251254
}
255+
256+
&:hover {
257+
background: var(--color-main-green);
258+
color: #fff;
259+
}
252260
}
253261
}
254262

src/widgets/JSONViewer.vue

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -382,7 +382,7 @@ export default class JsonViewer extends Vue {
382382
383383
.json-header {
384384
display: flex;
385-
align-items: center;
385+
align-items: stretch;
386386
border-bottom: 1px solid var(--color-border-default);
387387
background: var(--color-bg-primary);
388388
@@ -420,15 +420,23 @@ export default class JsonViewer extends Vue {
420420
421421
.nav-right {
422422
display: flex;
423-
align-items: center;
423+
align-items: stretch;
424+
background: var(--color-bg-normal);
424425
border-left: 1px solid var(--color-border-default);
425426
426427
.nav-icon {
428+
background: transparent;
429+
height: auto;
427430
border-left: 1px solid var(--color-border-default);
428431
429432
&:first-child {
430433
border-left: none;
431434
}
435+
436+
&:hover {
437+
background: var(--color-main-green);
438+
color: #fff;
439+
}
432440
}
433441
}
434442

0 commit comments

Comments
 (0)