From 6e565b4c566fb3f8157da3c95ed8ded7fd2a29a5 Mon Sep 17 00:00:00 2001 From: samaradel Date: Thu, 26 Nov 2020 13:34:35 +0200 Subject: [PATCH] new Newsroom --- content/site/navigation.json | 19 +- gridsome.server.js | 216 +++++++++---------- src/assets/scss/main.scss | 59 +++-- src/components/PostListItem.vue | 51 ++--- src/pages/{News.vue => Blog.vue} | 0 src/templates/{Overview.vue => NewsRoom.vue} | 2 +- 6 files changed, 183 insertions(+), 164 deletions(-) rename src/pages/{News.vue => Blog.vue} (100%) rename src/templates/{Overview.vue => NewsRoom.vue} (94%) diff --git a/content/site/navigation.json b/content/site/navigation.json index 6aaadd18e..825d8c7c2 100644 --- a/content/site/navigation.json +++ b/content/site/navigation.json @@ -1,5 +1,10 @@ { "headerNavigation": [ + { + "name": "About", + "link": "/about", + "external": false + }, { "name": "Projects", "link": "/projects", @@ -11,19 +16,13 @@ "external": false }, { - "name": "Overview", - "link": "/overview", + "name": "Blog", + "link": "/blog", "external": false }, { - "name": "News", - "link": "/news", - "external": false - }, - - { - "name": "About", - "link": "/about", + "name": "NewsRoom", + "link": "/newsroom", "external": false } ], diff --git a/gridsome.server.js b/gridsome.server.js index 7c8035f37..db4c8d05f 100644 --- a/gridsome.server.js +++ b/gridsome.server.js @@ -5,106 +5,106 @@ // Changes here require a server restart. // To restart press CTRL + C in terminal and run `gridsome develop` -var private = process.env.SHOWPRIVATE +var private = process.env.SHOWPRIVATE if (private == "true") - private = null -else if(private == "false") - private = 1 + private = null +else if (private == "false") + private = 1 -module.exports = function (api) { - api.loadSource(({ - addCollection - }) => { - // Use the Data Store API here: https://gridsome.org/docs/data-store-api/ - }) - - api.createPages(({ - createPage - }) => { - // Use the Pages API here: https://gridsome.org/docs/pages-api/ - }) - - api.onCreateNode(options => { - if (options.internal.typeName === 'Blog') { - - options.tags = (typeof options.tags === 'string') ? options.tags.split(',').map(string => string.trim()) : options.tags; - options.author = (typeof options.author === 'string') ? options.author.split(',').map(string => string.trim()) : options.author; - return { - ...options - }; - } - - if (options.internal.typeName === 'Project') { - options.tags = (typeof options.tags === 'string') ? options.tags.split(',').map(string => string.trim()) : options.tags; - options.countries = (typeof options.countries === 'string') ? options.countries.split(',').map(string => string.trim()) : options.countries; - options.cities = (typeof options.cities === 'string') ? options.cities.split(',').map(string => string.trim()) : options.cities; - options.members = (typeof options.members === 'string') ? options.members.split(',').map(string => string.trim()) : options.members; - options.author = (typeof options.author === 'string') ? options.author.split(',').map(string => string.trim()) : options.author; - return { - ...options - }; - } - - - if (options.internal.typeName === 'Person') { - options.project_ids = (typeof options.project_ids === 'string') ? options.project_ids.split(',').map(string => string.trim()) : options.project_ids; - options.memberships = (typeof options.memberships === 'string') ? options.memberships.split(',').map(string => string.trim()) : options.memberships; - options.countries = (typeof options.countries === 'string') ? options.countries.split(',').map(string => string.trim()) : options.countries; - options.cities = (typeof options.cities === 'string') ? options.cities.split(',').map(string => string.trim()) : options.cities; - return { - ...options - }; - } - }) - - api.createPages(({ createPage }) => { - createPage({ - path: '/people', - component: './src/templates/People.vue', - context: { - private: private - } - }) - }) - - api.createPages(({ createPage }) => { - createPage({ - path: '/search', - component: './src/templates/Search.vue', - context: { - private: private - } - }) - }) - - api.createPages(({ createPage }) => { - createPage({ - path: '/projects', - component: './src/templates/Projects.vue', - context: { - private: private - } - }) - }) - - api.createPages(({ createPage }) => { - createPage({ - path: '/overview', - component: './src/templates/Overview.vue', - context: { - private: private - } - }) - }) - - api.createPages(async ({ - graphql, - createPage +module.exports = function(api) { + api.loadSource(({ + addCollection }) => { - // Use the Pages API here: https://gridsome.org/docs/pages-api - const { - data - } = await graphql(`{ + // Use the Data Store API here: https://gridsome.org/docs/data-store-api/ + }) + + api.createPages(({ + createPage + }) => { + // Use the Pages API here: https://gridsome.org/docs/pages-api/ + }) + + api.onCreateNode(options => { + if (options.internal.typeName === 'Blog') { + + options.tags = (typeof options.tags === 'string') ? options.tags.split(',').map(string => string.trim()) : options.tags; + options.author = (typeof options.author === 'string') ? options.author.split(',').map(string => string.trim()) : options.author; + return { + ...options + }; + } + + if (options.internal.typeName === 'Project') { + options.tags = (typeof options.tags === 'string') ? options.tags.split(',').map(string => string.trim()) : options.tags; + options.countries = (typeof options.countries === 'string') ? options.countries.split(',').map(string => string.trim()) : options.countries; + options.cities = (typeof options.cities === 'string') ? options.cities.split(',').map(string => string.trim()) : options.cities; + options.members = (typeof options.members === 'string') ? options.members.split(',').map(string => string.trim()) : options.members; + options.author = (typeof options.author === 'string') ? options.author.split(',').map(string => string.trim()) : options.author; + return { + ...options + }; + } + + + if (options.internal.typeName === 'Person') { + options.project_ids = (typeof options.project_ids === 'string') ? options.project_ids.split(',').map(string => string.trim()) : options.project_ids; + options.memberships = (typeof options.memberships === 'string') ? options.memberships.split(',').map(string => string.trim()) : options.memberships; + options.countries = (typeof options.countries === 'string') ? options.countries.split(',').map(string => string.trim()) : options.countries; + options.cities = (typeof options.cities === 'string') ? options.cities.split(',').map(string => string.trim()) : options.cities; + return { + ...options + }; + } + }) + + api.createPages(({ createPage }) => { + createPage({ + path: '/people', + component: './src/templates/People.vue', + context: { + private: private + } + }) + }) + + api.createPages(({ createPage }) => { + createPage({ + path: '/search', + component: './src/templates/Search.vue', + context: { + private: private + } + }) + }) + + api.createPages(({ createPage }) => { + createPage({ + path: '/projects', + component: './src/templates/Projects.vue', + context: { + private: private + } + }) + }) + + api.createPages(({ createPage }) => { + createPage({ + path: '/newsroom', + component: './src/templates/NewsRoom.vue', + context: { + private: private + } + }) + }) + + api.createPages(async({ + graphql, + createPage + }) => { + // Use the Pages API here: https://gridsome.org/docs/pages-api + const { + data + } = await graphql(`{ allBlog { edges { previous { @@ -122,18 +122,18 @@ module.exports = function (api) { } `); - data.allBlog.edges.forEach(function (element) { - createPage({ - path: element.node.path, - component: './src/templates/BlogPost.vue', - context: { - previousElement: (element.previous) ? element.previous.id : '##empty##', - nextElement: (element.next) ? element.next.id : '##empty##', - id: element.node.id - } - }); + data.allBlog.edges.forEach(function(element) { + createPage({ + path: element.node.path, + component: './src/templates/BlogPost.vue', + context: { + previousElement: (element.previous) ? element.previous.id : '##empty##', + nextElement: (element.next) ? element.next.id : '##empty##', + id: element.node.id + } + }); - }); + }); }); } \ No newline at end of file diff --git a/src/assets/scss/main.scss b/src/assets/scss/main.scss index f95539406..01821437f 100644 --- a/src/assets/scss/main.scss +++ b/src/assets/scss/main.scss @@ -51,9 +51,8 @@ ul { } } - .animated-link:after { - content: ''; + content: ""; width: 0px; height: 1px; display: block; @@ -95,33 +94,32 @@ ul { } } -.author-list-item:nth-child(n+2) { - @apply -ml-3 +.author-list-item:nth-child(n + 2) { + @apply -ml-3; } @media (min-width: 768px) { - .with-large>.flex-post:nth-child(5n), - .with-large>.flex-post:nth-child(5n-1) { - // @apply flex-100; - flex: 1 1 50%; - @apply flex-col; + // .with-large>.flex-post:nth-child(5n), + .with-large>.flex-post:nth-child(6n + 1) { + @apply flex-100; + @apply flex-row; .post-card-image-link { - + // @apply flex-auto; + flex: 1 1 100%; @apply relative; - min-height: 400px; - + min-height: 380px; + @apply mr-6; } .post-card-image { @apply absolute; - @apply h-full; + @apply h-auto; @apply w-full; @apply object-cover; @apply rounded-lg; } .post-card-content { - // @apply flex-post-large-content; - flex: 0 1 auto; - @apply self-center + @apply flex-post-large-content; + @apply self-center; } .post-card-title { @apply text-4xl; @@ -130,6 +128,33 @@ ul { @apply text-xl; } } + // .with-large>.flex-overview:nth-child(6n + 1) { + // @apply flex-100; + // @apply flex-row; + // .post-card-image-link { + // @apply flex-auto; + // @apply relative; + // min-height: 380px; + // @apply mr-6; + // } + // .post-card-image { + // @apply absolute; + // @apply h-full; + // @apply w-full; + // @apply object-cover; + // @apply rounded-lg; + // } + // .post-card-content { + // @apply flex-post-large-content; + // @apply self-center; + // } + // .post-card-title { + // @apply text-4xl; + // } + // .post-card-excerpt { + // @apply text-xl; + // } + // } } body[data-theme="dark"] { @@ -165,7 +190,7 @@ body[data-theme="dark"] { .author-social { a { &:hover { - @apply text-white + @apply text-white; } } } diff --git a/src/components/PostListItem.vue b/src/components/PostListItem.vue index e153cc651..688be70ab 100644 --- a/src/components/PostListItem.vue +++ b/src/components/PostListItem.vue @@ -14,17 +14,19 @@

{{ record.title || record.name }}

{{ record.excerpt }}

-
- {{ membership.title }} -
+
+ {{ membership.title }} +
- +
@@ -45,10 +47,8 @@
- -
+ +

{{ record.status }}

-
- - -
-
- {{ tag.title }} -
- +
+ {{ tag.title }} +
diff --git a/src/pages/News.vue b/src/pages/Blog.vue similarity index 100% rename from src/pages/News.vue rename to src/pages/Blog.vue diff --git a/src/templates/Overview.vue b/src/templates/NewsRoom.vue similarity index 94% rename from src/templates/Overview.vue rename to src/templates/NewsRoom.vue index 32c4a1f77..3641b403e 100644 --- a/src/templates/Overview.vue +++ b/src/templates/NewsRoom.vue @@ -1,7 +1,7 @@