diff options
| author |   Einav Weiss Keidar <einavw@amdocs.com> | 2018-03-20 14:45:40 +0200 |
|---|---|---|
| committer |   Avi Gaffa <avi.gaffa@amdocs.com> | 2018-03-20 13:52:31 +0000 |
| commit | 7fdf733a64670fceefc3ded35cfa581e1c458179 (patch) | |
| tree | b3623ac9a331473830cb0167c0b487f2a176427c /openecomp-ui/src/sdc-app/onboarding/GridStyling.stories.js | |
| parent | c7916a4e5955ccc5f0f5252307363b791ec5c7b9 (diff) | |
Adding Prettier and fixing up eslint version
Issue-ID: SDC-1094
Change-Id: Ie83ad95a03899345dd90235daf0323cbe3bc6afd
Signed-off-by: Einav Weiss Keidar <einavw@amdocs.com>
Diffstat (limited to 'openecomp-ui/src/sdc-app/onboarding/GridStyling.stories.js')
| -rw-r--r-- | openecomp-ui/src/sdc-app/onboarding/GridStyling.stories.js | 342 |
1 files changed, 136 insertions, 206 deletions
diff --git a/openecomp-ui/src/sdc-app/onboarding/GridStyling.stories.js b/openecomp-ui/src/sdc-app/onboarding/GridStyling.stories.js index 81a29cf046..7b8c87e62c 100644 --- a/openecomp-ui/src/sdc-app/onboarding/GridStyling.stories.js +++ b/openecomp-ui/src/sdc-app/onboarding/GridStyling.stories.js @@ -1,221 +1,151 @@ import React from 'react'; -import {storiesOf} from '@kadira/storybook'; -import {withKnobs} from '@kadira/storybook-addon-knobs'; +import { storiesOf } from '@kadira/storybook'; +import { withKnobs } from '@kadira/storybook-addon-knobs'; import GridSection from 'nfvo-components/grid/GridSection.jsx'; import GridItem from 'nfvo-components/grid/GridItem.jsx'; - const stories = storiesOf('GridColumns', module); stories.addDecorator(withKnobs); var divStyle = { - 'border-style': 'solid', - 'border-size': 1 + 'border-style': 'solid', + 'border-size': 1 }; -const myDiv = (<div style={divStyle}>Text Text Text</div>); +const myDiv = <div style={divStyle}>Text Text Text</div>; stories - .add('Grid Options', () => ( - <div> - <GridSection title='No last column set on item'> - <GridItem colSpan={2}> - {myDiv} - </GridItem> - <GridItem colSpan={2}> - {myDiv} - </GridItem> - </GridSection> - - <GridSection hasLastColSet={true} title='With last column set on item and gridsection'> - <GridItem colSpan={2}> - {myDiv} - </GridItem> - <GridItem colSpan={2} lastColInRow={true}> - {myDiv} - </GridItem> - </GridSection> - - <GridSection title='With last column set on item and NOT on gridsection'> - <GridItem colSpan={2}> - {myDiv} - </GridItem> - <GridItem colSpan={2} lastColInRow={true}> - {myDiv} - </GridItem> - </GridSection> + .add('Grid Options', () => ( + <div> + <GridSection title="No last column set on item"> + <GridItem colSpan={2}>{myDiv}</GridItem> + <GridItem colSpan={2}>{myDiv}</GridItem> + </GridSection> - </div> - )) - .add('Last Column', () => ( + <GridSection + hasLastColSet={true} + title="With last column set on item and gridsection"> + <GridItem colSpan={2}>{myDiv}</GridItem> + <GridItem colSpan={2} lastColInRow={true}> + {myDiv} + </GridItem> + </GridSection> - <div> - <GridSection hasLastColSet={true} title='Testing different configurations with all settings'> - <GridItem colSpan={2}> - {myDiv} - </GridItem> - <GridItem colSpan={2} lastColInRow={true}> - {myDiv} - </GridItem> - </GridSection> - <GridSection hasLastColSet={true}> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={1} lastColInRow={true}> - {myDiv} - </GridItem> - </GridSection> - <GridSection hasLastColSet={true}> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={2} lastColInRow={true}> - {myDiv} - </GridItem> - </GridSection> - <GridSection hasLastColSet={true}> - <GridItem colSpan={2}> - {myDiv} - </GridItem> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={1} lastColInRow={true}> - {myDiv} - </GridItem> - </GridSection> - <GridSection hasLastColSet={true}> - <GridItem colSpan={4} lastColInRow={true}> - {myDiv} - </GridItem> - </GridSection> - <GridSection hasLastColSet={true}> - <GridItem colSpan={3}> - {myDiv} - </GridItem> - <GridItem colSpan={1} lastColInRow={true}> - {myDiv} - </GridItem> - </GridSection> - <GridSection hasLastColSet={true}> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={3} lastColInRow={true}> - {myDiv} - </GridItem> - </GridSection> - </div> - )) - .add('No Last Column', () => ( - <div> - <GridSection title='Testing different configurations'> - <GridItem colSpan={2}> - {myDiv} - </GridItem> - <GridItem colSpan={2}> - {myDiv} - </GridItem> - </GridSection> - <GridSection> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - </GridSection> - <GridSection> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={2}> - {myDiv} - </GridItem> - </GridSection> - <GridSection> - <GridItem colSpan={2}> - {myDiv} - </GridItem> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - </GridSection> - <GridSection> - <GridItem colSpan={4}> - {myDiv} - </GridItem> - </GridSection> - <GridSection> - <GridItem colSpan={3}> - {myDiv} - </GridItem> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - </GridSection> - <GridSection> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={3}> - {myDiv} - </GridItem> - </GridSection> - </div> - )) .add('Test LKG form', () => ( - <div> - <GridSection title='Testing VLM LKG configurations'> - <GridItem colSpan={2}> - {myDiv} - </GridItem> - <GridItem colSpan={2} lastColInRow={true}> - {myDiv} - </GridItem> - <GridItem colSpan={2}> - {myDiv} - </GridItem> - <GridItem colSpan={2} lastColInRow={true}> - {myDiv} - </GridItem> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={1}> - {myDiv} - </GridItem> - <GridItem colSpan={1} lastColInRow={true}> - {myDiv} - </GridItem> - <GridItem colSpan={2}> - <div style={divStyle}>1</div> - </GridItem> - </GridSection> - </div> -));
\ No newline at end of file + <GridSection title="With last column set on item and NOT on gridsection"> + <GridItem colSpan={2}>{myDiv}</GridItem> + <GridItem colSpan={2} lastColInRow={true}> + {myDiv} + </GridItem> + </GridSection> + </div> + )) + .add('Last Column', () => ( + <div> + <GridSection + hasLastColSet={true} + title="Testing different configurations with all settings"> + <GridItem colSpan={2}>{myDiv}</GridItem> + <GridItem colSpan={2} lastColInRow={true}> + {myDiv} + </GridItem> + </GridSection> + <GridSection hasLastColSet={true}> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={1} lastColInRow={true}> + {myDiv} + </GridItem> + </GridSection> + <GridSection hasLastColSet={true}> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={2} lastColInRow={true}> + {myDiv} + </GridItem> + </GridSection> + <GridSection hasLastColSet={true}> + <GridItem colSpan={2}>{myDiv}</GridItem> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={1} lastColInRow={true}> + {myDiv} + </GridItem> + </GridSection> + <GridSection hasLastColSet={true}> + <GridItem colSpan={4} lastColInRow={true}> + {myDiv} + </GridItem> + </GridSection> + <GridSection hasLastColSet={true}> + <GridItem colSpan={3}>{myDiv}</GridItem> + <GridItem colSpan={1} lastColInRow={true}> + {myDiv} + </GridItem> + </GridSection> + <GridSection hasLastColSet={true}> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={3} lastColInRow={true}> + {myDiv} + </GridItem> + </GridSection> + </div> + )) + .add('No Last Column', () => ( + <div> + <GridSection title="Testing different configurations"> + <GridItem colSpan={2}>{myDiv}</GridItem> + <GridItem colSpan={2}>{myDiv}</GridItem> + </GridSection> + <GridSection> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={1}>{myDiv}</GridItem> + </GridSection> + <GridSection> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={2}>{myDiv}</GridItem> + </GridSection> + <GridSection> + <GridItem colSpan={2}>{myDiv}</GridItem> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={1}>{myDiv}</GridItem> + </GridSection> + <GridSection> + <GridItem colSpan={4}>{myDiv}</GridItem> + </GridSection> + <GridSection> + <GridItem colSpan={3}>{myDiv}</GridItem> + <GridItem colSpan={1}>{myDiv}</GridItem> + </GridSection> + <GridSection> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={3}>{myDiv}</GridItem> + </GridSection> + </div> + )) + .add('Test LKG form', () => ( + <div> + <GridSection title="Testing VLM LKG configurations"> + <GridItem colSpan={2}>{myDiv}</GridItem> + <GridItem colSpan={2} lastColInRow={true}> + {myDiv} + </GridItem> + <GridItem colSpan={2}>{myDiv}</GridItem> + <GridItem colSpan={2} lastColInRow={true}> + {myDiv} + </GridItem> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={1}>{myDiv}</GridItem> + <GridItem colSpan={1} lastColInRow={true}> + {myDiv} + </GridItem> + <GridItem colSpan={2}> + <div style={divStyle}>1</div> + </GridItem> + </GridSection> + </div> + )); |