mirror of
https://github.com/snapotter-hq/SnapOtter.git
synced 2026-08-03 07:46:42 +02:00
Siddharth Kumar Sah
47e53dc6cd
Remove socialLinks config and three-dots menu. Add appearance toggle and combined GitHub + Star button directly in the navbar via layout slot. The button shows the Octocat icon, "Star" label, and live stargazer count.
89 lines
1.8 KiB
CSS
89 lines
1.8 KiB
CSS
/* Hide the three-dots extra menu - its contents are now in the navbar directly */
|
|
.VPNavBarExtra {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Also hide the default appearance toggle since we render our own */
|
|
.VPNavBarAppearance {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Right side of navbar: toggle + GitHub button */
|
|
.nav-bar-right {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 12px;
|
|
margin-left: 16px;
|
|
}
|
|
|
|
/* GitHub button group */
|
|
.github-btn-wrapper {
|
|
display: flex;
|
|
align-items: stretch;
|
|
height: 30px;
|
|
}
|
|
|
|
.github-btn {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 6px;
|
|
padding: 0 10px;
|
|
font-size: 12px;
|
|
font-weight: 600;
|
|
line-height: 30px;
|
|
color: var(--vp-c-text-1);
|
|
background: var(--vp-c-bg-soft);
|
|
border: 1px solid var(--vp-c-divider);
|
|
border-radius: 6px;
|
|
text-decoration: none;
|
|
transition: border-color 0.25s, background 0.25s;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.github-btn:hover {
|
|
background: var(--vp-c-bg-mute);
|
|
border-color: var(--vp-c-text-3);
|
|
}
|
|
|
|
.github-icon {
|
|
opacity: 0.85;
|
|
}
|
|
|
|
.github-btn-label {
|
|
margin-top: -1px;
|
|
}
|
|
|
|
/* Star count badge - attached to right side of button */
|
|
.github-btn-count {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 0 8px;
|
|
font-size: 12px;
|
|
font-weight: 600;
|
|
line-height: 30px;
|
|
color: var(--vp-c-text-2);
|
|
background: var(--vp-c-bg);
|
|
border: 1px solid var(--vp-c-divider);
|
|
border-left: none;
|
|
border-radius: 0 6px 6px 0;
|
|
text-decoration: none;
|
|
transition: color 0.25s;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.github-btn-count:hover {
|
|
color: var(--vp-c-brand-1);
|
|
}
|
|
|
|
/* When count is present, left-button gets flat right edge */
|
|
.github-btn-wrapper .github-btn:first-child:not(:last-child) {
|
|
border-radius: 6px 0 0 6px;
|
|
}
|
|
|
|
/* Hide stars on small screens, keep toggle */
|
|
@media (max-width: 640px) {
|
|
.github-btn-wrapper {
|
|
display: none;
|
|
}
|
|
}
|