update webstack

This commit is contained in:
2021-02-08 17:06:59 +02:00
parent b78623ec1c
commit 098fa4e260
313 changed files with 6370 additions and 915 deletions

View File

@@ -16,7 +16,7 @@
<div class="flex justify-between items-center">
<ul class="list-none flex author-list m-0">
<li
v-for="author in $page.blog.author"
v-for="author in $page.blog.authors"
:key="author.id"
class="author-list-item"
>
@@ -34,7 +34,7 @@
<div class="pl-3 flex flex-col text-xs leading-none uppercase">
<p>
<span
v-for="(author, index) in $page.blog.author"
v-for="(author, index) in $page.blog.authors"
:key="author.id"
>
<g-link
@@ -43,7 +43,7 @@
class="hover:underline"
>{{ author.name }}</g-link
>
<span v-if="index < $page.blog.author.length - 1">,</span>
<span v-if="index < $page.blog.authors.length - 1">,</span>
</span>
</p>
<p class="text-gray-700">
@@ -128,7 +128,7 @@
title
path
}
author {
authors {
id
name
image
@@ -142,7 +142,9 @@
image(width:800)
path
timeToRead
author {
humanTime : created(format:"DD MMMM YYYY")
datetime : created(format:"ddd MMM DD YYYY hh:mm:ss zZ")
authors {
id
name
image(width:64, height:64, fit:inside)
@@ -156,21 +158,21 @@
image(width:800)
path
timeToRead
author {
humanTime : created(format:"DD MMMM YYYY")
datetime : created(format:"ddd MMM DD YYYY hh:mm:ss zZ")
authors {
id
name
image(width:64, height:64, fit:inside)
path
}
}
}
}
</page-query>
<script>
import PostListItem from "~/components/PostListItem.vue";
import PostListItem from "~/components/custom/Cards/PostListItem.vue";
export default {
components: {
@@ -181,6 +183,7 @@ export default {
title: this.$page.blog.title,
};
},
};
</script>

View File

@@ -1,10 +1,114 @@
<template>
<Layout :hideHeader="true" :disableScroll="true">
<div class="container sm:pxi-0 mx-auto overflow-x-hidden text-center py-5">
<vue-markdown>
{{ $page.markdownPage.content }}
</vue-markdown>
<div class="container sm:pxi-0 mx-auto overflow-x-hidden py-5">
<Header
v-if="
$page.markdownPage.id !== 'contact' &&
$page.markdownPage.header_title &&
$page.markdownPage.header_title != ''
"
:title="$page.markdownPage.header_title"
:image="$page.markdownPage.header_image"
:altImg="$page.markdownPage.header_altImg"
:excerpt="$page.markdownPage.header_excerpt"
/>
<VerticalNav
:slides="$page.markdownPage.slides"
v-if="$page.markdownPage.slides && $page.markdownPage.slides.length > 0"
/>
<NewCard
v-for="card in $page.markdownPage.cards"
:key="card.id"
:card="card"
/>
<GetInTouch
:contacts="$page.markdownPage.contactData"
v-if="$page.markdownPage.contactData.length > 0"
/>
<SolutionsHeader
v-if="$page.markdownPage.header"
:header="$page.markdownPage.header"
/>
<ShowcaseProducts
:main="$page.markdownPage.productMain"
:products="$page.markdownPage.productData"
v-if="
$page.markdownPage.productData &&
$page.markdownPage.productData.length > 0
"
/>
<HowItWorks
v-if="$page.markdownPage.howItWorks.length > 0"
:HIWData="$page.markdownPage.howItWorks"
:main="$page.markdownPage.howItWorksMain"
/>
<template>
<ClientOnly>
<Features
v-if="$page.markdownPage.features.length > 0"
:main="$page.markdownPage.featuresMain"
:features="$page.markdownPage.features"
/>
</ClientOnly>
</template>
<logoShowcase
v-if="$page.markdownPage.logos.length > 0"
:logos="$page.markdownPage.logos"
/>
<template>
<ClientOnly>
<CallToAction
v-if="$page.markdownPage.cta"
:cta="$page.markdownPage.cta"
/>
<SignUp
v-if="$page.markdownPage.signup"
:signup="$page.markdownPage.signup"
/>
</ClientOnly>
</template>
<template>
<ClientOnly>
<Comparison
v-if="
$page.markdownPage.comparisonSecs &&
$page.markdownPage.comparisonSecs.length > 0
"
:main="$page.markdownPage.comparisonMain"
:sections="$page.markdownPage.comparisonSecs"
/>
</ClientOnly>
</template>
<Roadmap
v-if="$page.markdownPage.roadmap.length > 0"
:roadmap="$page.markdownPage.roadmap"
/>
<FourTiersWithToggle
v-if="$page.markdownPage.pricingPlans.length > 0"
:main="$page.markdownPage.pricing_plansMain"
:pricingPlans="$page.markdownPage.pricingPlans"
/>
<WithComparisonTable
v-if="$page.markdownPage.plans.length > 0"
:plans="$page.markdownPage.plans"
/>
<BrandPanel
:brand="$page.markdownPage.brandPanel"
v-if="$page.markdownPage.brandPanel"
/>
</div>
</Layout>
</template>
@@ -12,30 +116,245 @@
<page-query>
query($id: ID!) {
markdownPage(id: $id) {
id
path
content
title
}
excerpt
header_excerpt
header_altImg
header_title
header_image
slides{
id
title
excerpt
image
order
}
cards{
id
title
image
button
link
order
excerpt
}
contactData{
id
title
mail
phone
}
header{
title
subtitle
excerpt
btn1
link1
btn2
link2
}
howItWorks{
id
title
excerpt
}
howItWorksMain{
id
title
image
}
productMain{
id
subtitle
title
}
productData{
id
title
excerpt
}
brandPanel{
id
title
subtitle
excerpt(length: 2000)
sourceUrl
btnTxt
image
}
featuresMain{
id
title
btn
link
excerpt
}
logos{
id
image
}
features{
id
title
svg
excerpt
}
cta{
id
title
excerpt
button
link
}
signup{
id
title
button1
link1
button2
link2
}
comparisonMain{
id
title
description
button
link
}
comparisonSecs{
id
svg
title
excerpt
}
roadmap{
id
title
excerpt
}
pricing_plansMain{
id
title
button1
button2
excerpt
}
pricingPlans{
id
title
excerpt
price
duration
button
link
includeTitle
options
}
plans{
id
title
rows {
title
firstCol
secCol
thirdCol
}
}
}
}
</page-query>
<script>
import VueMarkdown from 'vue-markdown'
import NewCard from "~/components/marketing/sections/cta-sections/NewCard.vue";
import Header from "~/components/marketing/sections/cta-sections/Header.vue";
import VerticalNav from "~/components/custom/Navbar/VerticalNav.vue";
import GetInTouch from "~/components/custom/Navbar/Getintouch.vue";
import SolutionsHeader from "~/components/custom/sections/header/HeaderSection.vue";
import HowItWorks from "~/components/custom/sections/HowItWorks.vue";
import ShowcaseProducts from "~/components/marketing/sections/cta-sections/ShowcaseProducts.vue";
import Features from "~/components/custom/sections/Features.vue";
import logoShowcase from "~/components/marketing/sections/cta-sections/logoShowcase.vue";
import CallToAction from "~/components/custom/sections/CallToAction.vue";
import SignUp from "~/components/custom/sections/SignUp.vue";
import Comparison from "~/components/custom/sections/Comparison.vue";
import Roadmap from "~/components/custom/sections/Roadmap.vue";
import FourTiersWithToggle from "~/components/marketing/sections/pricing/four_tiers_with_toggle.vue";
import WithComparisonTable from "~/components/marketing/sections/pricing/with_comparison_table.vue";
import BrandPanel from "~/components/marketing/sections/cta-sections/BrandPanel.vue";
export default {
components: {
VueMarkdown
NewCard,
Header,
VerticalNav,
GetInTouch,
SolutionsHeader,
HowItWorks,
ShowcaseProducts,
Features,
logoShowcase,
CallToAction,
SignUp,
Comparison,
Roadmap,
FourTiersWithToggle,
WithComparisonTable,
BrandPanel,
},
metaInfo() {
return {
title: this.$page.markdownPage.title,
};
},
mounted() {
// console.log(this.$page.markdownPage.plans);
},
};
</script>
<style scoped>
/* h2 {
padding-bottom: 8rem;
} */
/**
* Add back the container background-color, border-radius, padding, margin
* and overflow that we removed from <pre>.
*/
.gridsome-highlight {
background-color: #fdf6e3;
border-radius: 0.3em;
margin: 0.5em 0;
padding: 1em;
overflow: auto;
}
.gridsome-highlight-code-line {
background-color: #feb;
display: block;
margin-right: -1em;
margin-left: -1em;
padding-right: 1em;
padding-left: 0.75em;
border-left: 0.25em solid #f99;
}
/**
* Remove the default PrismJS theme background-color, border-radius, margin,
* padding and overflow.
* 1. Make the element just wide enough to fit its content.
* 2. Always fill the visible space in .gatsby-highlight.
* 3. Adjust the position of the line numbers
*/
.gridsome-highlight pre[class*="language-"] {
background-color: transparent;
margin: 0;
padding: 0;
overflow: initial;
float: left; /* 1 */
min-width: 100%; /* 2 */
}
/* Adjust the position of the line numbers */
.gridsome-highlight pre[class*="language-"].line-numbers {
padding-left: 2.8em;
}
</style> >

View File

@@ -1,12 +1,12 @@
<template>
<Layout :hideHeader="true" :disableScroll="true">
<div class="container sm:pxi-0 mx-auto overflow-x-hidden">
<TagFilterHeader :tags="memberships" :selected="$page.membership.title" v-if="$page.allMembership.edges.length > 1"/>
<div class="container sm:pxi-0 mx-auto mt-8 overflow-x-hidden">
<div class="mx-4 sm:mx-0">
<h1 class="pb-0 mb-0 text-5xl font-medium capitalize">
{{ $page.membership.title }}
</h1>
<p class="text-gray-700 text-xl">
<span class="self-center"
>{{ $page.membership.belongsTo.totalCount }} People</span
>
@@ -58,15 +58,38 @@
}
}
}
allMembership(filter: {title: {in: ["foundation", "tech"]}}){
edges{
node{
id
title
path
}
}
}
}
</page-query>
<script>
import PostListItem from "~/components/PostListItem.vue";
import PostListItem from "~/components/custom/Cards/PostListItem.vue";
import TagFilterHeader from "~/components/custom/TagFilterHeader.vue";
export default {
components: {
PostListItem,
TagFilterHeader,
},
computed: {
memberships() {
var res = [{ title: "All", path: "/team" }];
this.$page.allMembership.edges.forEach((edge) =>
res.push({ title: edge.node.title, path: edge.node.path })
);
return res;
},
},
metaInfo() {

View File

@@ -16,7 +16,7 @@
<div class="flex justify-between items-center">
<ul class="list-none flex author-list m-0">
<li
v-for="author in $page.news.author"
v-for="author in $page.news.authors"
:key="author.id"
class="author-list-item"
>
@@ -128,7 +128,7 @@
title
path
}
author {
authors {
id
name
image
@@ -142,7 +142,7 @@
image(width:800)
path
timeToRead
author {
authors {
id
name
image(width:64, height:64, fit:inside)
@@ -156,7 +156,7 @@
image(width:800)
path
timeToRead
author {
authors {
id
name
image(width:64, height:64, fit:inside)
@@ -170,7 +170,8 @@
</page-query>
<script>
import PostListItem from "~/components/PostListItem.vue";
import PostListItem from "~/components/custom/Cards/PostListItem.vue";
export default {
components: {

View File

@@ -0,0 +1,74 @@
<template>
<Layout>
<TagFilterHeader :tags="tags" selected="all" v-if="$page.tags.edges.length > 1"/>
<div class="container mt-8 sm:pxi-0 mx-auto overflow-x-hidden">
<div class="flex flex-wrap with-large pt-8 pb-8 mx-4 sm:-mx-4">
<PostListItem
v-for="partner in $page.entries.edges"
:key="partner.id"
:record="partner.node"
pathPrefix="/partners"
/>
</div>
</div>
</Layout>
</template>
<page-query>
query ($private: Int){
entries: allProject (sortBy: "rank", order: DESC, filter: { private: { ne: $private }, tags: { id: {in: ["farming"]}}}){
totalCount
edges {
node {
id
title
path
members {
id
name
image(width:64, height:64, fit:inside)
path
},
rank
linkedin
excerpt
image(width:800)
timeToRead
logo
}
}
}
tags: allProjectTag (filter: { title: {in: ["farming"]}}) {
edges{
node{
id
title
path
}
}
}
}
</page-query>
<script>
import PostListItem from "~/components/custom/Cards/PostListItem.vue";
import TagFilterHeader from "~/components/custom/TagFilterHeader.vue";
export default {
components: {
PostListItem,
TagFilterHeader,
},
computed: {
tags() {
var res = [{ title: "All", path: "/partners" }];
this.$page.tags.edges.forEach((edge) =>
res.push({ title: edge.node.title, path: edge.node.path })
);
return res;
},
},
};
</script>

View File

@@ -33,7 +33,7 @@
<div class="flex justify-between items-center">
<ul class="list-none flex author-list m-0 py-2">
<li
v-for="project in $page.person.project_ids"
v-for="project in $page.person.projects"
:key="project.id"
class="author-list-item"
>
@@ -92,7 +92,7 @@
title
path
}
project_ids{
projects{
id
title
path
@@ -123,7 +123,7 @@
timeToRead
humanTime : created(format:"DD MMM YYYY")
datetime : created
author {
authors {
id
name
image(width:64, height:64, fit:inside)
@@ -137,20 +137,28 @@
image(width:800)
logo
path
humanTime : startdate(format:"DD MMM YYYY")
datetime : created
}
}
}
}
}
}
memberships: allMembership(filter: {title: {in: ["foundation", "tech"]}}){
edges{
node{
id
title
path
}
}
}
}
</page-query>
<script>
import PostListItem from "~/components/PostListItem.vue";
import Pagination from "~/components/Pagination.vue";
import PostListItem from "~/components/custom/Cards/PostListItem.vue";
import Pagination from "~/components/custom/Pagination.vue";
export default {
components: {
@@ -162,6 +170,18 @@ export default {
var pluralize = require("pluralize");
return pluralize("post", this.$page.person.belongsTo.totalCount);
},
memberships(){
var all = []
this.$page.memberships.edges.forEach((edgs) => all.push(edge.node.title))
var res = []
this.$page.person.memberships.forEach(function(membership){
if (all.includes(membership.title)){
res.push(membership)
}
});
return res
}
},
metaInfo() {
return {

View File

@@ -50,11 +50,11 @@
</section>
<section class="post-tags container mx-auto relative py-5">
<g-link
v-for="tag in $page.project.tags"
:key="tag.id"
:to="tag.path"
v-for="edge in $page.tags.edges"
:key="edge.node.id"
:to="edge.node.path"
class="text-xs bg-transparent hover:text-blue-700 py-2 px-4 mr-2 border hover:border-blue-500 border-gray-600 text-gray-700 rounded-full"
>{{ tag.title }}</g-link
>{{ edge.node.title }}</g-link
>
</section>
</div>
@@ -123,7 +123,7 @@
name
image(width:64, height:64, fit:inside)
path
project_ids{
projects{
id
title
path
@@ -135,12 +135,26 @@
}
}
}
tags: allProjectTag (filter: { title: {in: ["farming"]}}) {
edges{
node{
id
title
path
}
}
}
}
</page-query>
<script>
import PostListItem from "~/components/PostListItem.vue";
import Pagination from "~/components/Pagination.vue";
import PostListItem from "~/components/custom/Cards/PostListItem.vue";
import Pagination from "~/components/custom/Pagination.vue";
export default {
components: {

7
src/templates/README.md Normal file
View File

@@ -0,0 +1,7 @@
Templates for **GraphQL collections** should be added here.
To create a template for a collection called `WordPressPost`
create a file named `WordPressPost.vue` in this folder.
Learn more: https://gridsome.org/docs/templates/
You can delete this file.

View File

@@ -7,7 +7,7 @@
<img
v-if="loading"
class="m-auto"
src="../assets/imgs/loader.gif"
src="/img/loader.gif"
alt=""
/>
<div
@@ -30,7 +30,7 @@
<page-query>
query ($private: Int){
projects: allProject (filter: { private: { ne: $private }}){
projects: allProject (filter: { private: { ne: $private }, tags: { id: {in: ["farming"]}}}){
edges {
node {
id
@@ -52,7 +52,7 @@ query ($private: Int){
image(width:800)
path
timeToRead
author {
authors {
id
image(width:64, height:64, fit:inside)
@@ -62,7 +62,7 @@ query ($private: Int){
}
}
people: allPerson(filter: { private: { ne: $private }}) {
people: allPerson(filter: { private: { ne: $private }, memberships: { id: {in: ["foundation", "tech"]}}}) {
edges {
node {
id
@@ -96,7 +96,7 @@ query ($private: Int){
path
humanTime : created(format:"DD MMM YYYY")
datetime : created
author {
authors {
id
name
image(width:64, height:64, fit:inside)
@@ -106,12 +106,24 @@ query ($private: Int){
}
}
markdowns: allMarkdownPage{
edges{
node{
__typename
header_title
header_excerpt
path
title
excerpt
}
}
}
}
</page-query>
<script>
import SearchListItem from "~/components/SearchListItem.vue";
import SearchListItem from "~/components/custom/Cards/SearchListItem.vue";
export default {
metaInfo: {
@@ -125,8 +137,8 @@ export default {
computed: {
searchResults() {
const searchTerm = this.q;
if (searchTerm.length < 3) return [];
var searchRes = this.$search.search({ query: searchTerm, limit: 5 });
if (!searchTerm || searchTerm.length < 3) return [];
var searchRes = this.$search.search({ query: searchTerm, limit: 100 });
var result = [];
for (var i = 0; i < searchRes.length; i++) {
var item = searchRes[i];
@@ -157,6 +169,12 @@ export default {
var item = this.$page.blogs.edges[i];
this.objects[item.node.path] = item.node;
}
for (var i = 0; i < this.$page.markdowns.edges.length; i++) {
var item = this.$page.markdowns.edges[i];
this.objects[item.node.path] = item.node;
}
this.loading = false;
},
components: {

View File

@@ -1,12 +1,15 @@
<template>
<Layout :hideHeader="true" :disableScroll="true">
<div class="container sm:pxi-0 mx-auto overflow-x-hidden pt-24">
<TagFilterHeader :tags="tagTitles" :selected="title" v-if="tagTitles.length > 2"/>
<div class="container sm:px-0 mx-auto overflow-x-hidden pt-12">
<div class="mx-4 sm:mx-0">
<h1 class="pb-0 mb-0 text-5xl font-medium">{{ tags.title }}</h1>
<h1 class="pb-0 mb-0 text-5xl font-medium capitalize">
{{ tags.title }}
</h1>
<p class="text-gray-700 text-xl">
<span
class="self-center"
>{{ tags.belongsTo.totalCount }} {{item}}</span>
<span class="self-center"
>{{ tags.belongsTo.totalCount }} {{ item }}</span
>
</p>
</div>
@@ -46,21 +49,6 @@
}
edges {
node {
... on Blog {
title
excerpt
image(width:800)
path
timeToRead
humanTime : created(format:"DD MMM YYYY")
datetime : created
author {
id
name
image(width:64, height:64, fit:inside)
path
}
},
... on Project {
title
excerpt
@@ -94,55 +82,151 @@
timeToRead
humanTime : created(format:"DD MMM YYYY")
datetime : created
author {
authors {
id
name
image(width:64, height:64, fit:inside)
path
}
},
... on Project {
title
excerpt
image(width:800)
path
humanTime : startdate(format:"DD MMM YYYY")
datetime : created
}
}
}
}
}
}
blogTag(id: $id) {
title
path
belongsTo{
totalCount
pageInfo {
totalPages
currentPage
}
edges {
node {
... on Blog {
title
excerpt
image(width:800)
path
timeToRead
humanTime : created(format:"DD MMM YYYY")
datetime : created
authors {
id
name
image(width:64, height:64, fit:inside)
path
}
}
}
}
}
}
allProjectTag(filter: { title: {in: ["farming"]}}){
edges{
node{
id
title
path
}
}
}
allNewsTag{
edges{
node{
id
title
path
}
}
}
allBlogTag{
edges{
node{
id
title
path
}
}
}
}
</page-query>
<script>
import PostListItem from "~/components/PostListItem.vue";
import Pagination from "~/components/Pagination.vue";
import PostListItem from "~/components/custom/Cards/PostListItem.vue";
import Pagination from "~/components/custom/Pagination.vue";
import TagFilterHeader from "~/components/custom/TagFilterHeader.vue";
export default {
components: {
Pagination,
PostListItem
PostListItem,
TagFilterHeader,
},
computed:{
tags(){
return this.$page.projectTag || this.$page.newsTag
computed: {
title() {
return this.tags.title;
},
item(){
var plural = this.tags.belongsTo.totalCount > 0
return this.$page.projectTag? plural? "projects" : "project" : "news"
}
tagTitles() {
var path = "";
var tags = null;
if (this.$page.projectTag) {
path = "/partners";
tags = this.$page.allProjectTag;
} else if (this.$page.newsTag) {
path = "/news";
tags = this.$page.allNewsTag;
} else if (this.$page.blogTag) {
path = "/blog";
tags = this.$page.allBlogTag;
}
var res = [{ title: "All", path: path }];
tags.edges.forEach((edge) =>
res.push({ title: edge.node.title, path: edge.node.path })
);
return res;
},
tags() {
return this.$page.projectTag || this.$page.newsTag || this.$page.blogTag;
},
item() {
var plural = this.tags.belongsTo.totalCount > 0;
if (this.$page.projectTag) {
if (plural) return "projects";
return "project";
}
if (this.$page.newsTag) {
if (plural) return "posts";
return "post";
}
if (this.$page.blogTag) {
if (plural) return "posts";
return "post";
}
},
},
mounted() {
document.addEventListener("click", this.close);
},
beforeDestroy() {
document.removeEventListener("click", this.close);
},
metaInfo() {
return {
title: this.tags.title
title: this.tags.title,
};
}
},
};
</script>

69
src/templates/Team.vue Normal file
View File

@@ -0,0 +1,69 @@
<template>
<Layout>
<TagFilterHeader :tags="memberships" selected="all" v-if="$page.memberships.edges.length > 1"/>
<div class="container sm:pxi-0 mx-auto mt-8 overflow-x-hidden">
<div class="flex flex-wrap with-large pt-8 pb-8 mx-4 sm:-mx-4">
<PostListItem
v-for="person in $page.entries.edges"
:key="person.id"
:record="person.node"
/>
</div>
</div>
</Layout>
</template>
<page-query>
query ($private: Int){
entries: allPerson (sortBy: "rank", order: DESC, filter: { private: { ne: $private }, memberships: { id: {in: ["foundation", "tech"]}}}){
totalCount
edges {
node {
path
content
excerpt
name
rank
bio
linkedin
websites
countries
cities
image(width:800)
private
}
}
}
memberships: allMembership(filter: {title: {in: ["foundation", "tech"]}}){
edges{
node{
id
title
path
}
}
}
}
</page-query>
<script>
import PostListItem from "~/components/custom/Cards/PostListItem.vue";
import TagFilterHeader from "~/components/custom/TagFilterHeader.vue";
export default {
components: {
PostListItem,
TagFilterHeader,
},
computed: {
memberships() {
var res = [{ title: "All", path: "/team" }];
this.$page.memberships.edges.forEach((edge) =>
res.push({ title: edge.node.title, path: edge.node.path })
);
return res;
},
},
};
</script>