From 424eaa9e8098cef762b1a2a7565d37944bb25306 Mon Sep 17 00:00:00 2001 From: Patryk Niedźwiedziński Date: Mon, 21 Oct 2019 18:25:12 +0200 Subject: Add storybook --- .babelrc | 3 +- .storybook/addons.js | 2 + .storybook/config.js | 10 + assets/css/main.css | 15 + components/ChroniclePost.vue | 60 - components/PostLink.stories.js | 27 + components/PostLink.vue | 65 + components/PurePostList.stories.js | 16 + components/PurePostList.vue | 38 + layouts/default.vue | 16 - nuxt.config.js | 2 +- package-lock.json | 9915 ++++++++++++++------ package.json | 14 +- pages/kronika/index.vue | 8 - tests/components/FacebookFeed.test.js | 11 - tests/components/FacebookFindUsButton.test.js | 11 - tests/components/Footer.test.js | 20 - tests/components/JoinUs.test.js | 11 - tests/components/NavBar.test.js | 27 - tests/components/NavLink.test.js | 23 - .../__snapshots__/FacebookFeed.test.js.snap | 13 - .../FacebookFindUsButton.test.js.snap | 19 - tests/components/__snapshots__/Footer.test.js.snap | 66 - tests/components/__snapshots__/JoinUs.test.js.snap | 31 - tests/components/__snapshots__/NavBar.test.js.snap | 40 - .../components/__snapshots__/NavLink.test.js.snap | 14 - tests/pages/404.test.js | 11 - tests/pages/__snapshots__/404.test.js.snap | 13 - tests/pages/__snapshots__/download.test.js.snap | 25 - tests/pages/__snapshots__/index.test.js.snap | 9 - tests/pages/__snapshots__/kontakt.test.js.snap | 31 - tests/pages/__snapshots__/o-nas.test.js.snap | 7 - tests/pages/download.test.js | 11 - tests/pages/index.test.js | 11 - tests/pages/kontakt.test.js | 11 - tests/pages/o-nas.test.js | 11 - tests/unit/__snapshots__/storybook.test.js.snap | 27 + tests/unit/storybook.test.js | 5 + 38 files changed, 7477 insertions(+), 3172 deletions(-) create mode 100644 .storybook/addons.js create mode 100644 .storybook/config.js create mode 100644 assets/css/main.css delete mode 100644 components/ChroniclePost.vue create mode 100644 components/PostLink.stories.js create mode 100644 components/PostLink.vue create mode 100644 components/PurePostList.stories.js create mode 100644 components/PurePostList.vue delete mode 100644 tests/components/FacebookFeed.test.js delete mode 100644 tests/components/FacebookFindUsButton.test.js delete mode 100644 tests/components/Footer.test.js delete mode 100644 tests/components/JoinUs.test.js delete mode 100644 tests/components/NavBar.test.js delete mode 100644 tests/components/NavLink.test.js delete mode 100644 tests/components/__snapshots__/FacebookFeed.test.js.snap delete mode 100644 tests/components/__snapshots__/FacebookFindUsButton.test.js.snap delete mode 100644 tests/components/__snapshots__/Footer.test.js.snap delete mode 100644 tests/components/__snapshots__/JoinUs.test.js.snap delete mode 100644 tests/components/__snapshots__/NavBar.test.js.snap delete mode 100644 tests/components/__snapshots__/NavLink.test.js.snap delete mode 100644 tests/pages/404.test.js delete mode 100644 tests/pages/__snapshots__/404.test.js.snap delete mode 100644 tests/pages/__snapshots__/download.test.js.snap delete mode 100644 tests/pages/__snapshots__/index.test.js.snap delete mode 100644 tests/pages/__snapshots__/kontakt.test.js.snap delete mode 100644 tests/pages/__snapshots__/o-nas.test.js.snap delete mode 100644 tests/pages/download.test.js delete mode 100644 tests/pages/index.test.js delete mode 100644 tests/pages/kontakt.test.js delete mode 100644 tests/pages/o-nas.test.js create mode 100644 tests/unit/__snapshots__/storybook.test.js.snap create mode 100644 tests/unit/storybook.test.js diff --git a/.babelrc b/.babelrc index 84c2e57..036ef6b 100644 --- a/.babelrc +++ b/.babelrc @@ -10,7 +10,8 @@ } } ] - ] + ], + "plugins": ["babel-plugin-require-context-hook"] } } } diff --git a/.storybook/addons.js b/.storybook/addons.js new file mode 100644 index 0000000..6aed412 --- /dev/null +++ b/.storybook/addons.js @@ -0,0 +1,2 @@ +import '@storybook/addon-actions/register'; +import '@storybook/addon-links/register'; diff --git a/.storybook/config.js b/.storybook/config.js new file mode 100644 index 0000000..7126515 --- /dev/null +++ b/.storybook/config.js @@ -0,0 +1,10 @@ +import { configure } from '@storybook/vue' + +import '../assets/css/main.css' + +const req = require.context('../components', true, /\.stories.js$/) +function loadStories() { + req.keys().forEach(filename => req(filename)) +} + +configure(loadStories, module) diff --git a/assets/css/main.css b/assets/css/main.css new file mode 100644 index 0000000..21bcffb --- /dev/null +++ b/assets/css/main.css @@ -0,0 +1,15 @@ +@import url('https://fonts.googleapis.com/css?family=Roboto+Slab&display=swap'); + +html, +body { + padding: 0; + margin: 0; +} + +* { + box-sizing: border-box; + font-family: 'Roboto Slab', serif; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + color: #181818; +} diff --git a/components/ChroniclePost.vue b/components/ChroniclePost.vue deleted file mode 100644 index 7b2c527..0000000 --- a/components/ChroniclePost.vue +++ /dev/null @@ -1,60 +0,0 @@ - - - - - \ No newline at end of file diff --git a/components/PostLink.stories.js b/components/PostLink.stories.js new file mode 100644 index 0000000..71d04ed --- /dev/null +++ b/components/PostLink.stories.js @@ -0,0 +1,27 @@ +import { storiesOf } from '@storybook/vue' + +import PostLink from './PostLink' + +export const postLink = { + title: 'Test PostLink', + description: + 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pulvinar non ex non sagittis. Quisque in enim tellus. Aliquam consequat mi id sapien congue, sit amet vulputate tortor viverra. Donec.', + route: '/kronika/2019/20/11/test' +} + +const center = () => { + return { + template: + '
' + } +} + +storiesOf('PostLink', module) + .addDecorator(center) + .add('default', () => { + return { + components: { PostLink }, + template: ``, + data: () => postLink + } + }) diff --git a/components/PostLink.vue b/components/PostLink.vue new file mode 100644 index 0000000..b0aeb5a --- /dev/null +++ b/components/PostLink.vue @@ -0,0 +1,65 @@ + + + + + \ No newline at end of file diff --git a/components/PurePostList.stories.js b/components/PurePostList.stories.js new file mode 100644 index 0000000..134cd68 --- /dev/null +++ b/components/PurePostList.stories.js @@ -0,0 +1,16 @@ +import { storiesOf } from '@storybook/vue' + +import { postLink } from './PostLink.stories' + +import PurePostList from './PurePostList' + +export const posts = Array(5).fill(postLink) +console.log(posts) + +storiesOf('PurePostList', module).add('default', () => { + return { + components: { PurePostList }, + template: ``, + data: () => ({ posts }) + } +}) diff --git a/components/PurePostList.vue b/components/PurePostList.vue new file mode 100644 index 0000000..a93360d --- /dev/null +++ b/components/PurePostList.vue @@ -0,0 +1,38 @@ + + + + + \ No newline at end of file diff --git a/layouts/default.vue b/layouts/default.vue index 0e5ca9c..ff95023 100644 --- a/layouts/default.vue +++ b/layouts/default.vue @@ -27,23 +27,7 @@ export default { \ No newline at end of file diff --git a/tests/components/FacebookFeed.test.js b/tests/components/FacebookFeed.test.js deleted file mode 100644 index 7abedf6..0000000 --- a/tests/components/FacebookFeed.test.js +++ /dev/null @@ -1,11 +0,0 @@ -import { shallowMount } from '@vue/test-utils' -import FacebookFeed from '../../components/FacebookFeed' - -describe('FacebookFeed', () => { - // Now mount the component and you have the wrapper - const wrapper = shallowMount(FacebookFeed) - - it('match snapshot', () => { - expect(wrapper.element).toMatchSnapshot() - }) -}) diff --git a/tests/components/FacebookFindUsButton.test.js b/tests/components/FacebookFindUsButton.test.js deleted file mode 100644 index d74e16f..0000000 --- a/tests/components/FacebookFindUsButton.test.js +++ /dev/null @@ -1,11 +0,0 @@ -import { shallowMount } from '@vue/test-utils' -import FacebookFindUsButton from '../../components/FacebookFindUsButton' - -describe('FacebookFindUsButton', () => { - // Now mount the component and you have the wrapper - const wrapper = shallowMount(FacebookFindUsButton) - - it('match snapshot', () => { - expect(wrapper.element).toMatchSnapshot() - }) -}) diff --git a/tests/components/Footer.test.js b/tests/components/Footer.test.js deleted file mode 100644 index e284b5a..0000000 --- a/tests/components/Footer.test.js +++ /dev/null @@ -1,20 +0,0 @@ -import { shallowMount } from '@vue/test-utils' -import Footer from '../../components/Footer' - -describe('Footer', () => { - // Now mount the component and you have the wrapper - const wrapper = shallowMount(Footer) - - wrapper.setProps({ - routes: [ - { - path: '/', - name: 'Home' - } - ] - }) - - it('match snapshot', () => { - expect(wrapper.element).toMatchSnapshot() - }) -}) diff --git a/tests/components/JoinUs.test.js b/tests/components/JoinUs.test.js deleted file mode 100644 index c831459..0000000 --- a/tests/components/JoinUs.test.js +++ /dev/null @@ -1,11 +0,0 @@ -import { shallowMount } from '@vue/test-utils' -import JoinUs from '../../components/JoinUs' - -describe('JoinUs', () => { - // Now mount the component and you have the wrapper - const wrapper = shallowMount(JoinUs) - - it('match snapshot', () => { - expect(wrapper.element).toMatchSnapshot() - }) -}) diff --git a/tests/components/NavBar.test.js b/tests/components/NavBar.test.js deleted file mode 100644 index be61915..0000000 --- a/tests/components/NavBar.test.js +++ /dev/null @@ -1,27 +0,0 @@ -import { shallowMount } from '@vue/test-utils' -import NavBar from '../../components/NavBar' - -describe('NavBar', () => { - // Now mount the component and you have the wrapper - const wrapper = shallowMount(NavBar) - - wrapper.setProps({ - title: 'Title', - routes: [ - { - path: '/', - name: 'Home' - } - ] - }) - - it('check title', () => { - expect(wrapper.html()).toContain( - 'Title' - ) - }) - - it('match snapshot', () => { - expect(wrapper.element).toMatchSnapshot() - }) -}) diff --git a/tests/components/NavLink.test.js b/tests/components/NavLink.test.js deleted file mode 100644 index d35e6db..0000000 --- a/tests/components/NavLink.test.js +++ /dev/null @@ -1,23 +0,0 @@ -import { shallowMount } from '@vue/test-utils' -import NavLink from '../../components/NavLink' - -describe('NavLink', () => { - // Now mount the component and you have the wrapper - const wrapper = shallowMount(NavLink) - - wrapper.setProps({ link: '/link', name: 'Link' }) - - it('renders the correct markup', () => { - expect(wrapper.html()).toContain( - `
  • Link
    • ` - ) - }) - - it('check text', () => { - expect(wrapper.text()).toBe('Link') - }) - - it('match snapshot', () => { - expect(wrapper.element).toMatchSnapshot() - }) -}) diff --git a/tests/components/__snapshots__/FacebookFeed.test.js.snap b/tests/components/__snapshots__/FacebookFeed.test.js.snap deleted file mode 100644 index 6819e12..0000000 --- a/tests/components/__snapshots__/FacebookFeed.test.js.snap +++ /dev/null @@ -1,13 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`FacebookFeed match snapshot 1`] = ` -
    -

    - Zobacz co się dzieje! -

    - - -
    -`; diff --git a/tests/components/__snapshots__/FacebookFindUsButton.test.js.snap b/tests/components/__snapshots__/FacebookFindUsButton.test.js.snap deleted file mode 100644 index 98783c4..0000000 --- a/tests/components/__snapshots__/FacebookFindUsButton.test.js.snap +++ /dev/null @@ -1,19 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`FacebookFindUsButton match snapshot 1`] = ` - -
    - Find us on Facebook -
    -     -`; diff --git a/tests/components/__snapshots__/Footer.test.js.snap b/tests/components/__snapshots__/Footer.test.js.snap deleted file mode 100644 index 577f85e..0000000 --- a/tests/components/__snapshots__/Footer.test.js.snap +++ /dev/null @@ -1,66 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`Footer match snapshot 1`] = ` -
    -
    -
    - - Home - -
    - -
    -
    - -
    - -
    -

    - 19 Poznańska Drużyna Harcerzy Puszcza -

    - - -
    -
    -`; diff --git a/tests/components/__snapshots__/JoinUs.test.js.snap b/tests/components/__snapshots__/JoinUs.test.js.snap deleted file mode 100644 index 832268c..0000000 --- a/tests/components/__snapshots__/JoinUs.test.js.snap +++ /dev/null @@ -1,31 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`JoinUs match snapshot 1`] = ` -
    -
    -
    -
    - Rozpocznij swoją harcerską przygodę! -
    -
    - -
    - - Dołącz do nas! - -
    -
    -
    -`; diff --git a/tests/components/__snapshots__/NavBar.test.js.snap b/tests/components/__snapshots__/NavBar.test.js.snap deleted file mode 100644 index 89ef8e5..0000000 --- a/tests/components/__snapshots__/NavBar.test.js.snap +++ /dev/null @@ -1,40 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`NavBar match snapshot 1`] = ` - -`; diff --git a/tests/components/__snapshots__/NavLink.test.js.snap b/tests/components/__snapshots__/NavLink.test.js.snap deleted file mode 100644 index 122e5c8..0000000 --- a/tests/components/__snapshots__/NavLink.test.js.snap +++ /dev/null @@ -1,14 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`NavLink match snapshot 1`] = ` -
  • - - Link - -
    • -`; diff --git a/tests/pages/404.test.js b/tests/pages/404.test.js deleted file mode 100644 index 76322da..0000000 --- a/tests/pages/404.test.js +++ /dev/null @@ -1,11 +0,0 @@ -import { shallowMount } from '@vue/test-utils' -import page404 from '../../pages/404' - -describe('404', () => { - // Now mount the component and you have the wrapper - const wrapper = shallowMount(page404) - - it('match snapshot', () => { - expect(wrapper.element).toMatchSnapshot() - }) -}) diff --git a/tests/pages/__snapshots__/404.test.js.snap b/tests/pages/__snapshots__/404.test.js.snap deleted file mode 100644 index 44419f9..0000000 --- a/tests/pages/__snapshots__/404.test.js.snap +++ /dev/null @@ -1,13 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`404 match snapshot 1`] = ` -
    -

    - 404 -

    - -

    - Nie znaleziono strony -

    -
    -`; diff --git a/tests/pages/__snapshots__/download.test.js.snap b/tests/pages/__snapshots__/download.test.js.snap deleted file mode 100644 index 05d1361..0000000 --- a/tests/pages/__snapshots__/download.test.js.snap +++ /dev/null @@ -1,25 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`download match snapshot 1`] = ` -
    -

    - Do pobrania -

    - - - Karta próby na sprawność - - - - Próba Harcerza - -
    -`; diff --git a/tests/pages/__snapshots__/index.test.js.snap b/tests/pages/__snapshots__/index.test.js.snap deleted file mode 100644 index af3d906..0000000 --- a/tests/pages/__snapshots__/index.test.js.snap +++ /dev/null @@ -1,9 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`index match snapshot 1`] = ` -
    - - - -
    -`; diff --git a/tests/pages/__snapshots__/kontakt.test.js.snap b/tests/pages/__snapshots__/kontakt.test.js.snap deleted file mode 100644 index 22be789..0000000 --- a/tests/pages/__snapshots__/kontakt.test.js.snap +++ /dev/null @@ -1,31 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`kontakt match snapshot 1`] = ` -
    -

    - Kontakt z drużynowym -

    - -

    - - tel: - - - +48695516492 - -

    - -

    - - email: - - - patryk.niedzwiedzinski@zhr.pl - -

    -
    -`; diff --git a/tests/pages/__snapshots__/o-nas.test.js.snap b/tests/pages/__snapshots__/o-nas.test.js.snap deleted file mode 100644 index fbdc54c..0000000 --- a/tests/pages/__snapshots__/o-nas.test.js.snap +++ /dev/null @@ -1,7 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`Onas match snapshot 1`] = ` -

    - O nas -

    -`; diff --git a/tests/pages/download.test.js b/tests/pages/download.test.js deleted file mode 100644 index 78f16d9..0000000 --- a/tests/pages/download.test.js +++ /dev/null @@ -1,11 +0,0 @@ -import { shallowMount } from '@vue/test-utils' -import download from '../../pages/download' - -describe('download', () => { - // Now mount the component and you have the wrapper - const wrapper = shallowMount(download) - - it('match snapshot', () => { - expect(wrapper.element).toMatchSnapshot() - }) -}) diff --git a/tests/pages/index.test.js b/tests/pages/index.test.js deleted file mode 100644 index 1e262b3..0000000 --- a/tests/pages/index.test.js +++ /dev/null @@ -1,11 +0,0 @@ -import { shallowMount } from '@vue/test-utils' -import index from '../../pages/index' - -describe('index', () => { - // Now mount the component and you have the wrapper - const wrapper = shallowMount(index) - - it('match snapshot', () => { - expect(wrapper.element).toMatchSnapshot() - }) -}) diff --git a/tests/pages/kontakt.test.js b/tests/pages/kontakt.test.js deleted file mode 100644 index d99e120..0000000 --- a/tests/pages/kontakt.test.js +++ /dev/null @@ -1,11 +0,0 @@ -import { shallowMount } from '@vue/test-utils' -import kontakt from '../../pages/kontakt' - -describe('kontakt', () => { - // Now mount the component and you have the wrapper - const wrapper = shallowMount(kontakt) - - it('match snapshot', () => { - expect(wrapper.element).toMatchSnapshot() - }) -}) diff --git a/tests/pages/o-nas.test.js b/tests/pages/o-nas.test.js deleted file mode 100644 index 8b87253..0000000 --- a/tests/pages/o-nas.test.js +++ /dev/null @@ -1,11 +0,0 @@ -import { shallowMount } from '@vue/test-utils' -import Onas from '../../pages/o-nas' - -describe('Onas', () => { - // Now mount the component and you have the wrapper - const wrapper = shallowMount(Onas) - - it('match snapshot', () => { - expect(wrapper.element).toMatchSnapshot() - }) -}) diff --git a/tests/unit/__snapshots__/storybook.test.js.snap b/tests/unit/__snapshots__/storybook.test.js.snap new file mode 100644 index 0000000..606044b --- /dev/null +++ b/tests/unit/__snapshots__/storybook.test.js.snap @@ -0,0 +1,27 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Storyshots ChroniclePost default 1`] = ` +
    + +
    +

    + Test ChroniclePost +

    + +

    + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pulvinar non ex non sagittis. Quisque in enim tellus. Aliquam consequat mi id sapien congue, sit amet vulputate tortor viverra. Donec.... +

    +
    +     +
    +`; diff --git a/tests/unit/storybook.test.js b/tests/unit/storybook.test.js new file mode 100644 index 0000000..ed81be4 --- /dev/null +++ b/tests/unit/storybook.test.js @@ -0,0 +1,5 @@ +import registerRequireContextHook from 'babel-plugin-require-context-hook/register' +import initStoryshots from '@storybook/addon-storyshots' + +registerRequireContextHook() +initStoryshots() -- cgit 1.4.1 From 17fc6a6b4507e5535d8b6989b66da5bac323e87b Mon Sep 17 00:00:00 2001 From: Patryk Niedźwiedziński Date: Mon, 21 Oct 2019 19:53:02 +0200 Subject: Add PostList --- .gitignore | 1 + .storybook/decorators/index.js | 6 +++ assets/css/main.css | 3 ++ components/PostLink.stories.js | 8 +-- components/PostLink.vue | 1 + components/PostList/PostList.vue | 49 +++++++++++++++++++ components/PostList/PurePostList.stories.js | 31 ++++++++++++ components/PostList/PurePostList.vue | 76 +++++++++++++++++++++++++++++ components/PostList/index.js | 3 ++ components/PurePostList.stories.js | 16 ------ components/PurePostList.vue | 38 --------------- pages/index.vue | 19 +++++--- pages/kronika/index.vue | 33 ++----------- 13 files changed, 186 insertions(+), 98 deletions(-) create mode 100644 .storybook/decorators/index.js create mode 100644 components/PostList/PostList.vue create mode 100644 components/PostList/PurePostList.stories.js create mode 100644 components/PostList/PurePostList.vue create mode 100644 components/PostList/index.js delete mode 100644 components/PurePostList.stories.js delete mode 100644 components/PurePostList.vue diff --git a/.gitignore b/.gitignore index 53c3292..6937f9e 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,5 @@ content +static/api # Created by .ignore support plugin (hsz.mobi) ### Node template diff --git a/.storybook/decorators/index.js b/.storybook/decorators/index.js new file mode 100644 index 0000000..acea431 --- /dev/null +++ b/.storybook/decorators/index.js @@ -0,0 +1,6 @@ +export const center = () => { + return { + template: + '
    ' + } +} diff --git a/assets/css/main.css b/assets/css/main.css index 21bcffb..7da562e 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -8,6 +8,9 @@ body { * { box-sizing: border-box; +} + +body { font-family: 'Roboto Slab', serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; diff --git a/components/PostLink.stories.js b/components/PostLink.stories.js index 71d04ed..a824b35 100644 --- a/components/PostLink.stories.js +++ b/components/PostLink.stories.js @@ -1,4 +1,5 @@ import { storiesOf } from '@storybook/vue' +import { center } from '../.storybook/decorators' import PostLink from './PostLink' @@ -9,13 +10,6 @@ export const postLink = { route: '/kronika/2019/20/11/test' } -const center = () => { - return { - template: - '
    ' - } -} - storiesOf('PostLink', module) .addDecorator(center) .add('default', () => { diff --git a/components/PostLink.vue b/components/PostLink.vue index b0aeb5a..5bc5127 100644 --- a/components/PostLink.vue +++ b/components/PostLink.vue @@ -40,6 +40,7 @@ export default { margin: 20px; flex-basis: 410px; max-width: 410px; + height: 250px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25); background: #ffffff; text-align: left; diff --git a/components/PostList/PostList.vue b/components/PostList/PostList.vue new file mode 100644 index 0000000..206a73f --- /dev/null +++ b/components/PostList/PostList.vue @@ -0,0 +1,49 @@ + + + \ No newline at end of file diff --git a/components/PostList/PurePostList.stories.js b/components/PostList/PurePostList.stories.js new file mode 100644 index 0000000..cf812f7 --- /dev/null +++ b/components/PostList/PurePostList.stories.js @@ -0,0 +1,31 @@ +import { storiesOf } from '@storybook/vue' +import { center } from '../../.storybook/decorators' + +import { postLink } from '../PostLink.stories' + +import PurePostList from './PurePostList' + +export const posts = Array(5).fill(postLink) +console.log(posts) + +storiesOf('PurePostList', module) + .addDecorator(center) + .add('default', () => { + return { + components: { PurePostList }, + template: ``, + data: () => ({ posts }) + } + }) + .add('loading', () => { + return { + components: { PurePostList }, + template: `` + } + }) + .add('no posts', () => { + return { + components: { PurePostList }, + template: `` + } + }) diff --git a/components/PostList/PurePostList.vue b/components/PostList/PurePostList.vue new file mode 100644 index 0000000..7e70db8 --- /dev/null +++ b/components/PostList/PurePostList.vue @@ -0,0 +1,76 @@ + + + + + \ No newline at end of file diff --git a/components/PostList/index.js b/components/PostList/index.js new file mode 100644 index 0000000..dbb515e --- /dev/null +++ b/components/PostList/index.js @@ -0,0 +1,3 @@ +import PostList from './PostList' + +export default PostList diff --git a/components/PurePostList.stories.js b/components/PurePostList.stories.js deleted file mode 100644 index 134cd68..0000000 --- a/components/PurePostList.stories.js +++ /dev/null @@ -1,16 +0,0 @@ -import { storiesOf } from '@storybook/vue' - -import { postLink } from './PostLink.stories' - -import PurePostList from './PurePostList' - -export const posts = Array(5).fill(postLink) -console.log(posts) - -storiesOf('PurePostList', module).add('default', () => { - return { - components: { PurePostList }, - template: ``, - data: () => ({ posts }) - } -}) diff --git a/components/PurePostList.vue b/components/PurePostList.vue deleted file mode 100644 index a93360d..0000000 --- a/components/PurePostList.vue +++ /dev/null @@ -1,38 +0,0 @@ - - - - - \ No newline at end of file diff --git a/pages/index.vue b/pages/index.vue index 736e7f4..8b093df 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -1,16 +1,21 @@ \ No newline at end of file diff --git a/pages/kronika/index.vue b/pages/kronika/index.vue index cff3551..d9685c1 100644 --- a/pages/kronika/index.vue +++ b/pages/kronika/index.vue @@ -1,43 +1,16 @@ -- cgit 1.4.1 From 82cd395bf7deb8f1df95be5a0bb3f59d0b1108e1 Mon Sep 17 00:00:00 2001 From: Patryk Niedźwiedziński Date: Mon, 21 Oct 2019 20:06:48 +0200 Subject: Add Facebook components --- .storybook/decorators/index.js | 2 +- components/Facebook/FacebookFeed.stories.js | 13 ++++++++ components/Facebook/FacebookFeed.vue | 29 ++++++++++++++++++ .../Facebook/FacebookFindUsButton.stories.js | 13 ++++++++ components/Facebook/FacebookFindUsButton.vue | 35 ++++++++++++++++++++++ components/FacebookFeed.vue | 25 ---------------- components/FacebookFindUsButton.vue | 35 ---------------------- components/PostList/PurePostList.stories.js | 3 -- package.json | 2 +- pages/index.vue | 2 +- 10 files changed, 93 insertions(+), 66 deletions(-) create mode 100644 components/Facebook/FacebookFeed.stories.js create mode 100644 components/Facebook/FacebookFeed.vue create mode 100644 components/Facebook/FacebookFindUsButton.stories.js create mode 100644 components/Facebook/FacebookFindUsButton.vue delete mode 100644 components/FacebookFeed.vue delete mode 100644 components/FacebookFindUsButton.vue diff --git a/.storybook/decorators/index.js b/.storybook/decorators/index.js index acea431..518f966 100644 --- a/.storybook/decorators/index.js +++ b/.storybook/decorators/index.js @@ -1,6 +1,6 @@ export const center = () => { return { template: - '
    ' + '
    ' } } diff --git a/components/Facebook/FacebookFeed.stories.js b/components/Facebook/FacebookFeed.stories.js new file mode 100644 index 0000000..4eced7f --- /dev/null +++ b/components/Facebook/FacebookFeed.stories.js @@ -0,0 +1,13 @@ +import { storiesOf } from '@storybook/vue' +import { center } from '../../.storybook/decorators' + +import FacebookFeed from './FacebookFeed' + +storiesOf('FacebookFeed', module) + .addDecorator(center) + .add('default', () => { + return { + components: { FacebookFeed }, + template: `` + } + }) diff --git a/components/Facebook/FacebookFeed.vue b/components/Facebook/FacebookFeed.vue new file mode 100644 index 0000000..56172f4 --- /dev/null +++ b/components/Facebook/FacebookFeed.vue @@ -0,0 +1,29 @@ + + + + + \ No newline at end of file diff --git a/components/Facebook/FacebookFindUsButton.stories.js b/components/Facebook/FacebookFindUsButton.stories.js new file mode 100644 index 0000000..e76f8f9 --- /dev/null +++ b/components/Facebook/FacebookFindUsButton.stories.js @@ -0,0 +1,13 @@ +import { storiesOf } from '@storybook/vue' +import { center } from '../../.storybook/decorators' + +import FacebookFindUsButton from './FacebookFindUsButton' + +storiesOf('FacebookFindUsButton', module) + .addDecorator(center) + .add('default', () => { + return { + components: { FacebookFindUsButton }, + template: `` + } + }) diff --git a/components/Facebook/FacebookFindUsButton.vue b/components/Facebook/FacebookFindUsButton.vue new file mode 100644 index 0000000..9a27c11 --- /dev/null +++ b/components/Facebook/FacebookFindUsButton.vue @@ -0,0 +1,35 @@ + + + \ No newline at end of file diff --git a/components/FacebookFeed.vue b/components/FacebookFeed.vue deleted file mode 100644 index 9d2d251..0000000 --- a/components/FacebookFeed.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - - - \ No newline at end of file diff --git a/components/FacebookFindUsButton.vue b/components/FacebookFindUsButton.vue deleted file mode 100644 index 9a27c11..0000000 --- a/components/FacebookFindUsButton.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - \ No newline at end of file diff --git a/components/PostList/PurePostList.stories.js b/components/PostList/PurePostList.stories.js index cf812f7..00516f8 100644 --- a/components/PostList/PurePostList.stories.js +++ b/components/PostList/PurePostList.stories.js @@ -1,15 +1,12 @@ import { storiesOf } from '@storybook/vue' -import { center } from '../../.storybook/decorators' import { postLink } from '../PostLink.stories' import PurePostList from './PurePostList' export const posts = Array(5).fill(postLink) -console.log(posts) storiesOf('PurePostList', module) - .addDecorator(center) .add('default', () => { return { components: { PurePostList }, diff --git a/package.json b/package.json index 4c6ff52..63620e0 100644 --- a/package.json +++ b/package.json @@ -11,7 +11,7 @@ "postbuild": "./scripts/postbuild.sh", "start": "nuxt start", "test": "jest", - "storybook": "start-storybook -p 6006", + "storybook": "start-storybook -p 6006 -s static", "build-storybook": "build-storybook" }, "dependencies": { diff --git a/pages/index.vue b/pages/index.vue index 8b093df..12caa0c 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -11,7 +11,7 @@ - - \ No newline at end of file diff --git a/components/PostList/PurePostList.stories.js b/components/PostList/PurePostList.stories.js index 00516f8..3cb07f8 100644 --- a/components/PostList/PurePostList.stories.js +++ b/components/PostList/PurePostList.stories.js @@ -17,12 +17,14 @@ storiesOf('PurePostList', module) .add('loading', () => { return { components: { PurePostList }, - template: `` + template: ``, + data: () => ({ posts: [] }) } }) .add('no posts', () => { return { components: { PurePostList }, - template: `` + template: ``, + data: () => ({ posts: [] }) } }) diff --git a/components/TheFooter.stories.js b/components/TheFooter.stories.js new file mode 100644 index 0000000..ceb5015 --- /dev/null +++ b/components/TheFooter.stories.js @@ -0,0 +1,29 @@ +import { storiesOf } from '@storybook/vue' +import { action } from '@storybook/addon-actions' + +import TheFooter from './TheFooter' + +export const routes = [ + { path: '/', name: 'Strona główna' }, + { path: '/download', name: 'Do pobrania' }, + { path: '/kontakt', name: 'Kontakt' }, + { path: '/kronika', name: 'Kronika' } +] + +const footer = { + routes +} + +const alwaysBottom = () => ({ + template: `
    ` +}) + +storiesOf('TheFooter', module) + .addDecorator(alwaysBottom) + .add('default', () => { + return { + components: { TheFooter }, + template: ``, + data: () => footer + } + }) diff --git a/components/TheFooter.vue b/components/TheFooter.vue new file mode 100644 index 0000000..e19c86a --- /dev/null +++ b/components/TheFooter.vue @@ -0,0 +1,116 @@ + + + + + \ No newline at end of file diff --git a/layouts/default.vue b/layouts/default.vue index ff95023..53416bf 100644 --- a/layouts/default.vue +++ b/layouts/default.vue @@ -2,17 +2,17 @@
    -
    +
    - - \ No newline at end of file diff --git a/components/NavLink.stories.js b/components/NavLink.stories.js new file mode 100644 index 0000000..44fe6ae --- /dev/null +++ b/components/NavLink.stories.js @@ -0,0 +1,19 @@ +import { storiesOf } from '@storybook/vue' +import { center } from '../.storybook/decorators' + +import NavLink from './NavLink' + +const navLink = { + name: 'Test', + link: '/test' +} + +storiesOf('NavLink', module) + .addDecorator(center) + .add('default', () => { + return { + components: { NavLink }, + template: ``, + data: () => navLink + } + }) diff --git a/components/NavLink.vue b/components/NavLink.vue index bb86ef8..0418172 100644 --- a/components/NavLink.vue +++ b/components/NavLink.vue @@ -9,10 +9,22 @@ diff --git a/components/TheHeader.stories.js b/components/TheHeader.stories.js new file mode 100644 index 0000000..ee320b7 --- /dev/null +++ b/components/TheHeader.stories.js @@ -0,0 +1,24 @@ +import { storiesOf } from '@storybook/vue' +import { routes } from './TheFooter.stories' + +import TheHeader from './TheHeader' + +const header = { + routes, + title: '19 PDH Puszcza', + logo: '/assets/krajka-logo.svg' +} + +const alwaysTop = () => ({ + template: `
    ` +}) + +storiesOf('TheHeader', module) + .addDecorator(alwaysTop) + .add('default', () => { + return { + components: { TheHeader }, + template: ``, + data: () => header + } + }) diff --git a/components/TheHeader.vue b/components/TheHeader.vue new file mode 100644 index 0000000..431b945 --- /dev/null +++ b/components/TheHeader.vue @@ -0,0 +1,183 @@ + + + + + \ No newline at end of file diff --git a/layouts/default.vue b/layouts/default.vue index 53416bf..58970ba 100644 --- a/layouts/default.vue +++ b/layouts/default.vue @@ -1,18 +1,18 @@ + + \ No newline at end of file diff --git a/components/JoinUs.vue b/components/JoinUs.vue index 6ffec91..d8bfadf 100644 --- a/components/JoinUs.vue +++ b/components/JoinUs.vue @@ -4,13 +4,22 @@
    Rozpocznij swoją harcerską przygodę!
    -
    - Dołącz do nas! -
    +
    + + \ No newline at end of file + diff --git "a/static/files/Ksi\304\205\305\274eczka_sprawno\305\233ci.pdf" "b/static/files/Ksi\304\205\305\274eczka_sprawno\305\233ci.pdf" new file mode 100644 index 0000000..4768c67 Binary files /dev/null and "b/static/files/Ksi\304\205\305\274eczka_sprawno\305\233ci.pdf" differ -- cgit 1.4.1 From 070b7725be5fb0db486e9370bea5648c16c8bbfe Mon Sep 17 00:00:00 2001 From: Patryk Niedźwiedziński Date: Sat, 30 Nov 2019 13:12:30 +0100 Subject: Fix posts listing --- .gitignore | 1 + pages/kronika/index.vue | 20 ++++++++++---------- scripts/generateApi.js | 5 +++++ scripts/postbuild.sh | 1 + 4 files changed, 17 insertions(+), 10 deletions(-) diff --git a/.gitignore b/.gitignore index 53c3292..02a490c 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,5 @@ content +static/api/posts.json # Created by .ignore support plugin (hsz.mobi) ### Node template diff --git a/pages/kronika/index.vue b/pages/kronika/index.vue index 4a89a48..d28c2ca 100644 --- a/pages/kronika/index.vue +++ b/pages/kronika/index.vue @@ -1,7 +1,7 @@ +``` + +Or by using the mixin + +```html + + + +``` diff --git a/components/Posts/PostList/index.js b/components/Posts/PostList/index.js index dbb515e..11d44ff 100644 --- a/components/Posts/PostList/index.js +++ b/components/Posts/PostList/index.js @@ -1,3 +1,22 @@ +import axios from 'axios' + +import k from '~/api' import PostList from './PostList' +export const getPosts = async () => { + if (process.client) { + let posts = await axios.get(`${window.location.origin}/api/posts.json`) + return parsePosts(posts.data) + } else { + return parsePosts(k.getPosts()) + } +} + +export const parsePosts = posts => + posts.map(post => ({ + title: post.content.meta.title, + description: post.content.description, + route: post.route + })) + export default PostList diff --git a/components/Posts/PostList/parentMixin.js b/components/Posts/PostList/parentMixin.js new file mode 100644 index 0000000..e5b06ed --- /dev/null +++ b/components/Posts/PostList/parentMixin.js @@ -0,0 +1,9 @@ +import { getPosts } from './index' + +export default { + async asyncData() { + return { + posts: await getPosts() + } + } +} diff --git a/package-lock.json b/package-lock.json index dc75e41..3c259df 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4150,7 +4150,7 @@ "integrity": "sha512-1uvKqKQta3KBxIz14F2v06AEHZ/dIoeKfbTRkK1E5oqjDnuEerLmYTgJB5AiQZHJcljpg1TuRzdjDR06qNk0DQ==", "requires": { "follow-redirects": "1.5.10", - "is-buffer": "2.0.3" + "is-buffer": "2.0.4" }, "dependencies": { "debug": { @@ -4170,9 +4170,9 @@ } }, "is-buffer": { - "version": "2.0.3", - "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.3.tgz", - "integrity": "sha512-U15Q7MXTuZlrbymiz95PJpZxu8IlipAp4dtS3wOdgPXx3mqBnslrWU14kxfHB+Py/+2PVKSr37dMAgM2A4uArw==" + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.4.tgz", + "integrity": "sha512-Kq1rokWXOPXWuaMAqZiJW4XxsmD9zGx9q4aePabbn3qCRGedtH7Cm+zV8WETitMfu1wdh+Rvd6w5egwSngUX2A==" }, "ms": { "version": "2.0.0", diff --git a/package.json b/package.json index d7925a2..6522e9d 100644 --- a/package.json +++ b/package.json @@ -17,6 +17,7 @@ "dependencies": { "@nuxtjs/axios": "^5.3.6", "@nuxtjs/pwa": "^3.0.0-0", + "axios": "^0.19.0", "esm": "^3.2.25", "front-matter": "^3.0.2", "jsdom": "^15.1.1", diff --git a/pages/index.vue b/pages/index.vue index 3a19237..045025d 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -3,7 +3,7 @@

    Ostatnie wpisy z kroniki

    - +
    @@ -13,9 +13,11 @@ import JoinUs from '~/components/JoinUs.vue' import FacebookFeed from '~/components/Facebook/FacebookFeed.vue' import PostList from '~/components/Posts/PostList' +import postListParentMixin from '~/components/Posts/PostList/parentMixin' export default { name: 'HomeView', - components: { JoinUs, FacebookFeed, PostList } + components: { JoinUs, FacebookFeed, PostList }, + mixins: [postListParentMixin] } diff --git a/pages/kronika/index.vue b/pages/kronika/index.vue index 86344c3..8142a6c 100644 --- a/pages/kronika/index.vue +++ b/pages/kronika/index.vue @@ -1,16 +1,18 @@ -- cgit 1.4.1 From 34908ab59f58f3d5b229867c84d8b51b07c777d4 Mon Sep 17 00:00:00 2001 From: Patryk Niedźwiedziński Date: Thu, 5 Dec 2019 17:47:12 +0100 Subject: Add loading bar --- nuxt.config.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/nuxt.config.js b/nuxt.config.js index b5a9a97..e5b3d4d 100644 --- a/nuxt.config.js +++ b/nuxt.config.js @@ -106,5 +106,9 @@ export default { console.log(errors) } } + }, + loading: { + color: '#507b34', + height: '5px' } } -- cgit 1.4.1 From e84e4a2eb8985b517b706d1735a744b4e9b81518 Mon Sep 17 00:00:00 2001 From: Patryk Niedźwiedziński Date: Thu, 5 Dec 2019 18:14:53 +0100 Subject: Fix article title on mobile --- pages/kronika/_year/_month/_day/_title/index.vue | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/pages/kronika/_year/_month/_day/_title/index.vue b/pages/kronika/_year/_month/_day/_title/index.vue index dafa237..9fab1d0 100644 --- a/pages/kronika/_year/_month/_day/_title/index.vue +++ b/pages/kronika/_year/_month/_day/_title/index.vue @@ -71,6 +71,12 @@ export default { width: 100%; border-radius: 5px; } + +.article h1 { + font-size: 1.5em; + letter-spacing: 0; +} + @media (max-width: 720px) { .article { padding: 60px 20px; @@ -78,5 +84,9 @@ export default { .article p { text-align: justify; } + .article h1 { + font-size: 1.7em; + font-weight: 700; + } } -- cgit 1.4.1 From 343c4b54fde3c0b9103ace149224e088a87378f4 Mon Sep 17 00:00:00 2001 From: Patryk Niedźwiedziński Date: Thu, 5 Dec 2019 18:18:55 +0100 Subject: Create LICENSE --- LICENSE | 21 +++++++++++++++++++++ 1 file changed, 21 insertions(+) create mode 100644 LICENSE diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..83ecb03 --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2019 19 PDH Puszcza + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. -- cgit 1.4.1 From c7306cfdbaa50c89639fe38bb1b4005ed3555422 Mon Sep 17 00:00:00 2001 From: Patryk Niedźwiedziński Date: Thu, 5 Dec 2019 18:20:18 +0100 Subject: Create CODE_OF_CONDUCT.md --- CODE_OF_CONDUCT.md | 76 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 76 insertions(+) create mode 100644 CODE_OF_CONDUCT.md diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md new file mode 100644 index 0000000..62896f8 --- /dev/null +++ b/CODE_OF_CONDUCT.md @@ -0,0 +1,76 @@ +# Contributor Covenant Code of Conduct + +## Our Pledge + +In the interest of fostering an open and welcoming environment, we as +contributors and maintainers pledge to making participation in our project and +our community a harassment-free experience for everyone, regardless of age, body +size, disability, ethnicity, sex characteristics, gender identity and expression, +level of experience, education, socio-economic status, nationality, personal +appearance, race, religion, or sexual identity and orientation. + +## Our Standards + +Examples of behavior that contributes to creating a positive environment +include: + +* Using welcoming and inclusive language +* Being respectful of differing viewpoints and experiences +* Gracefully accepting constructive criticism +* Focusing on what is best for the community +* Showing empathy towards other community members + +Examples of unacceptable behavior by participants include: + +* The use of sexualized language or imagery and unwelcome sexual attention or + advances +* Trolling, insulting/derogatory comments, and personal or political attacks +* Public or private harassment +* Publishing others' private information, such as a physical or electronic + address, without explicit permission +* Other conduct which could reasonably be considered inappropriate in a + professional setting + +## Our Responsibilities + +Project maintainers are responsible for clarifying the standards of acceptable +behavior and are expected to take appropriate and fair corrective action in +response to any instances of unacceptable behavior. + +Project maintainers have the right and responsibility to remove, edit, or +reject comments, commits, code, wiki edits, issues, and other contributions +that are not aligned to this Code of Conduct, or to ban temporarily or +permanently any contributor for other behaviors that they deem inappropriate, +threatening, offensive, or harmful. + +## Scope + +This Code of Conduct applies both within project spaces and in public spaces +when an individual is representing the project or its community. Examples of +representing a project or community include using an official project e-mail +address, posting via an official social media account, or acting as an appointed +representative at an online or offline event. Representation of a project may be +further defined and clarified by project maintainers. + +## Enforcement + +Instances of abusive, harassing, or otherwise unacceptable behavior may be +reported by contacting the project team at pniedzwiedzinski19@gmail.com. All +complaints will be reviewed and investigated and will result in a response that +is deemed necessary and appropriate to the circumstances. The project team is +obligated to maintain confidentiality with regard to the reporter of an incident. +Further details of specific enforcement policies may be posted separately. + +Project maintainers who do not follow or enforce the Code of Conduct in good +faith may face temporary or permanent repercussions as determined by other +members of the project's leadership. + +## Attribution + +This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, +available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html + +[homepage]: https://www.contributor-covenant.org + +For answers to common questions about this code of conduct, see +https://www.contributor-covenant.org/faq -- cgit 1.4.1