类型别名 MetabaseComponentTheme

用于自定义特定 Metabase 组件和可视化效果的主题选项。

type MetabaseComponentTheme = {
    cartesian: {
        goalLine: { label: { fontSize: string } };
        label: { fontSize: string };
        padding?: string;
        splitLine: { lineStyle: { color: string } };
    };
    collectionBrowser: {
        breadcrumbs: {
            expandButton: {
                backgroundColor: {};
                hoverBackgroundColor: {};
                hoverTextColor: {};
                textColor: {};
            };
        };
        emptyContent: {
            icon: {
                height: CSSProperties["width"];
                width: CSSProperties["width"];
            };
            subtitle: { fontSize: CSSProperties["fontSize"] };
            title: { fontSize: CSSProperties["fontSize"] };
        };
    };
    dashboard: {
        backgroundColor: string;
        card: { backgroundColor: string; border?: string };
        gridBorderColor?: string;
    };
    number?: {
        value?: { fontSize?: CSSProperties["fontSize"]; lineHeight?: string };
    };
    pivotTable: {
        cell: { fontSize: string };
        rowToggle: { backgroundColor: string; textColor: string };
    };
    popover: { zIndex?: number };
    question: {
        backgroundColor: string;
        toolbar?: { backgroundColor?: string };
    };
    table: {
        cell: { backgroundColor?: string; fontSize: string; textColor: string };
        idColumn?: { backgroundColor?: string; textColor: string };
        stickyBackgroundColor?: string;
    };
    tooltip?: {
        backgroundColor?: string;
        focusedBackgroundColor?: string;
        secondaryTextColor?: string;
        textColor?: string;
    };
}

索引

属性

cartesian collectionBrowser dashboard number? pivotTable popover question table tooltip?

属性

cartesian

cartesian: {
    goalLine: { label: { fontSize: string } };
    label: { fontSize: string };
    padding?: string;
    splitLine: { lineStyle: { color: string } };
}

笛卡尔图表

类型声明

goalLine: { label: { fontSize: string } }
- label: { fontSize: string }
  - fontSize: string
    目标线标签的字体大小
label: { fontSize: string }
- fontSize: string
  笛卡尔图表中使用的标签，例如轴刻度和系列。
Optionalpadding?: string
图表周围的内边距。
splitLine: { lineStyle: { color: string } }

collectionBrowser

collectionBrowser: {
    breadcrumbs: {
        expandButton: {
            backgroundColor: {};
            hoverBackgroundColor: {};
            hoverTextColor: {};
            textColor: {};
        };
    };
    emptyContent: {
        icon: { height: CSSProperties["width"]; width: CSSProperties["width"] };
        subtitle: { fontSize: CSSProperties["fontSize"] };
        title: { fontSize: CSSProperties["fontSize"] };
    };
}

dashboard

dashboard: {
    backgroundColor: string;
    card: { backgroundColor: string; border?: string };
    gridBorderColor?: string;
}

类型声明

backgroundColor: string
card: { backgroundColor: string; border?: string }
- backgroundColor: string
- Optionalborder?: string
  为仪表板卡片添加自定义边框。值为 CSS 中 border 属性的相同值，例如 “1px solid #ff0000”。这将替换卡片的阴影。
OptionalgridBorderColor?: string
仪表板网格的边框颜色，仅在编辑仪表板时显示。默认为 colors.border。

`Optional`number

number?: {
value?: { fontSize?: CSSProperties["fontSize"]; lineHeight?: string };
}

数字图

类型声明

Optionalvalue?: { fontSize?: CSSProperties["fontSize"]; lineHeight?: string }
数字图上显示的值。这也适用于趋势图中的主要值。

pivotTable

pivotTable: {
cell: { fontSize: string };
rowToggle: { backgroundColor: string; textColor: string };
}

透视表 *

类型声明

cell: { fontSize: string }
- fontSize: string
  单元格值的字体大小，默认为 ~12px。
rowToggle: { backgroundColor: string; textColor: string }
用于切换透视表行的按钮。

