IRMA css

IRMA css

Source: src/variables/colours.scss, line 5

2.1.1 Colours from the IRMA app

  • #004C92; New IRMA blue

    $irma-blue
  • #2bc194; IRMA green

    $irma-green
  • #00b1e6; (Old) IRMA blue

    $irma-light-blue
  • #d44454; IRMA red

    $irma-red
  • #ffbb58; IRMA yellow

    $irma-yellow

Source: src/variables/colours.scss, line 24

2.1.1 Colours for interface elements

  • #ffffff; For a border around the whole element

    $border-color
  • #004C92; For the background

    $background-color
  • #47679e; For the helper background

    $helper-color
  • #ffffff; For background of the actual content

    $content-bg-color
  • #2bc194; For the background of the buttons

    $button-color

Source: src/variables/colours.scss, line 43

2.1.2 Text colours

For the fonts

  • #ffffff; For the header text

    $header-text-color
  • #7f7f7f; For the content text

    $content-text-color
  • #7f7f7f; For links in the content

    $content-link-color
  • #004C92; For the hover state on links in the content

    $content-link-color-hover
  • #ffffff; For the button foreground text

    $button-text-color

Source: src/variables/fonts.scss, line 1

2.2 Fonts

We use Roboto as default font, with Tahoma and Arial as fall-back options. As Roboto is a custom font, it is only used if it is imported by the website explicitly.

Source: src/variables/sizes.scss, line 1

2.3 Sizes

These variables contain the dimensions of different aspects of the components. See source file for definitions.