6.12.1 ā€¢ Published 1 month ago

decentraland-ui v6.12.1

Weekly downloads
704
License
MIT
Repository
github
Last release
1 month ago

Decentraland UI CircleCI semantic-release

This is basically semantic-ui-react themed with Decentrland's look & feel + some of our own components

See: ui.decentraland.org

Usage

Install it:

npm install --save decentraland-ui

Import Decentraland UI's styles in your App's entry point

import 'decentraland-ui/lib/styles.css'

Now you can use Decentraland UI's components:

import React from 'react'
import { Button } from 'decentraland-ui'

export class MyApp extends React.Component {
  render() {
    return <Button>Sabe</Button>
  }
}

Without React

You can also use decentraland-ui as a CSS framework just by adding this tag in your <head>:

<link href="https://ui.decentraland.org/styles.css" rel="stylesheet" />

And then using Semantic UI classes like this:

<button class="ui button">Click me!</button>

šŸŒ

Minimizing bundle size

You can import just the essential component and reduce the size of your bundles, like this:

// import css
import 'semantic-ui-css/semantic.min.css'
import 'balloon-css/balloon.min.css'
import 'decentraland-ui/dist/themes/base-theme.css'
import 'decentraland-ui/dist/themes/alternative/light-theme.css'
// or import 'decentraland-ui/dist/themes/alternative/dark-theme.css'

// Then import just the components you will use
import Grid from 'semantic-ui-react/dist/commonjs/collections/Grid/Grid'
import { Button } from 'decentraland-ui/dist/components/Button/Button'
import { Card } from 'decentraland-ui/dist/components/Card/Card'

Alternative themes

You can use one of our alternative themes by importing in after Decentraland UI's styles, like this:

import 'decentraland-ui/lib/styles.css'
import 'decentraland-ui/lib/dark-theme.css'

Or you can create your own theme like this:

/* my-theme.css */
:root {
  /* global */
  --background: #ffffff;
  --danger: #ffa900;
  --error: #ff0000;

  /* buttons */
  --primary: #ff2d55;
  --secondary: #f3f2f5;
  --primary-hover: #ff3d61;
  --secondary-hover: #ecebed;

  /* on modals */
  --secondary-on-modal: #f3f2f5;
  --secondary-on-modal-hover: #ecebed;
  --card-on-modal: #ffffff;

  /* text */
  --text: #16141a;
  --secondary-text: #676370;
  --text-on-primary: #ffffff;
  --text-on-secondary: #16141a;

  /* ui */
  --divider: #67637033;
  --dropdown: #ffffff;
  --dropdown-hover: #f3f2f5;
  --popup: #16141a;
  --popup-text: #ffffff;
  --navbar-popup: #ffffff;
  --navbar-popup-hover: #f3f2f5;
  --card: #ffffff;
  --outline: 1px solid #00000005;
  --toast: #16141a;
  --toast-text: #ffffff;
  --modal: #ffffff;
  --dimmer: #ffffffdd;
  --clear-divider: #a09ba8;


  /* shadows */
  --shadow-1: 0px 2px 4px 0px rgba(0, 0, 0, 0.08);
  --shadow-2: 0px 10px 20px 0px rgba(0, 0, 0, 0.12);
  --shadow-3: 0px 16px 32px 0px rgba(0, 0, 0, 0.16);
  --shadow-4: 0px 8px 16px 12px rgba(0, 0, 0, 0.1);

  --shadow-color-1: 0px 2px 4px 0px rgba(0, 0, 0, 0.16);
  --shadow-color-2: 0px 10px 20px 0px rgba(0, 0, 0, 0.2);
  --shadow-color-3: 0px 16px 32px 0px rgba(0, 0, 0, 0.24);

  /* svgs */
  --brightness: brightness(0.1); /* black svgs */
}

Development

Prerequisites: Node.js v16 (or compatible)

Install dependencies and start Storybook:

$ npm install
$ npm start

CI/CD

We deploy automatically to ui.decentraland.org and release a new version via semantic-release

6.12.1

1 month ago

6.12.0

1 month ago

6.11.0

2 months ago

6.10.0

2 months ago

