Vitamin Web

Overview

Vitamin is the digital section of the Decathlon Design System, which is a framework that helps develop consistent and quality experiences. The repository hosts libraries for web applications, allowing the consumption of elements according to product constraints. It offers core packages, global CSS styles, specific CSS styles, icons, and assets. Additionally, the community has developed libraries for React, Svelte, and Vue components. Contributions from the community are welcome, and the setup of the local development environment is explained in the contributing docs.

Features

• Core packages: Libraries for consuming elements of the Design System with different technologies and levels of granularity.
• Global CSS styles: Complete CSS with a wide range of utility classes, generated with Tailwind CSS. Can be optimized for production by purging unused CSS classes.
• Specific CSS styles: Packages for consuming elements with a higher level of granularity, providing only the styles needed. Compatible with IE 11.
• Icons: Library of SVG icons that can be included in various ways (SVGs, icon font, sprite, CSS, embedded).
• Assets: Library of SVG assets that can be included in various ways (SVGs, asset font, sprite, CSS, embedded).
• React: Library of React components based on the core packages.
• Svelte: Library of Svelte components based on the core packages.
• Vue: Library of Vue components based on the core packages.

Installation

To set up the local development environment, follow these steps:

1. Clone the repository using Git.
2. Install the necessary dependencies using Yarn workspaces and nx.
3. Use Lerna to manage versioning and publishing.
4. Refer to the contributing docs for more information on how to contribute.

Summary

Vitamin is a part of the Decathlon Design System and offers a wide range of libraries and packages for web application development. It provides core packages, global and specific CSS styles, icons, assets, and community-developed libraries for React, Svelte, and Vue components. Contributions from the community are encouraged, and the setup of the local development environment is explained in the contributing documentation.