# Finbers EPR UI Library

## Introduction

**Finbers EPR UI Component Library** is a framework agnostic UI library that was built specifically for the EPR mobile app (PWA).



## UI Components

- epr-textbox

- epr-textarea

- epr-data-card

- epr-checkbox

- epr-radiobtn

- epr-radiobtn-group

- epr-tabs

- epr-multi-selection

- epr-wizard



## CSS Custom Properties

### epr-textbox

- --textbox-font-family

- --textbox-font-size

- --textbox-placeholder-font-family

- --textbox-placeholder-font-size

- --input-label-font-family

- --input-label-font-size

- --month-picker-font-family

- --font-family

- --current-date-font-family

- --selected-date-font-family



### epr-textarea

-  --textarea-font-family

- --textarea-font-size

- --textarea-placeholder-font-family

- --textarea-placeholder-font-size

- --input-label-font-family

- --input-label-font-size



### epr-data-card

- --datacard-padding

- --datacard-background-colour

- --datacard-border

- --icon-container-background-colour

- --card-title-font-family

- --card-title-font-size

- --card-title-colour

- --card-text-font-family

- --card-text-font-size

- --card-text-colour



### epr-checkbox

- --padding

- --border-radius

- --font-family

- --font-size



### epr-radiobtn

- --padding

- --border-radius

- --font-family

- --font-size



### epr-radiobtn-group

- --label-text-font-family

- --label-text-font-size

- --input-label-font-family

- --input-label-font-size

- --padding

- --border-radius



### epr-tabs

- --tab-font-family

- --tab-font-size

- --tab-padding



### epr-multi-selection

- --options-container-padding

- --options-container-border

- --options-container-border-radius

- --label-padding

- --label-border-radius


### epr-wizard

- --title-font-family

- --title-font-size

- --title-color

- --title-margin-buttom

- --description-font-family

- --description-font-size

- --description-color

- --step-number-font-family

- --step-number-font-size

- --step-number-color

- --step-number-margin-buttom