vcc-ui
Version:
VCC UI is a collection of React UI Components that can be used for developing front-end applications at Volvo Car Corporation.
54 lines • 1.47 kB
JavaScript
import React from "react";
import { storiesOf } from "@storybook/react";
import { loremIpsum } from "../../../stories/fixtures";
import { Nav } from "./";
import { Block } from "../block";
import { Logo } from "../logo";
storiesOf("Navigation/Nav", module).addWithJSX("Default", function () {
return React.createElement(Block, null, React.createElement(Nav, null, React.createElement(Block, {
extend: {
padding: "20px 0"
}
}, React.createElement(Logo, {
type: "square"
}))), React.createElement(Block, {
extend: {
marginTop: "20px",
fontSize: "48px",
width: "320px"
}
}, loremIpsum));
}).addWithJSX("Sticky", function () {
return React.createElement(Block, null, React.createElement(Nav, {
sticky: true
}, React.createElement(Block, {
extend: {
padding: "20px"
}
}, React.createElement(Logo, {
type: "square"
}))), React.createElement(Block, {
extend: {
marginTop: "100px",
fontSize: "48px",
width: "320px"
}
}, loremIpsum));
}).addWithJSX("Hide on scroll", function () {
return React.createElement(Block, null, React.createElement(Nav, {
sticky: true,
hideOnScroll: true
}, React.createElement(Block, {
extend: {
padding: "20px"
}
}, React.createElement(Logo, {
type: "square"
}))), React.createElement(Block, {
extend: {
marginTop: "100px",
fontSize: "48px",
width: "320px"
}
}, loremIpsum));
});