Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

build(rollup): add assets to the build #209

Draft
wants to merge 1 commit into
base: master
Choose a base branch
from
Draft

build(rollup): add assets to the build #209

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
42 changes: 0 additions & 42 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,48 +73,6 @@ https://github.com/webex/widgets.

### Styles

In order to properly style Webex Components, we need to import all the fonts, icons, images and core _CSS_ manually.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

While developers won't have to import from Momentum, would they still need to import our assets in their apps?

You will need to add [Momentum UI](https://momentum.design) styles in addition to the components' styles.
[Momentum UI](https://momentum.design) is Webex design system.

#### Momentum UI Styles

Momentum UI should be installed in your application as a peer dependency of the Webex Components. If you followed the command in the [install section](#install) it should already be your dependencies. There are two ways to include Momentum UI in your application:

##### CSS

1. Copy `@momentum-ui/core/fonts` directory to the fonts or assets directory of your app.
If you don't have a directory, create a public directory from which the fonts to be served
2. Copy `@momentum-ui/core/css/momentum-ui.min.css` to the styles or assets directory of your app
3. In the `<head>` of your HTML, reference the location of your `momentum-ui.min.css`

```HTML
<link rel="stylesheet" type="text/css" href="<path to>/momentum-ui.min.css">
```

##### Sass

1. Copy `@momentum-ui/icons/fonts` directory to the fonts or assets directory of your app
2. Add `$brand-font-folder`, `$icon-font-path`, and `$images-path` variables to your app's "variables.scss" file

```JS
$brand-font-folder: '<path to fonts directory>';
$icon-font-path: '<path to fonts directory>';
$images-path: '<path to images directory>';
```

3. Import `@momentum-ui/core/scss/momentum-ui-components.scss` into your main entry Sass file _after_ the variables

```CSS
...

@import '@momentum-ui/core/scss/momentum-ui-components';
```

4. Compile your Sass using your static compiler or bundler

For more on Momentum UI, you can visit [Momentum UI's repository](https://github.com/momentum-design/momentum-ui/tree/master/core)

#### Webex Components Styles

There are two ways to do this:
Expand Down
Loading