6.8.0

4 months ago

6.9.0

4 months ago

6.9.2

4 months ago

6.9.1

4 months ago

6.9.3

2 months ago

6.7.0

4 months ago

6.6.0

5 months ago

6.5.3

5 months ago

6.5.2

5 months ago

6.5.1

5 months ago

6.1.2

6 months ago

6.1.3

5 months ago

6.2.0

5 months ago

6.3.0

5 months ago

6.0.0

7 months ago

6.1.0

7 months ago

6.1.1

7 months ago

5.23.4

7 months ago

5.23.3

8 months ago

5.23.2

8 months ago

5.23.1

8 months ago

5.23.0

8 months ago

5.20.0

8 months ago

5.21.0

8 months ago

5.22.0

8 months ago

5.19.0

8 months ago

5.17.2

9 months ago

5.17.1

9 months ago

5.18.0

9 months ago

5.17.0

9 months ago

5.15.0

9 months ago

5.16.0

9 months ago

5.14.2

9 months ago

5.14.1

9 months ago

5.14.0

9 months ago

5.12.0

9 months ago

5.13.2

9 months ago

5.13.1

9 months ago

5.13.0

9 months ago

5.11.0

9 months ago

5.10.1

10 months ago

5.10.0

10 months ago

5.9.1

10 months ago

5.9.0

10 months ago

5.8.0

10 months ago

5.7.1

10 months ago

5.7.0

10 months ago

5.6.0

11 months ago

5.5.0

11 months ago

5.4.6

11 months ago

5.4.5

11 months ago

5.4.4

11 months ago

5.3.0

11 months ago

5.4.3

11 months ago

5.4.2

11 months ago

5.4.1

11 months ago

5.4.0

11 months ago

5.1.0

11 months ago

5.2.0

11 months ago

5.0.0

11 months ago

4.35.7

11 months ago

4.35.6

12 months ago

4.35.5

12 months ago

4.35.4

12 months ago

4.35.3

12 months ago

4.35.2

12 months ago

4.35.1

12 months ago

4.35.0

12 months ago

4.34.0

12 months ago

4.33.2

12 months ago

4.33.1

12 months ago

4.33.0

12 months ago

4.32.0

12 months ago

4.32.1

12 months ago

4.31.1

12 months ago

4.31.2

12 months ago

4.31.0

1 year ago

4.30.8

1 year ago

4.30.7

1 year ago

4.30.6

1 year ago

4.30.5

1 year ago

4.30.4

1 year ago

4.30.3

1 year ago

4.30.2

1 year ago

4.30.1

1 year ago

4.30.0

1 year ago

4.25.0

1 year ago

4.26.0

1 year ago

4.26.1

1 year ago

4.26.2

1 year ago

4.14.0

1 year ago

4.24.0

1 year ago

4.25.1

1 year ago

4.25.2

1 year ago

4.25.3

1 year ago

4.13.0

1 year ago

4.16.0

1 year ago

4.28.0

1 year ago

4.15.0

1 year ago

4.27.3

1 year ago

4.27.4

1 year ago

4.27.5

1 year ago

4.27.6

1 year ago

4.27.0

1 year ago

4.27.1

1 year ago

4.27.2

1 year ago

4.27.7

1 year ago

4.27.8

1 year ago

4.27.9

1 year ago

4.5.3

1 year ago

4.21.0

1 year ago

4.4.1

1 year ago

4.4.0

1 year ago

4.10.0

1 year ago

4.3.0

1 year ago

4.23.0

1 year ago

4.2.0

1 year ago

4.12.0

1 year ago

4.11.4

1 year ago

4.22.0

1 year ago

4.1.0

1 year ago

4.11.0

1 year ago

4.11.1

1 year ago

4.11.2

1 year ago

4.11.3

1 year ago

4.9.4

1 year ago

4.9.3

1 year ago

4.9.0

1 year ago

4.9.2

1 year ago

4.9.1

1 year ago

4.8.1

1 year ago

4.8.0

1 year ago

4.8.2

1 year ago

4.7.0

1 year ago

4.6.1

1 year ago

4.6.0

1 year ago

4.5.0

1 year ago

