Skip to content
This repository has been archived by the owner on Sep 20, 2024. It is now read-only.

barnardos/design-system

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Design System

Installation

  1. Install latest LTS Node.js.
  2. Install the Barnardo’s Design System components using:
npm install @barnardos/components
  1. Import the components you need. You can either import:
  • the React components (recommended)
  • just the CSS of the components

Importing the React components

Use named imports.

For example, to import the BackLink and Pagination components:

// MyComponent/index.js
import { BackLink, Pagination } from "@barnardos/components";

Importing the CSS only

If you aren’t using React, you can still use the CSS of each component.

For example, to import the CSS of the BackLink and Pagination components:

/* src/index.css */
@import "node_modules/@barnardos/components/src/components/custom-properties.css";
@import "node_modules/@barnardos/components/src/components/BackLink/index.css";
@import "node_modules/@barnardos/components/src/components/Pagination/index.css";

You’ll need to use postcss-present-env to transpile the CSS using the Design System’s PostCSS and browserslist configurations.


Looking to contribute? View the contributing guide.