6.13.0 • Published 7 months ago

decentraland-ui v6.13.0

Weekly downloads
704
License
MIT
Repository
github
Last release
7 months 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.13.0

7 months ago

6.12.3

7 months ago

6.12.2

7 months ago

6.12.1

10 months ago

6.12.0

10 months ago

6.11.0

11 months ago

6.10.0

11 months ago

6.8.0

1 year ago

6.9.0

1 year ago

6.9.2

12 months ago

6.9.1

12 months ago

6.9.3

11 months ago

6.7.0

1 year ago

6.6.0

1 year ago

6.5.3

1 year ago

6.5.2

1 year ago

6.5.1

1 year ago

6.1.2

1 year ago

6.1.3

1 year ago

6.2.0

1 year ago

6.3.0

1 year ago

6.0.0

1 year ago

6.1.0

1 year ago

6.1.1

1 year ago

5.23.4

1 year ago

5.23.3

1 year ago

5.23.2

1 year ago

5.23.1

1 year ago

5.23.0

1 year ago

5.20.0

1 year ago

5.21.0

1 year ago

5.22.0

1 year ago

5.19.0

1 year ago

5.17.2

1 year ago

5.17.1

1 year ago

5.18.0

1 year ago

5.17.0

1 year ago

5.15.0

1 year ago

5.16.0

1 year ago

5.14.2

1 year ago

5.14.1

1 year ago

5.14.0

1 year ago

5.12.0

1 year ago

5.13.2

1 year ago

5.13.1

1 year ago

5.13.0

1 year ago

5.11.0

1 year ago

5.10.1

1 year ago

5.10.0

2 years ago

5.9.1

2 years ago

5.9.0

2 years ago

5.8.0

2 years ago

5.7.1

2 years ago

5.7.0

2 years ago

5.6.0

2 years ago

5.5.0

2 years ago

5.4.6

2 years ago

5.4.5

2 years ago

5.4.4

2 years ago

5.3.0

2 years ago

5.4.3

2 years ago

5.4.2

2 years ago

5.4.1

2 years ago

5.4.0

2 years ago

5.1.0

2 years ago

5.2.0

2 years ago

5.0.0

2 years ago

4.35.7

2 years ago

4.35.6

2 years ago

4.35.5

2 years ago

4.35.4

2 years ago

4.35.3

2 years ago

4.35.2

2 years ago

4.35.1

2 years ago

4.35.0

2 years ago

4.34.0

2 years ago

4.33.2

2 years ago

4.33.1

2 years ago

4.33.0

2 years ago

4.32.0

2 years ago

4.32.1

2 years ago

4.31.1

2 years ago

4.31.2

2 years ago

4.31.0

2 years ago

4.30.8

2 years ago

4.30.7

2 years ago

4.30.6

2 years ago

4.30.5

2 years ago

4.30.4

2 years ago

4.30.3

2 years ago

4.30.2

2 years ago

4.30.1

2 years ago

4.30.0

2 years ago

4.25.0

2 years ago

4.26.0

2 years ago

4.26.1

2 years ago

4.26.2

2 years ago

4.14.0

2 years ago

4.24.0

2 years ago

4.25.1

2 years ago

4.25.2

2 years ago

4.25.3

2 years ago

4.13.0

2 years ago

4.16.0

2 years ago

4.28.0

2 years ago

4.15.0

2 years ago

4.27.3

2 years ago

4.27.4

2 years ago

4.27.5

2 years ago

4.27.6

2 years ago

4.27.0

2 years ago

4.27.1

2 years ago

4.27.2

2 years ago

4.27.7

2 years ago

4.27.8

2 years ago

4.27.9

2 years ago

4.5.3

2 years ago

4.21.0

2 years ago

4.4.1

2 years ago

4.4.0

2 years ago

4.10.0

2 years ago

4.3.0

2 years ago

4.23.0

2 years ago

4.2.0

2 years ago

4.12.0

2 years ago

4.11.4

2 years ago

4.22.0

2 years ago

4.1.0

2 years ago

4.11.0

