Apply tags

This commit is contained in:
samaradel
2021-04-12 13:39:36 +02:00
parent 3b4461964e
commit 69b64310f0
10 changed files with 175 additions and 109 deletions

View File

@@ -18,7 +18,7 @@
class="flex flex-wrap post-tags container mx-auto relative py-1" class="flex flex-wrap post-tags container mx-auto relative py-1"
> >
<g-link <g-link
v-for="membership in memberships" v-for="membership in record.memberships"
:key="membership.id" :key="membership.id"
:to="membership.path" :to="membership.path"
class="text-xs bg-transparent hover:text-blue-700 py-1 px-2 mr-1 border hover:border-blue-500 border-gray-600 text-gray-700 rounded-full mb-2" class="text-xs bg-transparent hover:text-blue-700 py-1 px-2 mr-1 border hover:border-blue-500 border-gray-600 text-gray-700 rounded-full mb-2"
@@ -74,8 +74,8 @@
v-for="tag in record.tags" v-for="tag in record.tags"
:key="tag.id" :key="tag.id"
:to="tag.path" :to="tag.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" class="inline-block 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 >{{ tag.title.replace("_", " ") }}</g-link
> >
</section> </section>
</div> </div>
@@ -101,20 +101,6 @@ export default {
if (this.pathPrefix) return this.pathPrefix + "/" + this.record.id; if (this.pathPrefix) return this.pathPrefix + "/" + this.record.id;
return this.record.path; return this.record.path;
}, },
memberships() {
var res = [];
var memberships = this.record.memberships;
if (!memberships) {
return [];
}
memberships.forEach(function (membership) {
if(["foundation", "tech", "cofounders"].includes(membership.title)){
res.push(membership);
}
});
return res;
},
}, },
methods: { methods: {
displaytags() { displaytags() {

View File

@@ -49,7 +49,7 @@
@click="setActive(0)" @click="setActive(0)"
class="flex flex-row items-center w-full md:w-auto md:inline md:mt-0 md:ml-4 animated-link" class="flex flex-row items-center w-full md:w-auto md:inline md:mt-0 md:ml-4 animated-link"
> >
<span class="capitalize">{{ topic }}</span> <span class="capitalize">{{ topic.replace("_", " ") }}</span>
<svg <svg
fill="currentColor" fill="currentColor"
viewBox="0 0 20 20" viewBox="0 0 20 20"
@@ -84,12 +84,12 @@
<a <a
v-for="topic in topics" v-for="topic in topics"
:key="topic" :key="topic"
class="cursor-pointer block px-4 py-2 mt-2 text-sm font-semibold bg-transparent rounded-lg dark:bg-transparent dark:hover:bg-gray-600 dark-:focus:bg-gray-600 dark:focus:text-white dark:hover:text-white dark:text-gray-200 md:mt-0 hover:text-gray-900 focus:text-gray-900 hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline"
@click.self=" @click.self="
setTopic(topic); setTopic(topic);
open = false; open = false;
" "
>{{ topic }}</a class="cursor-pointer block px-4 py-2 mt-2 text-sm font-semibold bg-transparent rounded-lg dark:bg-transparent dark:hover:bg-gray-600 dark-:focus:bg-gray-600 dark:focus:text-white dark:hover:text-white dark:text-gray-200 md:mt-0 hover:text-gray-900 focus:text-gray-900 hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline"
>{{ topic.replace("_", " ") }}</a
> >
</div> </div>
</div> </div>

View File

@@ -20,7 +20,9 @@
:record="post.node" :record="post.node"
/> />
</div> </div>
<div class="text-center" v-if="blogs.edges.length == 0">
<h2 class="inlibe-flex mx-auto text-gray-700 w-3/4">No results</h2>
</div>
<div class="pagination flex justify-center mb-8"> <div class="pagination flex justify-center mb-8">
<Pagination <Pagination
:baseUrl="baseurl" :baseUrl="baseurl"
@@ -36,7 +38,7 @@
<page-query> <page-query>
query($page: Int){ query($page: Int){
entries: allBlog(perPage: 10, page: $page, sortBy: "created", order: DESC, filter: {category: { id: {in: ["blockchain", "experience", "technology", "farming", "community", "infrastructure", "impact"]}}}) @paginate{ entries: allBlog(perPage: 10, page: $page, sortBy: "created", order: DESC, filter: {category: { contains: ["foundation"]}}) @paginate{
totalCount totalCount
pageInfo { pageInfo {
totalPages totalPages
@@ -69,7 +71,7 @@ query($page: Int){
} }
} }
topics: allBlogTag(filter: { title: {in: ["blockchain", "experience", "technology", "farming", "community", "infrastructure", "impact"]}}) { topics: allBlogTag {
edges{ edges{
node{ node{
title title

View File

@@ -16,7 +16,6 @@
> >
<div class="flex flex-wrap news pt-12 mt-8 pb-8 mx-4 sm:-mx-4"> <div class="flex flex-wrap news pt-12 mt-8 pb-8 mx-4 sm:-mx-4">
<PostListItem <PostListItem
:showtags="true"
v-for="edge in news.edges" v-for="edge in news.edges"
:key="edge.node.id" :key="edge.node.id"
:record="edge.node" :record="edge.node"
@@ -40,7 +39,7 @@
<page-query> <page-query>
query($page: Int){ query($page: Int){
entries: allNews(perPage: 10, page: $page, sortBy: "created", order: DESC, filter: {tags: { id: {in: ["blockchain", "experience", "technology", "farming", "community", "infrastructure", "impact"]}}}) @paginate{ entries: allNews(perPage: 10, page: $page, sortBy: "created", order: DESC, filter: {category: { contains: ["foundation"]}}) @paginate{
totalCount totalCount
pageInfo { pageInfo {
totalPages totalPages

View File

@@ -11,9 +11,7 @@
{{ $page.membership.title.replace("_", " ") }} {{ $page.membership.title.replace("_", " ") }}
</h1> </h1>
<p class="text-gray-700 text-xl"> <p class="text-gray-700 text-xl">
<span class="self-center" <span class="self-center">{{ items.length }} People</span>
>{{ $page.membership.belongsTo.totalCount }} People</span
>
</p> </p>
</div> </div>
@@ -21,9 +19,10 @@
<div class="flex flex-wrap with-large pt-8 pb-8 mx-4 sm:-mx-4"> <div class="flex flex-wrap with-large pt-8 pb-8 mx-4 sm:-mx-4">
<PostListItem <PostListItem
v-for="edge in $page.membership.belongsTo.edges" :showtags="true"
:key="edge.node.id" v-for="item in items"
:record="edge.node" :key="item.id"
:record="item"
/> />
</div> </div>
</div> </div>
@@ -57,6 +56,7 @@
cities cities
private private
image image
category
} }
} }
} }
@@ -94,6 +94,14 @@ export default {
); );
return res; return res;
}, },
items() {
let foundationItems = [];
this.$page.membership.belongsTo.edges.map((edge) => {
if (edge.node.category.includes("foundation"))
foundationItems.push(edge.node);
});
return foundationItems;
},
}, },
metaInfo() { metaInfo() {

View File

@@ -8,6 +8,7 @@
<div class="container mt-8 sm:pxi-0 mx-auto overflow-x-hidden"> <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"> <div class="flex flex-wrap with-large pt-8 pb-8 mx-4 sm:-mx-4">
<PostListItem <PostListItem
:showtags="true"
v-for="partner in $page.entries.edges" v-for="partner in $page.entries.edges"
:key="partner.id" :key="partner.id"
:record="partner.node" :record="partner.node"
@@ -39,6 +40,12 @@ query ($private: Int){
image(width:800) image(width:800)
timeToRead timeToRead
logo logo
category
tags{
id
path
title
}
} }
} }
} }

View File

@@ -1,6 +1,8 @@
<template> <template>
<Layout :hideHeader="true" :disableScroll="true"> <Layout :hideHeader="true" :disableScroll="true">
<div class="container sm:pxi-0 mx-auto min-h-screen overflow-x-hidden pt-24"> <div
class="container sm:pxi-0 mx-auto min-h-screen overflow-x-hidden pt-24"
>
<div class="flex flex-row flex-wrap items-center mx-4 sm:mx-0"> <div class="flex flex-row flex-wrap items-center mx-4 sm:mx-0">
<div class="w-full md:w-1/6 mx-auto sm:mx-0"> <div class="w-full md:w-1/6 mx-auto sm:mx-0">
<g-image <g-image
@@ -24,9 +26,7 @@
<p class="text-gray-700 text-xl" v-if="$page.person.bio"> <p class="text-gray-700 text-xl" v-if="$page.person.bio">
{{ $page.person.bio }} {{ $page.person.bio }}
</p> </p>
<div class="author-social"> <div class="author-social"></div>
</div>
<section> <section>
<div class="avatars"> <div class="avatars">
<div class="flex items-center"> <div class="flex items-center">
@@ -47,9 +47,15 @@
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
</div> </div>
<g-link
v-for="edge in $page.memberships.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"
>{{ edge.node.title }}</g-link
>
</section> </section>
</div> </div>
</div> </div>
@@ -66,16 +72,14 @@
</section> </section>
<div class="pt-8 border-b mx-4 sm:-mx-4"></div> <div class="pt-8 border-b mx-4 sm:-mx-4"></div>
<!--
<div class="flex flex-wrap pt-8 pb-8 mx-4 sm:-mx-4"> <div class="flex flex-wrap pt-8 pb-8 mx-4 sm:-mx-4">
<PostListItem <PostListItem
v-for="edge in $page.person.belongsTo.edges" v-for="edge in $page.person.belongsTo.edges"
:key="edge.node.id" :key="edge.node.id"
:record="edge.node" :record="edge.node"
/> />
</div> </div> -->
</div> </div>
</Layout> </Layout>
</template> </template>
@@ -87,11 +91,11 @@
content content
name name
rank rank
# memberships{ memberships{
# id id
# title title
# path path
# } }
projects{ projects{
id id
title title
@@ -144,15 +148,15 @@
} }
} }
# memberships: allMembership(filter: {title: {in: ["foundation", "tech"]}}){ memberships: allMembership(filter: {title: {in: ["foundation", "tech", "farmers", "ambassadors"]}}){
# edges{ edges{
# node{ node{
# id id
# title title
# path path
# } }
# } }
# } }
} }
</page-query> </page-query>
@@ -172,16 +176,16 @@ export default {
}, },
memberships() { memberships() {
var all = [] var all = [];
this.$page.memberships.edges.forEach((edgs) => all.push(edge.node.title)) this.$page.memberships.edges.forEach((edgs) => all.push(edge.node.title));
var res = [] var res = [];
this.$page.person.memberships.forEach(function (membership) { this.$page.person.memberships.forEach(function (membership) {
if (all.includes(membership.title)) { if (all.includes(membership.title)) {
res.push(membership) res.push(membership);
} }
}); });
return res return res;
} },
}, },
metaInfo() { metaInfo() {
return { return {

View File

@@ -1,6 +1,6 @@
<template> <template>
<Layout :hideHeader="true" :disableScroll="true"> <Layout :hideHeader="true" :disableScroll="true">
<div class="container sm:pxi-0 mx-auto overflow-x-hidden px-4 pt-24"> <div class="container sm:pxi-0 mx-auto overflow-x-hidden pt-24">
<div class="flex flex-row flex-wrap items-center mx-4 sm:mx-0"> <div class="flex flex-row flex-wrap items-center mx-4 sm:mx-0">
<div class="w-full md:w-1/6 mx-auto sm:mx-0"> <div class="w-full md:w-1/6 mx-auto sm:mx-0">
<g-image <g-image
@@ -11,14 +11,14 @@
<div class="w-full md:w-5/6 text-center md:text-left md:pl-8 lg:pl-0"> <div class="w-full md:w-5/6 text-center md:text-left md:pl-8 lg:pl-0">
<h1 class="pb-0 mb-0 mt-0 text-4xl font-medium"> <h1 class="pb-0 mb-0 mt-0 text-4xl font-medium">
{{ $page.project.title }} {{ $page.project.title }}
<a <!-- <a
:href="$page.project.linkedin" :href="$page.project.linkedin"
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
class="text-gray-400 hover:text-black" class="text-gray-400 hover:text-black"
> >
<font-awesome :icon="['fab', 'linkedin']" /> <font-awesome :icon="['fab', 'linkedin']" />
</a> </a> -->
</h1> </h1>
<p class="text-gray-700 text-xl" v-if="$page.project.bio"> <p class="text-gray-700 text-xl" v-if="$page.project.bio">
@@ -35,7 +35,7 @@
:key="member.id" :key="member.id"
class="author-list-item" class="author-list-item"
> >
<g-link :to="member.path" v-tooltip="member.name"> <g-link :to="member.path">
<g-image <g-image
:src="member.image" :src="member.image"
:alt="member.name" :alt="member.name"
@@ -48,13 +48,42 @@
</div> </div>
</div> </div>
</section> </section>
<section class="post-tags container mx-auto relative py-5"> <section class="container mx-auto py-2">
<ul class="list-none flex author-list m-0">
<!-- <li class="mx-2">
<g-image
:src="$page.project.logo"
class="rounded-full bg-gray-200 w-8 h-8 border-2 border-gray-400 mx-auto md:mx-0"
></g-image>
</li> -->
<li>
<a
:href="$page.project.websites"
target="_blank"
rel="noopener noreferrer"
class="text-gray-400 hover:text-black linkedin_size mx-1"
>
<font-awesome :icon="['fas', 'globe']" />
</a>
</li>
<li>
<a
:href="$page.project.linkedin"
target="_blank"
rel="noopener noreferrer"
class="text-gray-400 hover:text-black linkedin_size mx-1"
>
<font-awesome :icon="['fab', 'linkedin']" />
</a>
</li>
</ul>
<g-link <g-link
v-for="edge in $page.tags.edges" v-for="tag in $page.project.tags"
:key="edge.node.id" :key="tag.id"
:to="edge.node.path" :to="tag.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" 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"
>{{ edge.node.title }}</g-link >{{ tag.title }}</g-link
> >
</section> </section>
</div> </div>
@@ -127,6 +156,11 @@
path path
logo logo
image image
tags {
id
title
path
}
} }
} }
} }
@@ -134,7 +168,7 @@
} }
} }
tags: allProjectTag (filter: { title: {in: ["tech", "foundation"]}}) { tags: allProjectTag (filter: { title: {in: ["foundation"]}}) {
edges{ edges{
node{ node{
id id
@@ -143,8 +177,6 @@
} }
} }
} }
} }
</page-query> </page-query>
@@ -153,7 +185,6 @@
import PostListItem from "~/components/custom/Cards/PostListItem.vue"; import PostListItem from "~/components/custom/Cards/PostListItem.vue";
import Pagination from "~/components/custom/Pagination.vue"; import Pagination from "~/components/custom/Pagination.vue";
export default { export default {
components: { components: {
Pagination, Pagination,
@@ -178,4 +209,8 @@ export default {
font-family: "Roboto", sans-serif; font-family: "Roboto", sans-serif;
font-weight: 300; font-weight: 300;
} }
.linkedin_size {
font-size: 2rem !important;
}
</style> </style>

View File

@@ -12,9 +12,7 @@
{{ tags.title }} {{ tags.title }}
</h1> </h1>
<p class="text-gray-700 text-xl"> <p class="text-gray-700 text-xl">
<span class="self-center" <span class="self-center">{{ items.length }} {{ item }}</span>
>{{ tags.belongsTo.totalCount }} {{ item }}</span
>
</p> </p>
</div> </div>
@@ -22,6 +20,7 @@
<div class="flex flex-wrap pt-8 pb-8 mx-4 sm:-mx-4"> <div class="flex flex-wrap pt-8 pb-8 mx-4 sm:-mx-4">
<PostListItem <PostListItem
:showtags="true"
v-for="edge in tags.belongsTo.edges" v-for="edge in tags.belongsTo.edges"
:key="edge.node.id" :key="edge.node.id"
:record="edge.node" :record="edge.node"
@@ -60,7 +59,11 @@
image(width:800) image(width:800)
path path
datetime : created datetime : created
tags{
id
path
title
}
} }
} }
} }
@@ -139,7 +142,7 @@
} }
} }
allNewsTag(filter: { title: {in: ["blockchain", "experience", "technology", "farming", "community", "infrastructure", "impact"]}}){ allNewsTag{
edges{ edges{
node{ node{
id id
@@ -149,7 +152,7 @@
} }
} }
allBlogTag(filter: { title: {in: ["blockchain", "experience", "technology", "farming", "community", "infrastructure", "impact"]}}){ allBlogTag{
edges{ edges{
node{ node{
id id
@@ -219,6 +222,18 @@ export default {
return "post"; return "post";
} }
}, },
items() {
let foundationItems = [];
this.tags.belongsTo.edges.map((edge) => {
if (Array.isArray(edge.node.category)) {
if (edge.node.category.includes("foundation"))
foundationItems.push(edge.node);
} else {
foundationItems.push(edge.node);
}
});
return foundationItems;
},
}, },
methods: { methods: {

View File

@@ -1,9 +1,14 @@
<template> <template>
<Layout> <Layout>
<TagFilterHeader :tags="memberships" selected="all" v-if="$page.memberships.edges.length > 1"/> <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="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"> <div class="flex flex-wrap with-large pt-8 pb-8 mx-4 sm:-mx-4">
<PostListItem <PostListItem
:showtags="true"
v-for="person in $page.entries.edges" v-for="person in $page.entries.edges"
:key="person.id" :key="person.id"
:record="person.node" :record="person.node"
@@ -15,7 +20,7 @@
<page-query> <page-query>
query ($private: Int){ query ($private: Int){
entries: allPerson (sortBy: "rank", order: ASC, filter: { private: { ne: $private }, category: { contains: ["foundation"]}, memberships: { id: {in: ["cofounders", "tech", "foundation", "ambassadors", "matchmakers", "farmers", "aci_members", "partners", "wisdom_council", "technology_council", "grid_guardians"]}}}){ entries: allPerson (sortBy: "rank", order: ASC, filter: { private: { ne: $private }, category: { contains: ["foundation"]}}){
totalCount totalCount
edges { edges {
node { node {
@@ -31,6 +36,11 @@ query ($private: Int){
cities cities
image(width:800) image(width:800)
private private
memberships {
id
path
title
}
} }
} }
} }