Skip to content
This repository was archived by the owner on Feb 27, 2024. It is now read-only.

Commit 53c2571

Browse files
committed
Merge branch 'staging' into develop
2 parents 27f51a7 + f7db5b7 commit 53c2571

File tree

17 files changed

+173
-45
lines changed

17 files changed

+173
-45
lines changed

components/atoms/Logo/Logo.js

Lines changed: 18 additions & 15 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.
Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import {Meta, Story, Canvas} from '@storybook/addon-docs/blocks'
2+
3+
import Logo from '.'
4+
5+
<Meta title="Components/Atoms/Logo" component={Logo} />
6+
7+
# Logo
8+
9+
Use this component to display a button. Use it anywhere you would use an `<a>` or `<button>` element.
10+
11+
<Canvas>
12+
<Story name="Component">
13+
<div className="p-12" style={{backgroundColor: '#f9fbfd'}}>
14+
<Logo type="dark" className="m-auto" />
15+
</div>
16+
</Story>
17+
</Canvas>
18+
19+
## Type
20+
21+
The logo can be `light` or `dark`. Use the `type` prop to control this.
22+
23+
<Canvas>
24+
<Story name="Type">
25+
<div className="p-12" style={{backgroundColor: '#414141'}}>
26+
<Logo type="light" className="m-auto" />
27+
</div>
28+
</Story>
29+
</Canvas>

components/blocks/Gutenberg/BlockMediaText/BlockMediaText.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,6 @@ import Blocks from '@/components/molecules/Blocks'
22
import MediaText from '@/components/organisms/MediaText'
33
import PropTypes from 'prop-types'
44

5-
// TODO: Swap `img` in `MediaText` component with `Image` atom component.
6-
75
/**
86
* Code Block
97
*

components/blocks/LazyBlocks/LzbBlockHero/LzbBlockHero.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,14 @@ import Hero from '@/components/organisms/Hero'
22
import PropTypes from 'prop-types'
33

44
/**
5-
* Handle the Hero block.
5+
* Handle the LzbHero block.
66
*
77
* @author WebDevStudios
88
* @param {object} props The props.
99
* @param {object} props.attributes The attributes object.
1010
* @return {Element} The component.
1111
*/
12-
export default function BlockHero({attributes}) {
12+
export default function LzbBlockHero({attributes}) {
1313
attributes = {
1414
...attributes,
1515
backgroundImage: JSON.parse(decodeURIComponent(attributes.backgroundImage))
@@ -20,12 +20,12 @@ export default function BlockHero({attributes}) {
2020
{attributes ? (
2121
<Hero {...attributes} />
2222
) : (
23-
'There was a problem with attributes in BlockHero.js.'
23+
'There was a problem with attributes in LzbBlockHero.js.'
2424
)}
2525
</>
2626
)
2727
}
2828

29-
BlockHero.propTypes = {
29+
LzbBlockHero.propTypes = {
3030
attributes: PropTypes.object
3131
}

components/molecules/ButtonGroup/ButtonGroup.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,6 @@ import PropTypes from 'prop-types'
33
import React from 'react'
44
import styles from './ButtonGroup.module.css'
55

6-
// TODO: Create storybook for ButtonGroup component.
7-
86
/**
97
* Render the ButtonGroup component.
108
*
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import {Canvas, Meta, Story} from '@storybook/addon-docs/blocks'
2+
import ButtonGroup from './'
3+
import Button from '@/components/atoms/Button'
4+
5+
<Meta title="Components/Molecules/ButtonGroup" component={ButtonGroup} />
6+
7+
# ButtonGroup
8+
9+
Use this to show a group of buttons.
10+
11+
<Canvas>
12+
<Story name="Component">
13+
<ButtonGroup>
14+
<>
15+
<Button text="Button 1" />
16+
<Button text="Button 2" />
17+
<Button text="Button 3" />
18+
</>
19+
</ButtonGroup>
20+
</Story>
21+
</Canvas>

components/molecules/ImageGallery/ImageGallery.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,6 @@ import PropTypes from 'prop-types'
55
import React from 'react'
66
import styles from './ImageGallery.module.css'
77

8-
// TODO: Create Storybook for this component.
9-
108
/**
119
* Render the ImageGallery component.
1210
*

components/molecules/ImageGallery/ImageGallery.module.css

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,12 @@
11
.gallery {
22
@apply mb-8;
33

4+
& img {
5+
@apply w-full object-cover;
6+
7+
height: 200px;
8+
}
9+
410
& .wrap {
511
@apply grid grid-cols-4 gap-2;
612

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import {Canvas, Meta, Story} from '@storybook/addon-docs/blocks'
2+
import ImageGallery from './'
3+
import Button from '@/components/atoms/Button'
4+
5+
<Meta title="Components/Molecules/ImageGallery" component={ImageGallery} />
6+
7+
# Image Gallery
8+
9+
Use this to display an image gallery.
10+
11+
<Canvas>
12+
<Story name="Component">
13+
<ImageGallery
14+
images={[
15+
{
16+
url:
17+
'https://images.unsplash.com/photo-1610991149688-c1321006bcc1?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1000&q=60',
18+
alt: 'Rocky cliffs in the ocean.'
19+
},
20+
{
21+
url:
22+
'https://images.unsplash.com/photo-1612792515895-d63f3e98da60?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1000&q=60',
23+
alt: 'Building reflections.'
24+
},
25+
{
26+
url:
27+
'https://images.unsplash.com/photo-1612787873730-99bb61ae700e?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1000&q=60',
28+
alt: 'Building with an overcast sky background.'
29+
},
30+
{
31+
url:
32+
'https://images.unsplash.com/photo-1612738072307-3a48bbc7fd80?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1000&q=60',
33+
alt: 'Frost on a pane of glass.'
34+
}
35+
]}
36+
caption="This is a caption for the image gallery."
37+
/>
38+
</Story>
39+
</Canvas>

components/molecules/Navigation/Navigation.module.css

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
.navigation {
22
& > ul {
3-
@apply flex;
3+
@apply flex flex-wrap justify-center;
44

55
& > li {
6-
@apply relative ml-10;
6+
@apply relative mx-8 mb-2;
77

88
& a {
99
@apply block;
@@ -24,6 +24,12 @@
2424
@apply block;
2525
}
2626
}
27+
28+
@screen lg {
29+
&:last-child {
30+
@apply mr-0 mb-0;
31+
}
32+
}
2733
}
2834

2935
/* Nested ul / Drop Menu */

0 commit comments

Comments
 (0)