2 years ago

4.11.1

2 years ago

4.11.2

2 years ago

4.11.3

2 years ago

4.9.4

2 years ago

4.9.3

2 years ago

4.9.0

2 years ago

4.9.2

2 years ago

4.9.1

2 years ago

4.8.1

2 years ago

4.8.0

2 years ago

4.8.2

2 years ago

4.7.0

2 years ago

4.6.1

2 years ago

4.6.0

2 years ago

4.5.0

2 years ago

4.5.2

2 years ago

4.5.1

2 years ago

4.18.0

2 years ago

4.17.0

2 years ago

4.29.0

2 years ago

4.19.0

2 years ago

4.19.1

2 years ago

4.27.10

2 years ago

4.0.0

2 years ago

3.113.1

2 years ago

3.113.0

2 years 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

3 years ago

3.87.2

2 years ago

3.87.0

2 years ago

3.87.1

2 years ago

3.83.0

3 years ago

3.83.1

3 years ago

3.79.0

3 years ago

3.81.0

3 years ago

3.82.0

3 years ago

3.79.1

3 years ago

3.79.2

3 years ago

3.78.0

3 years ago

3.80.1

3 years ago

3.80.0

3 years ago

3.62.0

3 years ago

3.73.1

3 years ago

3.73.0

3 years ago

3.63.3

3 years ago

3.63.2

3 years ago

3.63.1

3 years ago

3.63.0

3 years ago

3.74.0

3 years ago

3.60.0

3 years ago

3.68.0

3 years ago

3.60.1

3 years ago

3.71.0

3 years ago

3.71.1

3 years ago

3.68.1

3 years ago

3.61.0

3 years ago

3.72.0

3 years ago

3.69.2

3 years ago

3.69.1

3 years ago

3.69.0

3 years ago

3.66.1

3 years ago

3.66.0

3 years ago

3.77.0

3 years ago

3.67.1

3 years ago

3.67.0

3 years ago

3.70.0

3 years ago

3.70.1

3 years ago

3.70.2

3 years ago

3.70.3

3 years ago

3.64.1

3 years ago

3.64.0

3 years ago

3.75.1

3 years ago

3.75.0

3 years ago

3.65.0

3 years ago

3.76.0

3 years ago

3.59.0

3 years ago

3.56.0

3 years ago

3.58.0

3 years ago

3.53.2-rc

3 years ago

3.57.0

3 years ago

3.54.1

3 years ago

3.54.0

3 years ago

3.55.0

3 years ago

3.53.2

3 years ago

3.53.1

3 years ago

3.53.0

3 years ago

3.50.1

3 years ago

3.51.1

3 years ago

3.51.0

3 years ago

3.52.0

3 years ago

3.47.0

3 years ago

3.47.1

3 years ago

3.40.0

3 years ago

3.48.0

3 years ago

3.40.0-rc5

3 years ago

3.45.0

3 years ago

3.40.0-rc2

3 years ago

3.40.0-rc3

3 years ago

3.40.0-rc4

3 years ago

3.46.0

3 years ago

3.40.0-rc

3 years ago

3.43.0

3 years ago

3.44.0

3 years ago

3.41.0

3 years ago

3.41.1

3 years ago

3.41.2

3 years ago

3.49.0

3 years ago

3.42.0

3 years ago

3.39.1

3 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

4 years ago

3.21.0

4 years ago

3.20.0-rc2

4 years ago

3.19.0

4 years ago

13.19.0-rc2

4 years ago

13.19.0-rc

4 years ago

3.20.0

4 years ago

3.17.0

4 years ago

3.18.1

4 years ago

3.18.0

4 years ago

3.20.0-rc

4 years ago

3.15.0

4 years ago

3.16.1

4 years ago

3.16.0

4 years ago

3.13.0-rc

4 years ago

3.14.0

4 years ago

3.13.0

4 years ago

3.13.0-rc2

4 years ago

3.13.0-rc4

4 years ago

3.13.0-rc3

4 years ago

3.12.1

4 years ago

3.12.0

