styles property

  1. @css
List<StyleRule> styles
final

Implementation

@css
static final List<StyleRule> styles = [
  // Reset styles
  css('*, *::before, *::after').styles(raw: {
    'box-sizing': 'border-box',
    'margin': '0',
    'padding': '0',
  }),
  css('html, body').styles(raw: {
    'height': '100%',
    'margin': '0',
    'padding': '0',
  }),
  css('body').styles(raw: {
    'line-height': '1.5',
  }),
  css('img, picture, video, canvas, svg').styles(raw: {
    'display': 'block',
    'max-width': '100%',
  }),
  css('input, button, textarea, select').styles(raw: {
    'font': 'inherit',
  }),
  css('p, h1, h2, h3, h4, h5, h6').styles(raw: {
    'overflow-wrap': 'break-word',
  }),
  css('a').styles(raw: {
    'color': 'inherit',
    'text-decoration': 'none',
  }),
  css('button').styles(raw: {
    'cursor': 'pointer',
    'background': 'none',
    'border': 'none',
  }),
  // Scrollbar styling
  css('::-webkit-scrollbar').styles(raw: {
    'width': '8px',
    'height': '8px',
  }),
  css('::-webkit-scrollbar-track').styles(raw: {
    'background': 'var(--arcane-surface-variant)',
    'border-radius': '4px',
  }),
  css('::-webkit-scrollbar-thumb').styles(raw: {
    'background': 'var(--arcane-outline)',
    'border-radius': '4px',
  }),
  css('::-webkit-scrollbar-thumb:hover').styles(raw: {
    'background': 'var(--arcane-on-surface-variant)',
  }),
];