4.5.2

1 year ago

4.5.1

1 year ago

4.18.0

1 year ago

4.17.0

1 year ago

4.29.0

1 year ago

4.19.0

1 year ago

4.19.1

1 year ago

4.27.10

1 year ago

4.0.0

1 year ago

3.113.1

1 year ago

3.113.0

1 year ago

3.112.0

2 years ago

3.112.1

2 years ago

3.104.0

2 years ago

3.104.1

2 years ago

3.105.0

2 years ago

3.110.0

2 years ago

3.106.0

2 years ago

3.111.0

2 years ago

3.108.0

2 years ago

3.107.0

2 years ago

3.109.1

2 years ago

3.109.2

2 years ago

3.109.0

2 years ago

3.109.3

2 years ago

3.103.5

2 years ago

3.103.3

2 years ago

3.103.4

2 years ago

3.96.1

2 years ago

3.96.0

2 years ago

3.97.0

2 years ago

3.95.0

2 years ago

3.100.0

2 years ago

3.101.0

2 years ago

3.102.0

2 years ago

3.102.1

2 years ago

3.98.1

2 years ago

3.98.0

2 years ago

3.98.3

2 years ago

3.98.2

2 years ago

3.103.0

2 years ago

3.103.1

2 years ago

3.103.2

2 years ago

3.94.0

2 years ago

3.89.0

2 years ago

3.89.1

2 years ago

3.92.1

2 years ago

3.92.0

2 years ago

3.92.3

2 years ago

3.92.2

2 years ago

3.89.2

2 years ago

3.93.0

2 years ago

3.90.0

2 years ago

3.88.0

2 years ago

3.91.0

2 years ago

3.85.0

2 years ago

3.86.1

2 years ago

3.86.0

2 years ago

3.84.0

2 years ago

3.87.2

2 years ago

3.87.0

2 years ago

3.87.1

2 years ago

3.83.0

2 years ago

3.83.1

2 years ago

3.79.0

2 years ago

3.81.0

2 years ago

3.82.0

2 years ago

3.79.1

2 years ago

3.79.2

2 years ago

3.78.0

2 years ago

3.80.1

2 years ago

3.80.0

2 years ago

3.62.0

2 years ago

3.73.1

2 years ago

3.73.0

2 years ago

3.63.3

2 years ago

3.63.2

2 years ago

3.63.1

2 years ago

3.63.0

2 years ago

3.74.0

2 years ago

3.60.0

2 years ago

3.68.0

2 years ago

3.60.1

2 years ago

3.71.0

2 years ago

3.71.1

2 years ago

3.68.1

2 years ago

3.61.0

2 years ago

3.72.0

2 years ago

3.69.2

2 years ago

3.69.1

2 years ago

3.69.0

2 years ago

3.66.1

2 years ago

3.66.0

2 years ago

3.77.0

2 years ago

3.67.1

2 years ago

3.67.0

2 years ago

3.70.0

2 years ago

3.70.1

2 years ago

3.70.2

2 years ago

3.70.3

2 years ago

3.64.1

2 years ago

3.64.0

2 years ago

3.75.1

2 years ago

3.75.0

2 years ago

3.65.0

2 years ago

3.76.0

2 years ago

3.59.0

2 years ago

3.56.0

2 years ago

3.58.0

2 years ago

3.53.2-rc

2 years ago

3.57.0

2 years ago

3.54.1

2 years ago

3.54.0

2 years ago

3.55.0

2 years ago

3.53.2

2 years ago

3.53.1

2 years ago

3.53.0

2 years ago

3.50.1

2 years ago

3.51.1

2 years ago

3.51.0

2 years ago

3.52.0

2 years ago

3.47.0

2 years ago

3.47.1

2 years ago

3.40.0

2 years ago

3.48.0

2 years ago

3.40.0-rc5

2 years ago

3.45.0

2 years ago

3.40.0-rc2

2 years ago

3.40.0-rc3

2 years ago

3.40.0-rc4

2 years ago

3.46.0

2 years ago

3.40.0-rc

2 years ago

3.43.0

2 years ago

3.44.0

2 years ago

3.41.0

