lukechilds
/
zap-desktop
mirror of https://github.com/lukechilds/zap-desktop.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
146 Commits
9 Branches
5 Tags
147 MiB
 
 
 
Tree: fc5aeab8e9
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'fc5aeab8e9'
${ noResults }
zap-desktop/static/iframe.1a9ea140a8b788f24b6e...

1 lines
9.6 KiB
Raw Blame History

{"version":3,"file":"static/iframe.1a9ea140a8b788f24b6e.bundle.js","sources":["webpack:///./.storybook/config.js","webpack:///./app/components/UI/GlobalStyle.js","webpack:///./app/components/UI/Header.js"],"sourcesContent":["import React from 'react'\nimport { addDecorator, configure, setAddon } from '@storybook/react'\nimport { withThemes } from 'storybook-styled-components'\nimport { withTheme } from 'styled-components'\nimport { themes } from '@storybook/components'\nimport { withOptions } from '@storybook/addon-options'\nimport { withInfo } from '@storybook/addon-info'\nimport chaptersAddon, { setDefaults } from 'react-storybook-addon-chapters'\nimport { withConsole } from '@storybook/addon-console'\nimport { withKnobs } from '@storybook/addon-knobs'\nimport { linkTo } from '@storybook/addon-links'\nimport { setIntlConfig, withIntl } from 'storybook-addon-intl'\nimport StoryRouter from 'storybook-react-router'\nimport { dark, light } from 'themes'\nimport { getDefaultLocale, locales } from 'lib/i18n'\nimport { BackgroundPrimary, GlobalStyle } from 'components/UI'\n\nconst BackgroundPrimaryWithTheme = withTheme(({ theme, ...rest }) => (\n <BackgroundPrimary\n className={theme.name}\n p={3}\n css={{ height: '100vh', 'overflow-y': 'scroll !important' }}\n {...rest}\n />\n))\n\n// Register supported locales.\nimport '../app/lib/i18n/locale'\n\n// Get translations.\nimport translations from '../app/lib/i18n/translation'\n\n// Set intl configuration\nsetIntlConfig({\n locales: locales,\n defaultLocale: getDefaultLocale(),\n getMessages: locale => translations[locale]\n})\n\n// Info\naddDecorator(\n withInfo({\n styles: {\n button: {\n base: {\n background: dark.colors.lightningOrange\n }\n }\n }\n })\n)\n\n// Intl\naddDecorator(withIntl)\n\n// Router\naddDecorator(StoryRouter({}))\n\n// Console.\naddDecorator((storyFn, context) => withConsole()(storyFn)(context))\n\n// Knobs\naddDecorator(withKnobs)\n\n// Options\naddDecorator(\n withOptions({\n name: 'Zap Desktop',\n url: 'https://ln-zap.github.io/zap-desktop',\n theme: themes.dark,\n hierarchySeparator: /\\./\n })\n)\n\n// Zap Global style.\naddDecorator(story => (\n <React.Fragment>\n <GlobalStyle />\n <BackgroundPrimaryWithTheme>{story()}</BackgroundPrimaryWithTheme>\n </React.Fragment>\n))\n\n// Zap Themes.\naddDecorator(withThemes({ Dark: dark, Light: light }))\n\n// Chapters\nsetAddon(chaptersAddon)\n\nsetDefaults({\n sectionOptions: {\n showSource: false,\n allowSourceToggling: false,\n showPropTables: false,\n allowPropTablesToggling: true\n }\n})\n\n// automatically import all files ending in *.stories.js\nconst req = require.context('../stories', true, /.stories.js$/)\nfunction loadStories() {\n req.keys().forEach(filename => req(filename))\n}\n\nconfigure(loadStories, module)\n","import { createGlobalStyle } from 'styled-components'\nimport reset from 'styled-reset'\n\n/* eslint-disable max-len */\nconst GlobalStyle = createGlobalStyle`\n /* stylelint-disable font-family-no-missing-generic-family-keyword */\n ${reset}\n\n @font-face {\n font-family: 'Roboto';\n font-style: normal;\n font-weight: 300;\n src: local('Roboto Light'), local('Roboto-Light'), url(https://fonts.gstatic.com/s/roboto/v18/KFOlCnqEu92Fr1MmSU5fBBc4AMP6lQ.woff2) format('woff2');\n unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;\n }\n @font-face {\n font-family: 'Roboto';\n font-style: normal;\n font-weight: 400;\n src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v18/KFOmCnqEu92Fr1Mu4mxKKTU1Kg.woff2) format('woff2');\n unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;\n }\n\n html {\n box-sizing: border-box;\n height: 100%;\n }\n\n *, *:before, *:after {\n box-sizing: inherit;\n }\n\n body {\n height: 100%;\n position: relative;\n overflow-y: hidden;\n -webkit-font-smoothing: antialiased;\n -webkit-tap-highlight-color: rgba(255, 255, 255, 0);\n font-family: 'Roboto', Arial, Helvetica, sans-serif;\n font-weight: 300;\n font-size: 13px;\n }\n\n pre {\n font-family: \"Lucida Console\", Monaco, monospace;\n }\n\n #root {\n height: 100%;\n }\n\n .element-show {\n display: inherit;\n }\n\n .element-hide {\n display: none;\n }\n\n /*\n *Tooltips\n */\n [data-hint] {\n position: relative;\n }\n\n [data-hint]::before,\n [data-hint]::after {\n position: absolute;\n will-change: transform;\n visibility: hidden;\n opacity: 0;\n z-index: 999;\n pointer-events: none;\n transition: 0.2s ease;\n transition-delay: 0ms;\n }\n\n [data-hint]::before {\n content: '';\n position: absolute;\n background: transparent;\n border: 6px solid transparent;\n z-index: 999;\n }\n\n [data-hint]::after {\n content: attr(data-hint);\n background: ${props => props.theme.colors.secondaryColor};\n color: ${props => props.theme.colors.primaryText};\n border: 1px solid ${props => props.theme.colors.gray};\n border-radius: 3px;\n max-width: 260px;\n line-height: 1.4;\n padding: 6px 10px;\n word-wrap: break-word;\n box-shadow: 0 3px 4px 0 rgba(30, 30, 30, 0.5), 0 2px 4px 0 rgba(0, 0, 0, 0.5);\n }\n\n [data-hint]:hover::before,\n [data-hint]:hover::after {\n visibility: visible;\n opacity: 1;\n }\n\n .hint--bottom::before,\n .hint--bottom-left::before {\n border-bottom-color: #404040;\n }\n\n .hint--top::before,\n .hint--top-left::before {\n border-top-color: #404040;\n }\n\n .hint--bottom::before {\n margin-top: -12px;\n }\n\n .hint--bottom::after {\n margin-left: -18px;\n }\n\n .hint--bottom::before,\n .hint--bottom::after {\n top: 100%;\n left: 50%;\n }\n\n .hint--bottom:hover::after,\n .hint--bottom:hover::before {\n transform: translateY(8px);\n }\n\n .hint--top::before {\n margin-bottom: -12px;\n }\n\n .hint--top::after {\n margin-left: -18px;\n }\n\n .hint--top::before,\n .hint--top::after {\n bottom: 100%;\n left: 50%;\n }\n\n .hint--top:hover::after,\n .hint--top:hover::before {\n transform: translateY(-8px);\n }\n\n .hint--top-left::before {\n margin-bottom: -12px;\n }\n\n .hint--top-left::after {\n margin-right: -6px;\n }\n\n .hint--top-left::before,\n .hint--top-left::after {\n bottom: 100%;\n right: 12px;\n }\n\n .hint--top-left:hover::after,\n .hint--top-left:hover::before {\n transform: translateY(-8px);\n }\n\n .hint--bottom-left::before {\n margin-top: -12px;\n }\n\n .hint--bottom-left::after {\n margin-right: -6px;\n }\n\n .hint--bottom-left::before,\n .hint--bottom-left::after {\n top: 100%;\n right: 12px;\n }\n\n .hint--bottom-left:hover::after,\n .hint--bottom-left:hover::before {\n transform: translateY(8px);\n }\n\n .hint--left::before {\n margin-right: -12px;\n margin-top: -6px;\n }\n\n .hint--left::after {\n margin-right: -14px;\n }\n\n .hint--left::before,\n .hint--left::after {\n right: 100%;\n bottom: 50%;\n }\n\n .hint--left:hover::after,\n .hint--left:hover::before {\n transform: translateX(-8px);\n }\n\n\n /*\n *Animated Checkmark\n */\n\n .checkmark__circle {\n stroke-dasharray: 166;\n stroke-dashoffset: 166;\n stroke-width: 2;\n stroke-miterlimit: 10;\n stroke: ${props => props.theme.colors.superGreen};\n fill: none;\n animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;\n }\n\n .checkmark {\n width: 20px;\n height: 20px;\n border-radius: 50%;\n stroke-width: 2;\n stroke: #fff;\n stroke-miterlimit: 10;\n box-shadow: inset 0 0 0 ${props => props.theme.colors.superGreen};\n animation: fill 0.4s ease-in-out 0.4s forwards, scale 0.3s ease-in-out 0.9s both;\n }\n\n .checkmark__check {\n transform-origin: 50% 50%;\n stroke-dasharray: 48;\n stroke-dashoffset: 48;\n animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;\n }\n\n @keyframes stroke {\n 100% {\n stroke-dashoffset: 0;\n }\n }\n\n @keyframes scale {\n 0%,\n 100% {\n transform: none;\n }\n\n 50% {\n transform: scale3d(1.1, 1.1, 1);\n }\n }\n\n @keyframes fill {\n 100% {\n box-shadow: inset 0 0 0 30px ${props => props.theme.colors.superGreen};\n }\n }\n\n /*\n *Generic spin animation.\n */\n\n @keyframes spin {\n 100% {\n transform: rotate(360deg);\n }\n }\n\n\n`\n\nexport default GlobalStyle\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport { Flex } from 'rebass'\nimport { Heading, Text } from 'components/UI'\n\nconst Header = ({ title, subtitle, logo }) => (\n <Flex alignItems=\"center\" as=\"header\" flexDirection=\"column\">\n {logo && (\n <Flex alignItems=\"center\" justifyContent=\"center\">\n <Text fontSize=\"50px\" lineHeight=\"1em\" css={{ height: '50px' }}>\n {logo}\n </Text>\n </Flex>\n )}\n {title && <Heading.h1>{title}</Heading.h1>}\n {subtitle && <Heading.h4>{subtitle}</Heading.h4>}\n </Flex>\n)\nHeader.propTypes = {\n title: PropTypes.node,\n subtitle: PropTypes.node,\n logo: PropTypes.node\n}\n\nexport default Header\n"],"mappings":"AAiBA;;ACXA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiFA;AACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmIA;;;;;;;;;;;;AAYA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BA;;;;;;;;;;;;;;;AClQA","sourceRoot":""}