This is the SUSE Pattern Library project

Created as a reference implementation of recommended common SUSE styles and components.

Intended for both products and online properties depending on the pattern.

SUSE-PL is not designed to be a replacement for existing frameworks and aims to make it as easy as possible to cherry pick useful code.

All CSS is prefixed .suse-pl so as not to break your site when importing.

# npm
npm install
npm start

# yarn
yarn install
yarn start

# pnpnm
pnpm install
pnpm start

npm run generate

You'll be prompted to enter a component name, e.g., suse-pl-button-success.

Edit the generated files in src/components/suse-pl-button-success/:

suse-pl-button-success.tsx: Component logic and JSX rendering;
suse-pl-button-success.scss or suse-pl-button-success.css: Styles for the component;
readme.md: Documentation for the component,

then open a pull request.

Helper utilities are in the utils directory. Just open an HTML file.

For feeedback and discussion please join #network-design-cop on slack.

Provide feedback