2 years ago

3.41.1

2 years ago

3.41.2

2 years ago

3.49.0

2 years ago

3.42.0

2 years ago

3.39.1

2 years ago

3.36.0

3 years ago

3.35.0

3 years ago

3.37.0

3 years ago

3.37.1

3 years ago

3.37.2

3 years ago

3.33.0

3 years ago

3.34.0

3 years ago

3.37.0-rc

3 years ago

3.34.0-rc

3 years ago

3.32.0

3 years ago

3.38.0

3 years ago

3.34.0-rc8

3 years ago

3.34.0-rc3

3 years ago

3.34.0-rc2

3 years ago

3.34.0-rc5

3 years ago

3.34.0-rc4

3 years ago

3.34.0-rc7

3 years ago

3.34.0-rc6

3 years ago

3.39.0

3 years ago

3.30.1-rc

3 years ago

3.30.3-rc2

3 years ago

3.31.0

3 years ago

3.28.0

3 years ago

3.29.0

3 years ago

3.30.3-rc

3 years ago

3.30.1-rc2

3 years ago

3.30.1-rc3

3 years ago

3.30.0

3 years ago

3.30.1

3 years ago

3.30.2

3 years ago

3.30.3

3 years ago

3.27.0

3 years ago

3.24.0

3 years ago

3.25.0

3 years ago

3.22.0

3 years ago

3.23.0

3 years ago

3.26.0

3 years ago

3.20.1

3 years ago

3.21.0

3 years ago

3.20.0-rc2

3 years ago

3.19.0

3 years ago

13.19.0-rc2

3 years ago

13.19.0-rc

3 years ago

3.20.0

3 years ago

3.17.0

3 years ago

3.18.1

3 years ago

3.18.0

3 years ago

3.20.0-rc

3 years ago

3.15.0

3 years ago

3.16.1

3 years ago

3.16.0

3 years ago

3.13.0-rc

3 years ago

3.14.0

3 years ago

3.13.0

3 years ago

3.13.0-rc2

3 years ago

3.13.0-rc4

3 years ago

3.13.0-rc3

3 years ago

3.12.1

3 years ago

3.12.0

3 years ago

3.11.0

3 years ago

3.10.0

3 years ago

3.9.0

3 years ago

3.8.0

3 years ago

3.7.1

3 years ago

3.7.0

3 years ago

3.6.0

3 years ago

3.5.2

4 years ago

3.5.1

4 years ago

3.5.0

4 years ago

3.2.0

4 years ago

3.1.4

4 years ago

3.4.0

4 years ago

3.4.2

4 years ago

3.4.1

4 years ago

3.3.0

4 years ago

3.1.3

4 years ago

3.1.2

4 years ago

3.1.1

4 years ago

3.1.0

4 years ago

3.0.0

4 years ago

2.30.0

4 years ago

3.0.0-rc

4 years ago

2.29.0

4 years ago

2.29.0-rc2

4 years ago

2.29.0-rc

4 years ago

2.27.0

4 years ago

2.28.0

4 years ago

2.26.3

4 years ago

2.26.3-rc2

4 years ago

2.26.3-rc

4 years ago

2.26.2

4 years ago

2.26.1

4 years ago

2.26.0

4 years ago

2.25.0

4 years ago

2.24.0

4 years ago

2.24.0-rc

4 years ago

2.23.1

4 years ago

2.23.0

5 years ago

2.22.3

5 years ago

2.22.1

5 years ago

2.22.2

5 years ago

2.22.0

5 years ago

2.21.0

5 years ago

2.21.2

5 years ago

2.21.1

5 years ago

2.20.4

5 years ago

2.20.2

5 years ago

2.20.3

5 years ago

2.20.1

5 years ago

2.20.0

5 years ago

2.19.0

5 years ago

2.18.0

5 years ago

2.17.0

5 years ago

2.16.2

5 years ago

2.16.1

5 years ago

2.16.0

5 years ago

2.15.0

5 years ago

2.14.1

5 years ago

2.14.0

5 years ago

2.13.1

5 years ago

2.13.0

5 years ago

2.12.2

5 years ago

2.12.0

5 years ago