popover: { zIndex?: number }

弹出框

类型声明

OptionalzIndex?: number
叠加层的 z-index。对于将组件嵌入模态框很有用。默认为 200。

question

question: { backgroundColor: string; toolbar?: { backgroundColor?: string } }

类型声明

backgroundColor: string
所有问题的背景颜色。
Optionaltoolbar?: { backgroundColor?: string }
默认交互式问题布局的工具栏。

table

table: {
    cell: { backgroundColor?: string; fontSize: string; textColor: string };
    idColumn?: { backgroundColor?: string; textColor: string };
    stickyBackgroundColor?: string;
}

数据表 *

类型声明

cell: { backgroundColor?: string; fontSize: string; textColor: string }
- OptionalbackgroundColor?: string
  单元格的默认背景颜色，默认为 background。
- fontSize: string
  单元格值的字体大小，默认为 ~12.5px。
- textColor: string
  单元格的文本颜色，默认为 text-primary。
OptionalidColumn?: { backgroundColor?: string; textColor: string }
- OptionalbackgroundColor?: string
  ID 列的背景颜色，默认为 lighten(brand)。
- textColor: string
  ID 列的文本颜色，默认为 brand。
OptionalstickyBackgroundColor?: string
表头在滚动时保持固定的背景颜色。如果未设置单元格背景颜色，则默认为 white。

`Optional`tooltip

tooltip?: {
    backgroundColor?: string;
    focusedBackgroundColor?: string;
    secondaryTextColor?: string;
    textColor?: string;
}

工具提示

类型声明

OptionalbackgroundColor?: string
工具提示的背景颜色。
OptionalfocusedBackgroundColor?: string
聚焦行的工具提示背景颜色。
OptionalsecondaryTextColor?: string
工具提示中显示的次要文本颜色，例如工具提示标题和百分比变化。
OptionaltextColor?: string
工具提示的文本颜色。

类型别名 MetabaseComponentTheme

索引

属性

属性

cartesian

类型声明

goalLine: { label: { fontSize: string } }

label: { fontSize: string }

fontSize: string

label: { fontSize: string }

fontSize: string

Optionalpadding?: string

splitLine: { lineStyle: { color: string } }

collectionBrowser

dashboard

类型声明

backgroundColor: string

card: { backgroundColor: string; border?: string }

backgroundColor: string

Optionalborder?: string

OptionalgridBorderColor?: string

Optionalnumber

类型声明

Optionalvalue?: { fontSize?: CSSProperties["fontSize"]; lineHeight?: string }

pivotTable

类型声明

cell: { fontSize: string }

fontSize: string

rowToggle: { backgroundColor: string; textColor: string }

popover

类型声明

OptionalzIndex?: number

question

类型声明

backgroundColor: string

Optionaltoolbar?: { backgroundColor?: string }

table

类型声明

cell: { backgroundColor?: string; fontSize: string; textColor: string }

OptionalbackgroundColor?: string

fontSize: string

textColor: string

OptionalidColumn?: { backgroundColor?: string; textColor: string }

OptionalbackgroundColor?: string

textColor: string

OptionalstickyBackgroundColor?: string

Optionaltooltip

类型声明

OptionalbackgroundColor?: string

OptionalfocusedBackgroundColor?: string

OptionalsecondaryTextColor?: string

OptionaltextColor?: string

设置

本页内容

`Optional`padding?: string

`Optional`border?: string

`Optional`gridBorderColor?: string

`Optional`number

`Optional`value?: { fontSize?: CSSProperties["fontSize"]; lineHeight?: string }

`Optional`zIndex?: number

`Optional`toolbar?: { backgroundColor?: string }

`Optional`backgroundColor?: string

`Optional`idColumn?: { backgroundColor?: string; textColor: string }

`Optional`backgroundColor?: string

`Optional`stickyBackgroundColor?: string

`Optional`tooltip

`Optional`backgroundColor?: string

`Optional`focusedBackgroundColor?: string

`Optional`secondaryTextColor?: string

`Optional`textColor?: string