diff --git a/src/sections/Projects/Sistent/about.js b/src/sections/Projects/Sistent/about.js index 0f754a1b8778..084d7ab18389 100644 --- a/src/sections/Projects/Sistent/about.js +++ b/src/sections/Projects/Sistent/about.js @@ -18,11 +18,9 @@ const codes = [ import { Button } from "@layer5/sistent"; -
- - - -
+ + +
`, ]; @@ -42,27 +40,47 @@ const SistentAbout = () => {

About Sistent

- Sistent is the Layer5 Design System - an open source design system that offers building blocks to create consistent, accessible, and user-friendly interfaces. It's aimed at developers who want to design applications aligned with the same brand and ensure a uniform user experience across different products. + Sistent is the Layer5 Design System - an open source design system + that offers building blocks to create consistent, accessible, and + user-friendly interfaces. It's aimed at developers who want to + design applications aligned with the same brand and ensure a + uniform user experience across different products.

- Sistent leverages Material UI libraries and provides a custom theme on top of it for a consistent look and feel. It includes components, icons, and design tokens that developers can readily integrate into their applications. By using Sistent, developers can save time and effort while maintaining a high-quality user experience throughout Layer5 products. + Sistent leverages Material UI libraries and provides a custom + theme on top of it for a consistent look and feel. It includes + components, icons, and design tokens that developers can readily + integrate into their applications. By using Sistent, developers + can save time and effort while maintaining a high-quality user + experience throughout Layer5 products.

- Sistent provides a consistent user experience across Layer5 projects and any frontend software projects that choose to use Sistent, too. + + Sistent provides a consistent user experience across Layer5 + projects and any frontend software projects that choose to use + Sistent, too. +

- 'Sistent' is a play on words to ensure that we have a consistent theme, components, design tokens, etc across all of the apps that will be using this library. Sistent is a design system that uses the MUI v5 components and a custom theme provider instead of using the default theme from MUI v5. + 'Sistent' is a play on words to ensure that we have a{" "} + consistent theme, components, design tokens, etc across all + of the apps that will be using this library. Sistent is a design + system that uses the MUI v5 components and a{" "} + custom theme provider instead of using the default theme + from MUI v5.

- Sistent is built with Typescript and Reactjs and contains components and a large collection of icons that can be reused across projects. If you’re interested in joining the project (please do!), let us know, and we will help you get started on contributing. + Sistent is built with Typescript and Reactjs and contains + components and a large collection of icons that can be reused + across projects. If you’re interested in joining the project + (please do!), let us know, and we will help you get started on + contributing.

Installation and Quickstart

-

- To install the Sistent NPM package, run: -

+

To install the Sistent NPM package, run:

@@ -75,11 +93,9 @@ const SistentAbout = () => {
-
- - - -
+ + +
diff --git a/src/sections/Projects/Sistent/components/button/code.js b/src/sections/Projects/Sistent/components/button/code.js index 033902afdd03..a7d2b1f2e733 100644 --- a/src/sections/Projects/Sistent/components/button/code.js +++ b/src/sections/Projects/Sistent/components/button/code.js @@ -140,11 +140,7 @@ export const ButtonCode = () => {
-