Files
dify-docs/style.css
RiskeyL 03825bb6bc fix: hide landing sidebar entries via CSS and drop on-page language links
Mintlify's client-rendered sidebar ignores hidden: true, so the landing entries are hidden by href in style.css. The landings stay in the nav so the native language switcher maps them across languages, which made the on-page links redundant.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-06-16 20:21:13 +08:00

123 lines
2.8 KiB
CSS

body {
text-autospace: normal;
}
/* Hide the top tab row on the landing pages (root + per-language /{lang}/home).
Mintlify updates <html data-current-path> on client-side nav. */
html[data-current-path="/"] .nav-tabs,
html[data-current-path="/en/home"] .nav-tabs,
html[data-current-path="/zh/home"] .nav-tabs,
html[data-current-path="/ja/home"] .nav-tabs {
display: none;
}
/* `hidden: true` does not remove a listed page from Mintlify's client-rendered
sidebar, so hide the landing pages' sidebar entries by href. They stay in the
nav (so the language switcher maps them across languages) but no longer show
in the sidebar. */
#sidebar-content a[href="/en/home"],
#sidebar-content a[href="/zh/home"],
#sidebar-content a[href="/ja/home"],
#sidebar-content *:has(> a[href="/en/home"]),
#sidebar-content *:has(> a[href="/zh/home"]),
#sidebar-content *:has(> a[href="/ja/home"]) {
display: none;
}
/* Use/Deploy overview pages (frame mode): text hero + centered equal-card grid.
Layout only; colors come from Tailwind classes in the MDX so dark mode works. */
.uo-wrap {
max-width: 64rem;
margin: 0 auto;
padding: 2.5rem 2rem 4rem;
}
.uo-hero {
display: flex;
gap: 40px;
align-items: center;
margin: 0 0 48px;
}
.uo-hero-text {
flex: 1 1 100%;
}
.uo-actions {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 20px;
margin-top: 24px;
}
.uo-cta {
display: inline-flex;
align-items: center;
gap: 6px;
background: #0060FF;
color: #fff !important;
padding: 8px 18px;
border-radius: 8px;
font-weight: 600;
text-decoration: none !important;
border: none !important;
}
.uo-cta:hover {
background: #0034FF;
}
/* Secondary links beside the primary CTA: inline and dot-separated (no box, so
they don't echo the cards below). Medium weight at body size so they read
clearly rather than thin. Rest color flows from the theme (dark-mode safe). */
.uo-secondary {
font-weight: 500;
}
.uo-secondary a {
text-decoration: none !important;
}
.uo-secondary a:hover {
color: #0060FF;
}
/* Equal-card grid, three per row (each card spans two of six columns).
With six items it forms a clean 3x2; with five, the rule below centers
the two cards of the final row. */
.uo-grid {
display: grid;
grid-template-columns: repeat(6, minmax(0, 1fr));
gap: 16px;
}
.uo-grid > * {
grid-column: span 2;
margin: 0;
}
.uo-grid > :nth-child(4):nth-last-child(2) {
grid-column: 2 / span 2;
}
/* Link row inside the Get Help card (a native Card without href). */
.uo-help-links {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 4px 8px;
margin-top: 10px;
font-weight: 500;
}
@media (max-width: 900px) {
.uo-grid {
grid-template-columns: 1fr;
}
.uo-grid > *,
.uo-grid > :nth-child(4):nth-last-child(2) {
grid-column: auto;
}
}