Customizing CSS in Digit UI

Overview

This document describes how to publish CSS if there is any CSS Customization.

 

While Customizing, if any changes are made In the CSS folder it has to be compiled and published to npm.

Currently, the CSS was published in npm as @egovernments/digit-ui-css
Please check this NPM link https://www.npmjs.com/package/@egovernments/digit-ui-css .

 

So if any changes are made to the CSS folder locally have to be published in different Organisation and in the same or different name.

 

ie as @xyz/digit-ui-css and version as 1.0.0

then following changes has to be made in the code to reflect in the digit-ui build.
In this file location

frontend/micro-ui/web/public/index.html

style sheet link has to be updated as follow,

<link rel="stylesheet" href="https://unpkg.com/@xyz/digit-ui-css@1.0.0/dist/index.css"/>

Use Either of the Following commands to publish the CSS

  • In the frontend/micro-ui/web/micro-ui-internals folder run
    yarn run publish:css
    or

  • In the frontend/micro-ui/web/micro-ui-internals/packages/css folder run
    yarn run publish --access public

Reference Doc for Publishing any package to npm

https://docs.npmjs.com/creating-and-publishing-scoped-public-packages