QT/superset2
1
0
Fork 0
mirror of https://github.com/apache/superset.git synced 2026-04-14 05:34:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

docs(components): federate Storybook stories into Developer Portal MDX (#37502)

Browse Source 
Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Evan Rusackas
2026-01-28 21:33:01 -08:00
committed by GitHub
parent 5fedb65bc0
commit 73e095db8e
79 changed files with 8112 additions and 1739 deletions
Download Patch File Download Diff File Expand all files Collapse all files

190
docs/src/styles/custom.css
View File

@@ -264,3 +264,193 @@ ul.dropdown__menu svg {
.menu__list-item.delete.api-method > .menu__link::before {
background-color: #f93e3e;
}
/* ============================================
Component Example Isolation
Prevents Docusaurus/Infima styles from bleeding into Superset components
============================================ */
/* Reset link styles inside component examples */
.storybook-example a {
color: inherit;
text-decoration: none;
font-weight: inherit;
line-height: inherit;
vertical-align: inherit;
}
.storybook-example a:hover {
color: inherit;
text-decoration: none;
}
/* Reset list styles */
.storybook-example ul,
.storybook-example ol {
margin: 0;
padding: 0;
list-style: none;
}
/* Override Infima's .markdown li + li margin */
.storybook-example li + li,
.markdown .storybook-example li + li {
margin-top: 0;
}
/* Reset heading styles */
.storybook-example h1,
.storybook-example h2,
.storybook-example h3,
.storybook-example h4,
.storybook-example h5,
.storybook-example h6 {
margin: 0;
font-size: inherit;
font-weight: inherit;
}
/* Reset paragraph margins */
.storybook-example p {
margin: 0;
}
/* Reset table margins - Infima applies margin-bottom via --ifm-spacing-vertical */
.storybook-example table {
margin: 0;
display: table;
}
/* Ensure Ant Design components render correctly */
.storybook-example .ant-breadcrumb {
line-height: 1.5715;
}
.storybook-example .ant-breadcrumb a {
color: rgba(0, 0, 0, 0.45);
}
.storybook-example .ant-breadcrumb a:hover {
color: rgba(0, 0, 0, 0.85);
}
/* ============================================
Ant Design Popup/Portal Isolation
These components render outside .storybook-example via portals
============================================ */
/* DatePicker, TimePicker dropdown panels - reset Infima table styles
Using doubled selectors for higher specificity than Infima's defaults */
.ant-picker-dropdown.ant-picker-dropdown table,
.ant-picker-dropdown.ant-picker-dropdown thead,
.ant-picker-dropdown.ant-picker-dropdown tbody,
.ant-picker-dropdown.ant-picker-dropdown tr,
.ant-picker-dropdown.ant-picker-dropdown th,
.ant-picker-dropdown.ant-picker-dropdown td {
border: none;
background: none;
background-color: transparent;
}
.ant-picker-dropdown.ant-picker-dropdown table {
border-collapse: separate;
border-spacing: 0;
width: 100%;
display: table;
}
/* Override Infima's zebra striping with higher specificity */
.ant-picker-dropdown.ant-picker-dropdown tr:nth-child(2n),
.ant-picker-dropdown.ant-picker-dropdown tbody tr:nth-child(2n) {
background: none;
background-color: transparent;
}
.ant-picker-dropdown.ant-picker-dropdown th,
.ant-picker-dropdown.ant-picker-dropdown td {
padding: 0;
}
/* Select, Dropdown, Popover portals */
.ant-select-dropdown.ant-select-dropdown table,
.ant-select-dropdown.ant-select-dropdown thead,
.ant-select-dropdown.ant-select-dropdown tbody,
.ant-select-dropdown.ant-select-dropdown tr,
.ant-select-dropdown.ant-select-dropdown th,
.ant-select-dropdown.ant-select-dropdown td,
.ant-dropdown.ant-dropdown table,
.ant-dropdown.ant-dropdown thead,
.ant-dropdown.ant-dropdown tbody,
.ant-dropdown.ant-dropdown tr,
.ant-dropdown.ant-dropdown th,
.ant-dropdown.ant-dropdown td,
.ant-popover.ant-popover table,
.ant-popover.ant-popover thead,
.ant-popover.ant-popover tbody,
.ant-popover.ant-popover tr,
.ant-popover.ant-popover th,
.ant-popover.ant-popover td {
border: none;
background: none;
background-color: transparent;
}
.ant-select-dropdown.ant-select-dropdown tr:nth-child(2n),
.ant-dropdown.ant-dropdown tr:nth-child(2n),
.ant-popover.ant-popover tr:nth-child(2n) {
background: none;
background-color: transparent;
}
/* Modal portals */
.ant-modal.ant-modal table,
.ant-modal.ant-modal thead,
.ant-modal.ant-modal tbody,
.ant-modal.ant-modal tr,
.ant-modal.ant-modal th,
.ant-modal.ant-modal td {
border: none;
background: none;
background-color: transparent;
}
.ant-modal.ant-modal tr:nth-child(2n) {
background: none;
background-color: transparent;
}
/* ============================================
Live Code Editor Height Limits
Prevents tall code blocks from dominating the page
============================================ */
/* Limit the code editor height and make it scrollable */
/* Target multiple possible class names used by Docusaurus/react-live */
.playgroundEditor,
[class*="playgroundEditor"],
.live-editor,
[class*="liveEditor"] {
max-height: 350px !important;
overflow: auto !important;
}
/* The actual textarea/code area inside the editor */
.playgroundEditor textarea,
.playgroundEditor pre,
[class*="playgroundEditor"] textarea,
[class*="playgroundEditor"] pre {
max-height: 350px !important;
overflow: auto !important;
}
/* Also limit the preview area for consistency */
.playgroundPreview,
[class*="playgroundPreview"] {
max-height: 400px;
overflow: auto;
}
/* Hide sidebar items with sidebar_class_name: hidden in frontmatter */
.menu__list-item.hidden {
display: none;
}