4 years ago

3.11.0

4 years ago

3.10.0

4 years ago

3.9.0

4 years ago

3.8.0

4 years ago

3.7.1

4 years ago

3.7.0

4 years ago

3.6.0

4 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

5 years ago

3.1.1

5 years ago

3.1.0

5 years ago

3.0.0

5 years ago

2.30.0

5 years ago

3.0.0-rc

5 years ago

2.29.0

5 years ago

2.29.0-rc2

5 years ago

2.29.0-rc

5 years ago

2.27.0

5 years ago

2.28.0

5 years ago

2.26.3

5 years ago

2.26.3-rc2

5 years ago

2.26.3-rc

5 years ago

2.26.2

5 years ago

2.26.1

5 years ago

2.26.0

5 years ago

2.25.0

5 years ago

2.24.0

5 years ago

2.24.0-rc

5 years ago

2.23.1

5 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

6 years ago

2.14.1

6 years ago

2.14.0

6 years ago

2.13.1

6 years ago

2.13.0

6 years ago

2.12.2

6 years ago

2.12.0

6 years ago

2.12.1

6 years ago

2.11.2

6 years ago

2.11.1

6 years ago

2.11.0

6 years ago

2.11.0-rc.5

6 years ago

2.11.0-rc.4

6 years ago

2.11.0-rc.3

6 years ago

2.11.0-rc.2

6 years ago

2.11.0-rc

6 years ago

2.10.2

6 years ago

2.10.1

6 years ago

2.10.0

6 years ago

2.9.0

6 years ago

2.8.3

6 years ago

2.8.2

6 years ago

2.8.1

6 years ago

2.8.1-rc2

6 years ago

2.8.1-rc

6 years ago

2.8.0

6 years ago

2.8.0-rc5

6 years ago

2.8.0-rc4

6 years ago

2.8.0-rc3

6 years ago

2.8.0-rc2

6 years ago

2.8.0-rc

6 years ago

2.7.0

6 years ago

2.6.4

6 years ago

2.6.3

6 years ago

2.6.2

6 years ago

2.6.1

6 years ago

2.6.0

6 years ago

2.5.0

6 years ago

2.4.0

6 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

7 years ago

1.18.3-rc

7 years ago

1.18.2

7 years ago

1.18.2-rc.3

7 years ago

1.18.2-rc.2

7 years ago

1.18.2-rc

7 years ago

1.18.1

7 years ago

1.18.0

7 years ago

1.17.0

7 years ago

1.17.0-rc3

7 years ago

1.17.0-rc2

7 years ago

1.17.0-rc

7 years ago

1.16.2

7 years ago

1.16.1

7 years ago

1.16.0

7 years ago

1.15.3

7 years ago

1.15.2

7 years ago

1.15.1

7 years ago

1.15.0

7 years ago

1.14.0

7 years ago

1.14.0-rc2

7 years ago

1.14.0-rc1

7 years ago

1.13.1

7 years ago

1.13.0

7 years ago

1.12.9

7 years ago

1.12.8

7 years ago

1.12.7

7 years ago

1.12.6

7 years ago

1.12.5

7 years ago

1.12.4

7 years ago

1.12.3

7 years ago

1.12.2

7 years ago

1.12.1

7 years ago

1.12.0

7 years ago

1.11.1

7 years ago

1.11.1-rc1

7 years ago

1.11.0

7 years ago

1.10.1

7 years ago

1.10.0

7 years ago

1.9.0

7 years ago

1.8.0

7 years ago

1.7.1

7 years ago

1.7.0

7 years ago

1.6.1

7 years ago

1.6.0

7 years ago

1.5.5

7 years ago

1.5.4

7 years ago

1.5.3

7 years ago

1.5.2

7 years ago

1.5.1

7 years ago

1.5.0

7 years ago

1.4.0

7 years ago

1.3.2

7 years ago

1.3.1

7 years ago

1.3.0

7 years ago

1.2.0

7 years ago

1.1.0

7 years ago

1.0.1

7 years ago

1.0.0

7 years ago