Namespace, Primitive, Method

    hds-core

    1.2.0 • Public • Published

    hds-core npm npm bundle size

    Base styles and individual HTML component styles for the Helsinki Design System.

    📚 See the components in Storybook

    Getting started

    Installing the package:

    yarn add hds-core

    What's included

    hds-core/
    ├── src/                # source css
    └── lib/
        ├── components/     # collection of HDS component styles
        │   ├── all.css               # bundled stylesheet including all components
        |   └── <component name>/     # component stylesheets
        │       ├── <component name>.css
        │       :
        │
        ├── icons/          # collection of HDS icon styles
        │   ├── all.css               # bundled stylesheet including all icons
        │   ├── icon.css              # base styles for icons
        │   ├── icon-<icon name>.css  # individual icon stylesheet
        │   :
        │
        ├── utils/          # utility stylesheets
        ├── variables/      # collection of css variables and base styles
        └── base.css        # base styles
    

    Using the styles

    To import styles for all the core components, you'll need two stylesheets: base.css (the base styles and CSS variables) and components/all.css. If you use any of the icons, you'll also need icons/all.css. Do note that the all.css-files bundle all the components and icons into single stylesheets and thus are large in filesize.

    Therefore, we do recommend that you use individual component and icon stylesheets instead of the bundled styles.

    JS

    // import base styles and css variables
    import "hds-core";

    Helsinki fonts

    The Helsinki fonts are not included in the package due to copyright reasons.

    Overriding styles

    Helsinki Design System uses CSS variables from the hds-design-tokens package to control coloring, spacing and layout. You can override these variables if necessary, but it is not recommended.

    Development

    Read more here.

    Built with

    Keywords

    none

    Install

    npm i hds-core

    DownloadsWeekly Downloads

    378

    Version

    1.2.0

    License

    MIT

    Unpacked Size

    974 kB

    Total Files

    341

    Last publish

    Collaborators

    • avatar
    • avatar