2.12.1

5 years ago

2.11.2

5 years ago

2.11.1

5 years ago

2.11.0

5 years ago

2.11.0-rc.5

5 years ago

2.11.0-rc.4

5 years ago

2.11.0-rc.3

5 years ago

2.11.0-rc.2

5 years ago

2.11.0-rc

5 years ago

2.10.2

5 years ago

2.10.1

5 years ago

2.10.0

5 years ago

2.9.0

5 years ago

2.8.3

5 years ago

2.8.2

5 years ago

2.8.1

5 years ago

2.8.1-rc2

5 years ago

2.8.1-rc

5 years ago

2.8.0

5 years ago

2.8.0-rc5

5 years ago

2.8.0-rc4

5 years ago

2.8.0-rc3

5 years ago

2.8.0-rc2

5 years ago

2.8.0-rc

5 years ago

2.7.0

5 years ago

2.6.4

5 years ago

2.6.3

5 years ago

2.6.2

5 years ago

2.6.1

5 years ago

2.6.0

5 years ago

2.5.0

5 years ago

2.4.0

5 years ago

2.3.4

6 years ago

2.3.3

6 years ago

2.3.2

6 years ago

2.3.1

6 years ago

2.3.0

6 years ago

2.2.2

6 years ago

2.2.1

6 years ago

2.2.0

6 years ago

2.1.1-rc10

6 years ago

2.1.1-rc9

6 years ago

2.1.1-rc8

6 years ago

2.1.1-rc7

6 years ago

2.1.1-rc6

6 years ago

2.1.1-rc5

6 years ago

2.1.1-rc4

6 years ago

2.1.1-rc3

6 years ago

2.1.1-rc2

6 years ago

2.1.1-rc

6 years ago

2.1.0

6 years ago

2.0.0

6 years ago

2.0.0-rc7

6 years ago

2.0.0-rc6

6 years ago

2.0.0-rc5

6 years ago

2.0.0-rc4

6 years ago

2.0.0-rc3

6 years ago

2.0.0-rc2

6 years ago

2.0.0-rc

6 years ago

1.21.0

6 years ago

1.20.0

6 years ago

1.20.0-rc2

6 years ago

1.20.0-rc1

6 years ago

1.20.0-rc

6 years ago

1.19.0

6 years ago

1.18.3-rc

6 years ago

1.18.2

6 years ago

1.18.2-rc.3

6 years ago

1.18.2-rc.2

6 years ago

1.18.2-rc

6 years ago

1.18.1

6 years ago

1.18.0

6 years ago

1.17.0

6 years ago

1.17.0-rc3

6 years ago

1.17.0-rc2

6 years ago

1.17.0-rc

6 years ago

1.16.2

6 years ago

1.16.1

6 years ago

1.16.0

6 years ago

1.15.3

6 years ago

1.15.2

6 years ago

1.15.1

6 years ago

1.15.0

6 years ago

1.14.0

6 years ago

1.14.0-rc2

6 years ago

1.14.0-rc1

6 years ago

1.13.1

6 years ago

1.13.0

6 years ago

1.12.9

6 years ago

1.12.8

6 years ago

1.12.7

6 years ago

1.12.6

6 years ago

1.12.5

6 years ago

1.12.4

6 years ago

1.12.3

6 years ago

1.12.2

6 years ago

1.12.1

6 years ago

1.12.0

6 years ago

1.11.1

6 years ago

1.11.1-rc1

6 years ago

1.11.0

6 years ago

1.10.1

6 years ago

1.10.0

6 years ago

1.9.0

6 years ago

1.8.0

6 years ago

1.7.1

6 years ago

1.7.0

6 years ago

1.6.1

6 years ago

1.6.0

6 years ago

1.5.5

6 years ago

1.5.4

6 years ago

1.5.3

6 years ago

1.5.2

6 years ago

1.5.1

6 years ago

1.5.0

6 years ago

1.4.0

6 years ago

1.3.2

6 years ago

1.3.1

6 years ago

1.3.0

6 years ago

1.2.0

6 years ago

1.1.0

6 years ago

1.0.1

6 years ago

1.0.0

6 years ago