docs: fix oneOf design hiding more than three items (#10077)

* docs: fix oneOf design hiding more than three items

* fix lint errors

* fix eslint
This commit is contained in:
Shahed Nasser authored and GitHub committed 2024-11-13 17:41:49 +02:00
1 parent 938f3bd934
commit 662b096a46
3 files changed
+10 -8

No files matched your search

@@ -66,19 +66,21 @@ const TagOperationParamatersOneOf = ({
return ( return (
<> <>
<div className={clsx("flex items-center gap-1 pl-1")}> <div className={clsx("flex items-center gap-1 pl-1")}>
<span className="inline-block">One of</span> <span className="inline-block text-compact-x-small">One of</span>
<ul className="mb-0 flex list-none gap-1"> <ul className="mb-0 flex list-none gap-0.5 flex-wrap">
{schema.oneOf?.map((item, index) => ( {schema.oneOf?.map((item, index) => (
<li <li
key={index} key={index}
className={clsx( className={clsx(
"rounded-xs cursor-pointer p-0.5", "rounded-full cursor-pointer px-[10px]",
"border border-solid", "flex justify-center items-center text-compact-small-plus",
"focus:shadow-borders-interactive-with-focus transition-colors",
activeTab === index && [ activeTab === index && [
"bg-medusa-bg-subtle border-medusa-border-strong", "text-medusa-fg-base bg-medusa-bg-base",
"shadow-elevation-card-rest dark:shadow-elevation-card-rest-dark",
], ],
activeTab !== index && [ activeTab !== index && [
"bg-medusa-bg-base border-medusa-border-base", "text-medusa-fg-muted hover:text-medusa-fg-base",
] ]
)} )}
onClick={() => setActiveTab(index)} onClick={() => setActiveTab(index)}
+1 -1
View File
@@ -19,7 +19,7 @@ const compat = new FlatCompat({
export default [ export default [
prettier, prettier,
{ {
ignores: ["**/dist", "**/build"], ignores: ["**/dist", "**/build", "**/global-config.ts"],
}, ...compat.extends( }, ...compat.extends(
"eslint:recommended", "eslint:recommended",
"plugin:react/recommended", "plugin:react/recommended",
@@ -26,7 +26,7 @@ export const CodeBlockHeader = ({
badgeLabel, badgeLabel,
actionsProps, actionsProps,
badgeColor, badgeColor,
hideActions = false hideActions = false,
}: CodeBlockHeaderProps) => { }: CodeBlockHeaderProps) => {
const { colorMode } = useColorMode() const { colorMode } = useColorMode()