diff --git a/src/components/Node.tsx b/src/components/Node.tsx
index f83b8cf..ea023fc 100644
--- a/src/components/Node.tsx
+++ b/src/components/Node.tsx
@@ -62,11 +62,11 @@ export function Node({
{name.includes('/') ? (
- name.split('/').map((chunk, index) => (
-
- {index > 0 && '/'}
+ name.split('/').map((chunk, index, arr) => (
+
-
+ {index + 1 !== arr.length && '/'}
+
))
) : (
diff --git a/src/styles/dark/export.scss b/src/styles/dark/export.scss
index 8f10ec9..f143168 100644
--- a/src/styles/dark/export.scss
+++ b/src/styles/dark/export.scss
@@ -568,7 +568,7 @@
}
// How to merge the selectors?
-// Is it possible to not have two copy of dark theme variables?
+// Is it possible to not have two copies of dark theme variables?
@media (prefers-color-scheme: dark) {
:root[data-color-mode='auto'] {
@include assign();
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 2a75f96..b7703ac 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -478,22 +478,23 @@ $minimal-z-index: max($github-header-z-index, $github-pull-request-float-header-
}
&.disabled {
- .node-item {
pointer-events: none;
color: var(--gitako-text-disabled);
}
- }
display: flex;
justify-content: space-between;
+ align-items: center;
margin: 0;
- color: var(--gitako-text-link);
line-height: 20px;
- padding: 8px 10px;
cursor: pointer;
border-bottom: 1px solid var(--gitako-border-secondary);
white-space: nowrap;
transition: padding 0.3s ease; // on toggle expansion in search results
+ &:not(:hover) {
+ color: var(--gitako-text-primary);
+ }
+
@mixin icon-size() {
width: 16px;
height: 16px;
@@ -536,11 +537,22 @@ $minimal-z-index: max($github-header-z-index, $github-pull-request-float-header-
align-items: center;
}
+ &:not(:hover) {
+ .node-item-label .prefix {
+ color: var(--gitako-text-tertiary);
+ }
+ }
+
.go-to-button {
+ @include icon-button();
+ @include button-color();
+ width: 28px;
+ height: 28px;
+ border-radius: 28px;
white-space: nowrap;
- background: transparent;
- border: none;
- padding: 0;
+ .octicon-wrapper {
+ margin-right: 0;
+ }
}
&:not(:hover) {
.go-to-button {