Marcus Andersson
cc3fc18076
* added packages reference menu item. * removed the draft flag. * Updated docs by running script.
189 lines
9.1 KiB
Markdown
189 lines
9.1 KiB
Markdown
+++
|
|
# -----------------------------------------------------------------------
|
|
# Do not edit this file. It is automatically generated by API Documenter.
|
|
# -----------------------------------------------------------------------
|
|
title = "GrafanaTheme"
|
|
keywords = ["grafana","documentation","sdk","@grafana/data"]
|
|
type = "docs"
|
|
+++
|
|
|
|
## GrafanaTheme interface
|
|
|
|
<b>Signature</b>
|
|
|
|
```typescript
|
|
export interface GrafanaTheme extends GrafanaThemeCommons
|
|
```
|
|
<b>Import</b>
|
|
|
|
```typescript
|
|
import { GrafanaTheme } from '@grafana/data';
|
|
```
|
|
<b>Properties</b>
|
|
|
|
| Property | Type | Description |
|
|
| --- | --- | --- |
|
|
| [colors](#colors-property) | <code>{</code><br/><code> bg1: string;</code><br/><code> bg2: string;</code><br/><code> bg3: string;</code><br/><code> border1: string;</code><br/><code> border2: string;</code><br/><code> border3: string;</code><br/><code> bgBlue1: string;</code><br/><code> bgBlue2: string;</code><br/><code> dashboardBg: string;</code><br/><code> bodyBg: string;</code><br/><code> panelBg: string;</code><br/><code> panelBorder: string;</code><br/><code> pageHeaderBg: string;</code><br/><code> pageHeaderBorder: string;</code><br/><code> dropdownBg: string;</code><br/><code> dropdownShadow: string;</code><br/><code> dropdownOptionHoverBg: string;</code><br/><code> link: string;</code><br/><code> linkDisabled: string;</code><br/><code> linkHover: string;</code><br/><code> linkExternal: string;</code><br/><code> textStrong: string;</code><br/><code> textHeading: string;</code><br/><code> text: string;</code><br/><code> textSemiWeak: string;</code><br/><code> textWeak: string;</code><br/><code> textFaint: string;</code><br/><code> textBlue: string;</code><br/><code> formLabel: string;</code><br/><code> formDescription: string;</code><br/><code> formInputBg: string;</code><br/><code> formInputBgDisabled: string;</code><br/><code> formInputBorder: string;</code><br/><code> formInputBorderHover: string;</code><br/><code> formInputBorderActive: string;</code><br/><code> formInputBorderInvalid: string;</code><br/><code> formFocusOutline: string;</code><br/><code> formInputText: string;</code><br/><code> formInputDisabledText: string;</code><br/><code> formInputPlaceholderText: string;</code><br/><code> formValidationMessageText: string;</code><br/><code> formValidationMessageBg: string;</code><br/><code> formSwitchBg: string;</code><br/><code> formSwitchBgActive: string;</code><br/><code> formSwitchBgActiveHover: string;</code><br/><code> formSwitchBgHover: string;</code><br/><code> formSwitchBgDisabled: string;</code><br/><code> formSwitchDot: string;</code><br/><code> formCheckboxBgChecked: string;</code><br/><code> formCheckboxBgCheckedHover: string;</code><br/><code> formCheckboxCheckmark: string;</code><br/><code> }</code> | |
|
|
| [isDark](#isdark-property) | <code>boolean</code> | |
|
|
| [isLight](#islight-property) | <code>boolean</code> | |
|
|
| [palette](#palette-property) | <code>{</code><br/><code> black: string;</code><br/><code> white: string;</code><br/><code> dark1: string;</code><br/><code> dark2: string;</code><br/><code> dark3: string;</code><br/><code> dark4: string;</code><br/><code> dark5: string;</code><br/><code> dark6: string;</code><br/><code> dark7: string;</code><br/><code> dark8: string;</code><br/><code> dark9: string;</code><br/><code> dark10: string;</code><br/><code> gray1: string;</code><br/><code> gray2: string;</code><br/><code> gray3: string;</code><br/><code> gray4: string;</code><br/><code> gray5: string;</code><br/><code> gray6: string;</code><br/><code> gray7: string;</code><br/><code> gray98: string;</code><br/><code> gray95: string;</code><br/><code> gray85: string;</code><br/><code> gray70: string;</code><br/><code> gray60: string;</code><br/><code> gray33: string;</code><br/><code> gray25: string;</code><br/><code> gray15: string;</code><br/><code> gray10: string;</code><br/><code> gray05: string;</code><br/><code> blue95: string;</code><br/><code> blue85: string;</code><br/><code> blue80: string;</code><br/><code> blue77: string;</code><br/><code> red88: string;</code><br/><code> redBase: string;</code><br/><code> redShade: string;</code><br/><code> greenBase: string;</code><br/><code> greenShade: string;</code><br/><code> red: string;</code><br/><code> yellow: string;</code><br/><code> purple: string;</code><br/><code> orange: string;</code><br/><code> orangeDark: string;</code><br/><code> queryRed: string;</code><br/><code> queryGreen: string;</code><br/><code> queryPurple: string;</code><br/><code> queryOrange: string;</code><br/><code> brandPrimary: string;</code><br/><code> brandSuccess: string;</code><br/><code> brandWarning: string;</code><br/><code> brandDanger: string;</code><br/><code> online: string;</code><br/><code> warn: string;</code><br/><code> critical: string;</code><br/><code> }</code> | |
|
|
| [shadows](#shadows-property) | <code>{</code><br/><code> listItem: string;</code><br/><code> }</code> | |
|
|
| [type](#type-property) | <code>GrafanaThemeType</code> | |
|
|
|
|
### colors property
|
|
|
|
<b>Signature</b>
|
|
|
|
```typescript
|
|
colors: {
|
|
bg1: string;
|
|
bg2: string;
|
|
bg3: string;
|
|
border1: string;
|
|
border2: string;
|
|
border3: string;
|
|
bgBlue1: string;
|
|
bgBlue2: string;
|
|
dashboardBg: string;
|
|
bodyBg: string;
|
|
panelBg: string;
|
|
panelBorder: string;
|
|
pageHeaderBg: string;
|
|
pageHeaderBorder: string;
|
|
dropdownBg: string;
|
|
dropdownShadow: string;
|
|
dropdownOptionHoverBg: string;
|
|
link: string;
|
|
linkDisabled: string;
|
|
linkHover: string;
|
|
linkExternal: string;
|
|
textStrong: string;
|
|
textHeading: string;
|
|
text: string;
|
|
textSemiWeak: string;
|
|
textWeak: string;
|
|
textFaint: string;
|
|
textBlue: string;
|
|
formLabel: string;
|
|
formDescription: string;
|
|
formInputBg: string;
|
|
formInputBgDisabled: string;
|
|
formInputBorder: string;
|
|
formInputBorderHover: string;
|
|
formInputBorderActive: string;
|
|
formInputBorderInvalid: string;
|
|
formFocusOutline: string;
|
|
formInputText: string;
|
|
formInputDisabledText: string;
|
|
formInputPlaceholderText: string;
|
|
formValidationMessageText: string;
|
|
formValidationMessageBg: string;
|
|
formSwitchBg: string;
|
|
formSwitchBgActive: string;
|
|
formSwitchBgActiveHover: string;
|
|
formSwitchBgHover: string;
|
|
formSwitchBgDisabled: string;
|
|
formSwitchDot: string;
|
|
formCheckboxBgChecked: string;
|
|
formCheckboxBgCheckedHover: string;
|
|
formCheckboxCheckmark: string;
|
|
};
|
|
```
|
|
|
|
### isDark property
|
|
|
|
<b>Signature</b>
|
|
|
|
```typescript
|
|
isDark: boolean;
|
|
```
|
|
|
|
### isLight property
|
|
|
|
<b>Signature</b>
|
|
|
|
```typescript
|
|
isLight: boolean;
|
|
```
|
|
|
|
### palette property
|
|
|
|
<b>Signature</b>
|
|
|
|
```typescript
|
|
palette: {
|
|
black: string;
|
|
white: string;
|
|
dark1: string;
|
|
dark2: string;
|
|
dark3: string;
|
|
dark4: string;
|
|
dark5: string;
|
|
dark6: string;
|
|
dark7: string;
|
|
dark8: string;
|
|
dark9: string;
|
|
dark10: string;
|
|
gray1: string;
|
|
gray2: string;
|
|
gray3: string;
|
|
gray4: string;
|
|
gray5: string;
|
|
gray6: string;
|
|
gray7: string;
|
|
gray98: string;
|
|
gray95: string;
|
|
gray85: string;
|
|
gray70: string;
|
|
gray60: string;
|
|
gray33: string;
|
|
gray25: string;
|
|
gray15: string;
|
|
gray10: string;
|
|
gray05: string;
|
|
blue95: string;
|
|
blue85: string;
|
|
blue80: string;
|
|
blue77: string;
|
|
red88: string;
|
|
redBase: string;
|
|
redShade: string;
|
|
greenBase: string;
|
|
greenShade: string;
|
|
red: string;
|
|
yellow: string;
|
|
purple: string;
|
|
orange: string;
|
|
orangeDark: string;
|
|
queryRed: string;
|
|
queryGreen: string;
|
|
queryPurple: string;
|
|
queryOrange: string;
|
|
brandPrimary: string;
|
|
brandSuccess: string;
|
|
brandWarning: string;
|
|
brandDanger: string;
|
|
online: string;
|
|
warn: string;
|
|
critical: string;
|
|
};
|
|
```
|
|
|
|
### shadows property
|
|
|
|
<b>Signature</b>
|
|
|
|
```typescript
|
|
shadows: {
|
|
listItem: string;
|
|
};
|
|
```
|
|
|
|
### type property
|
|
|
|
<b>Signature</b>
|
|
|
|
```typescript
|
|
type: GrafanaThemeType;
|
|
```
|