Module

@adminjs/design-system

Members

# static constant contentCSS

Gives you the default styles for all "content" elements like: ul, li, h1-h5 etc.

Example

import styled from 'styled-components'
import { contentCSS } from '@adminjs/design-system'

const myComponent = styled`
  ${contentCSS};
`

View Source adminjs-design-system/src/utils/content-styles.ts, line 22

# static constant Reset

Resets css component which should be applied to the top of the html

Example

import { Reset } from '@adminjs/design-system'

<ThemeProvider theme={theme}>
  <Reset />
  <Box>
    { ... }
  </Box>
</ThemeProvider>

View Source adminjs-design-system/src/utils/reset.styles.ts, line 91

# static constant reset

Resets css styles which can be applied to element created by styled-component

Example

import { reset } from '@adminjs/design-system'

const myContentComponent = styled`
  ${reset};
`

View Source adminjs-design-system/src/utils/reset.styles.ts, line 19

Methods

# static combineStyles(newTheme) → {Theme}

Applies new styles to the default theme

Example

import { combineStyles } from '@adminjs/design-system`

const myTheme = combineStyles({
  colors: {
    primary100: '#000'
  }
})
Parameters:
Name Type Description
newTheme Partial.<Theme>

View Source adminjs-design-system/src/utils/combine-styles.ts, line 43

Theme

# static cssClass(className, regularClassopt)

Generates class name for given component. It is used by AdminJS core to append namespaced classes.

example

import { cssClass } from '@adminjs/design-system'

cssClass('Icon', 'my-regular-class-name')
// returns: 'adminjs_Icon my-regular-class-name'
Parameters:
Name Type Attributes Description
className string | Array.<string>
regularClass string <optional>

View Source adminjs-design-system/src/utils/css-class.ts, line 22

# static formatDate(date) → {string}

Formats date to YYYY-MM-DD

Parameters:
Name Type Description
date Date

View Source adminjs-design-system/src/utils/date-utils.ts, line 16

string

# static formatDateProperty(date, propertyType) → {string}

Based on the property type formats date to either YYYY-MM-DD HH:mm or YYYY-MM-DD

Parameters:
Name Type Description
date Date
propertyType PropertyType

View Source adminjs-design-system/src/utils/date-utils.ts, line 41

string

# static formatDateTime(date) → {string}

Formats date to YYYY-MM-DD HH:mm

Parameters:
Name Type Description
date Date

View Source adminjs-design-system/src/utils/date-utils.ts, line 32

string

# static formatTime(date) → {string}

Formats date to HH:mm

Parameters:
Name Type Description
date Date

View Source adminjs-design-system/src/utils/date-utils.ts, line 24

string

# static humanFileSize(size, unitopt) → {string}

Changes size in bytes to string. If unit is not provided - tries to find the best match.

Parameters:
Name Type Attributes Description
size number
unit 'B' | 'KB' | 'MB' | 'GB' | 'TB' <optional>

View Source adminjs-design-system/src/utils/human-file-size.ts, line 12

string

# static pad(pad) → {sting}

adds leading 0 to the number when it is lower than 10

Parameters:
Name Type Description
pad number

number - i.e 8

View Source adminjs-design-system/src/utils/date-utils.ts, line 8

formatted number: i.e. "08"

sting