diff --git a/templates/explore/navbar.tmpl b/templates/explore/navbar.tmpl
index 3a556812f9..9dbb0320b2 100644
--- a/templates/explore/navbar.tmpl
+++ b/templates/explore/navbar.tmpl
@@ -1,18 +1,20 @@
<div class="ui secondary pointing tabular top attached borderless menu new-menu navbar">
- <a class="{{if .PageIsExploreRepositories}}active {{end}}item" href="{{AppSubUrl}}/explore/repos">
- {{svg "octicon-repo"}} {{.locale.Tr "explore.repos"}}
- </a>
- {{if not .UsersIsDisabled}}
- <a class="{{if .PageIsExploreUsers}}active {{end}}item" href="{{AppSubUrl}}/explore/users">
- {{svg "octicon-person"}} {{.locale.Tr "explore.users"}}
+ <div class="new-menu-inner">
+ <a class="{{if .PageIsExploreRepositories}}active {{end}}item" href="{{AppSubUrl}}/explore/repos">
+ {{svg "octicon-repo"}} {{.locale.Tr "explore.repos"}}
</a>
- {{end}}
- <a class="{{if .PageIsExploreOrganizations}}active {{end}}item" href="{{AppSubUrl}}/explore/organizations">
- {{svg "octicon-organization"}} {{.locale.Tr "explore.organizations"}}
- </a>
- {{if and (not $.UnitTypeCode.UnitGlobalDisabled) .IsRepoIndexerEnabled}}
- <a class="{{if .PageIsExploreCode}}active {{end}}item" href="{{AppSubUrl}}/explore/code">
- {{svg "octicon-code"}} {{.locale.Tr "explore.code"}}
- </a>
- {{end}}
+ {{if not .UsersIsDisabled}}
+ <a class="{{if .PageIsExploreUsers}}active {{end}}item" href="{{AppSubUrl}}/explore/users">
+ {{svg "octicon-person"}} {{.locale.Tr "explore.users"}}
+ </a>
+ {{end}}
+ <a class="{{if .PageIsExploreOrganizations}}active {{end}}item" href="{{AppSubUrl}}/explore/organizations">
+ {{svg "octicon-organization"}} {{.locale.Tr "explore.organizations"}}
+ </a>
+ {{if and (not $.UnitTypeCode.UnitGlobalDisabled) .IsRepoIndexerEnabled}}
+ <a class="{{if .PageIsExploreCode}}active {{end}}item" href="{{AppSubUrl}}/explore/code">
+ {{svg "octicon-code"}} {{.locale.Tr "explore.code"}}
+ </a>
+ {{end}}
+ </div>
</div>
diff --git a/web_src/css/base.css b/web_src/css/base.css
index 6b33ec4111..5efb0bfae5 100644
--- a/web_src/css/base.css
+++ b/web_src/css/base.css
@@ -217,6 +217,7 @@
--color-input-toggle-background: #dedede;
--color-input-border: var(--color-secondary);
--color-input-border-hover: var(--color-secondary-dark-1);
+ --color-header-wrapper: transparent;
--color-light: #00000006;
--color-light-mimic-enabled: rgba(0, 0, 0, calc(6 / 255 * 222 / 255 / var(--opacity-disabled)));
--color-light-border: #0000001d;
@@ -1542,22 +1543,9 @@ img.ui.avatar,
margin-left: auto;
margin-right: auto;
overflow-x: auto;
-}
-
-.ui.menu.new-menu::after {
- position: absolute;
- display: block;
- background: linear-gradient(to right, var(--color-header-wrapper-transparent), var(--color-header-wrapper) 100%);
- content: "";
- right: 0;
- height: 39px;
- width: 60px;
- visibility: visible;
- pointer-events: none;
-}
-
-.ui.menu.new-menu.shadow-body::after {
- background: linear-gradient(to right, transparent, var(--color-body) 100%);
+ width: 100%;
+ mask-image: linear-gradient(to right, #000 0%, #000 calc(100% - 60px), transparent 100%);
+ -webkit-mask-image: linear-gradient(to right, #000 0%, #000 calc(100% - 60px), transparent 100%);
}
.ui.menu.new-menu .item {
diff --git a/web_src/css/themes/theme-arc-green.css b/web_src/css/themes/theme-arc-green.css
index ce0989a5f6..96d9f5821c 100644
--- a/web_src/css/themes/theme-arc-green.css
+++ b/web_src/css/themes/theme-arc-green.css
@@ -198,7 +198,6 @@
--color-input-border: var(--color-secondary);
--color-input-border-hover: var(--color-secondary-dark-1);
--color-header-wrapper: #202430;
- --color-header-wrapper-transparent: #20243000;
--color-light: #00000028;
--color-light-mimic-enabled: rgba(0, 0, 0, calc(40 / 255 * 222 / 255 / var(--opacity-disabled)));
--color-light-border: #ffffff28;