primer/css
1
1
Fork 0
mirror of https://github.com/primer/css.git synced 2024-12-01 12:42:32 +03:00
Code Issues Projects Releases Wiki Activity

Add more stories

Browse Source
This commit is contained in:
Sophie Shepherd 2017-11-03 15:51:15 -05:00
parent c46fe01129
commit 70790018fa
3 changed files with 16 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
modules/primer-marketing-utilities/stories.js
View File

@ -5,7 +5,7 @@ storiesOf('Marketing Utilities', module)
.add('Responsive borders', () => (
<div className='border-top border-sm-right border-md-bottom border-lg-top-0'>.border-top-0</div>
))
.add('Border colors', () => (
.add('border-white-fade', () => (
<div className='bg-blue text-white p-3'>
<span className='border border-white-fade p-2'>
.border-white-fade

2
modules/primer-utilities/docs/animations.md
View File

@ -68,7 +68,7 @@ The `.anim-pulse` class will pulse an element infinitely.
The `.hover-grow` class will increase the scale of the element upon hover.
```html
<div class="box hover-grow p-4">
<div class="Box hover-grow p-4">
<%= octicon("mark-github", :height => 32) %>
</div>
```

14
modules/primer-utilities/stories.js
View File

@ -0,0 +1,14 @@
import React from 'react'
import { storiesOf } from '@storybook/react'
storiesOf('Utilities', module)
.add('hover-grow', () => (
<div className='Box hover-grow p-4'>
.hover-grow
</div>
))
.add('circle', () => (
<div className='border circle p-3' style={{width: '100px', height: '100px'}}>
.circle
</div>
))