@lbry/components

Styling for shared components across LBRY properties

Installation

$ npm i @lbry/components sass -D

We recommend using this module with Dart Sass for its' focus on speed and low dependency count.

If you are using @lbry/components, you can safely remove @lbry/color if you've already included it separately (this module includes it by default).

Demo

Check out index.html in the dist folder.

Usage

Your main Sass file:

@charset "utf-8";

@import "@lbry/components/sass/";
// ...your other Sass imports

In your watch scripts for Sass files, ensure you load the node_modules path in order to import this module in your project without silly prefixes like ../../../. What a mess.

Example package.json scripts section:

"scripts": {
  ...,
  "sass:dev": "sass --load-path=node_modules --watch app/sass:app/dist --style compressed",
  "sass:prod": "sass --load-path=node_modules --update app/sass:app/dist --style compressed",
  ...
}

They are nearly identical, save for --watch and --update. Please refer to the Dart Sass README for assistance on how to integrate it with your project. The above example is taken from the lbry.tech repo.

License

BSD 3-Clause Copyright © LBRY Inc.