commit | 1994c98063c27a41797dec01f2ca9fcbe33ceab0 | [log] [tgz] |
---|---|---|
author | Israel Lavi <israel.lavi@intl.att.com> | Mon May 21 17:42:00 2018 +0300 |
committer | Israel Lavi <il0695@att.com> | Mon May 21 17:52:01 2018 +0300 |
tree | f30beeaf15a8358f6da78fdd74bcbda74bd334f8 | |
parent | 4749f4631426fcbe29ed98cef8f24cab18b501d0 [diff] |
init commit onap ui Change-Id: I1dace78817dbba752c550c182dfea118b4a38646 Issue-ID: SDC-1350 Signed-off-by: Israel Lavi <il0695@att.com>
This project aims to create a unified UI styled components for multiple development teams who work on the same web-based applications. This repository contains the definition of all the basic widgets and reusable controllers.
There are several options to link to sdc-ui CSS file:
@import "path_to_node_modules/sdc-ui/css/style.css";
<link rel="stylesheet" href="path_to_node_modules/sdc-ui/css/style.css">
import 'sdc-ui/css/style.css';
You can add this line to style.css file:
@import "../node_modules/sdc-ui/css/style.css";
import Button from 'sdc-ui/lib/react/Button.js'; // inside component rendering... render(){ return ( <Button>I am a Button</Button> ); }
import {Button} from 'sdc-ui/lib/react'; // inside component rendering... render(){ return ( <Button>I am a Button</Button> ); }
import SDCUI from 'sdc-ui'; // inside component rendering... render(){ return ( <SDCUI.React.Button>I am still a Button</SDCUI.React.Button> ); }
import { SdcUiComponentsModule, SdcUiComponents } from 'sdc-ui/lib/angular'; @NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, FormsModule, HttpModule, SdcUiComponentsModule ], providers: [ SdcUiComponents.ModalService ], bootstrap: [AppComponent] }) export class AppModule { }
The components in this library are displayed via storybook. Head to http://onap-sdc.github.io/sdc-ui to see the components that are in master
.
While developing, just run npm run storybook
in your terminal to launch a local storybook server where you can see your changes. For deploying storybook to your own fork repository, refer to the guides section below.
To see angular components in design run: npm run lab
Deploying storybook to a fork's github pages
For bugs and issues, please use the issues page
Contribution can be made only by following these guide lines
React
& Angular
framework libraries. Hence, every change in the basic HTML files structure, must be followed by changes on the frameworks files accordingly (under src/react
and src/angular
).Bootstrap
, Material
, Foundation
... etc.).