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"
>
<g-link
v-for="membership in memberships"
v-for="membership in record.memberships"
:key="membership.id"
: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"
@@ -74,8 +74,8 @@
v-for="tag in record.tags"
:key="tag.id"
: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"
>{{ tag.title }}</g-link
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.replace("_", " ") }}</g-link
>
</section>
</div>
@@ -101,20 +101,6 @@ export default {
if (this.pathPrefix) return this.pathPrefix + "/" + this.record.id;
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: {
displaytags() {

View File

@@ -49,7 +49,7 @@
@click="setActive(0)"
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
fill="currentColor"
viewBox="0 0 20 20"
@@ -84,12 +84,12 @@
<a
v-for="topic in topics"
: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="
setTopic(topic);
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>

View File

@@ -20,7 +20,9 @@
:record="post.node"
/>
</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">
<Pagination
:baseUrl="baseurl"
@@ -36,7 +38,7 @@
<page-query>
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
pageInfo {
totalPages
@@ -69,7 +71,7 @@ query($page: Int){
}
}
topics: allBlogTag(filter: { title: {in: ["blockchain", "experience", "technology", "farming", "community", "infrastructure", "impact"]}}) {
topics: allBlogTag {
edges{
node{
title

View File

@@ -16,7 +16,6 @@
>
<div class="flex flex-wrap news pt-12 mt-8 pb-8 mx-4 sm:-mx-4">
<PostListItem
:showtags="true"
v-for="edge in news.edges"
:key="edge.node.id"
:record="edge.node"
@@ -40,7 +39,7 @@
<page-query>
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
pageInfo {
totalPages

View File

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

View File

@@ -8,6 +8,7 @@
<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
:showtags="true"
v-for="partner in $page.entries.edges"
:key="partner.id"
:record="partner.node"
@@ -39,6 +40,12 @@ query ($private: Int){
image(width:800)
timeToRead
logo
category
tags{
id
path
title
}
}
}
}

View File

@@ -1,6 +1,8 @@
<template>
<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="w-full md:w-1/6 mx-auto sm:mx-0">
<g-image
@@ -24,33 +26,37 @@
<p class="text-gray-700 text-xl" v-if="$page.person.bio">
{{ $page.person.bio }}
</p>
<div class="author-social">
</div>
<section>
<div class="avatars">
<div class="flex items-center">
<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.projects"
:key="project.id"
class="author-list-item"
>
<g-link :to="project.path" v-tooltip="project.title">
<g-image
:src="project.logo"
:alt="project.title"
class="w-20 h-20 rounded-full bg-gray-200 border-2 border-white"
/>
</g-link>
</li>
</ul>
<div class="author-social"></div>
<section>
<div class="avatars">
<div class="flex items-center">
<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.projects"
:key="project.id"
class="author-list-item"
>
<g-link :to="project.path" v-tooltip="project.title">
<g-image
:src="project.logo"
:alt="project.title"
class="w-20 h-20 rounded-full bg-gray-200 border-2 border-white"
/>
</g-link>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
<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>
</div>
</div>
@@ -66,16 +72,14 @@
</section>
<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">
<PostListItem
v-for="edge in $page.person.belongsTo.edges"
:key="edge.node.id"
:record="edge.node"
/>
</div>
</div> -->
</div>
</Layout>
</template>
@@ -87,11 +91,11 @@
content
name
rank
# memberships{
# id
# title
# path
# }
memberships{
id
title
path
}
projects{
id
title
@@ -144,16 +148,16 @@
}
}
# memberships: allMembership(filter: {title: {in: ["foundation", "tech"]}}){
# edges{
# node{
# id
# title
# path
# }
# }
# }
}
memberships: allMembership(filter: {title: {in: ["foundation", "tech", "farmers", "ambassadors"]}}){
edges{
node{
id
title
path
}
}
}
}
</page-query>
<script>
@@ -171,17 +175,17 @@ export default {
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)
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
}
return res;
},
},
metaInfo() {
return {

View File

@@ -1,6 +1,6 @@
<template>
<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="w-full md:w-1/6 mx-auto sm:mx-0">
<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">
<h1 class="pb-0 mb-0 mt-0 text-4xl font-medium">
{{ $page.project.title }}
<a
<!-- <a
:href="$page.project.linkedin"
target="_blank"
rel="noopener noreferrer"
class="text-gray-400 hover:text-black"
>
<font-awesome :icon="['fab', 'linkedin']" />
</a>
</a> -->
</h1>
<p class="text-gray-700 text-xl" v-if="$page.project.bio">
@@ -35,7 +35,7 @@
:key="member.id"
class="author-list-item"
>
<g-link :to="member.path" v-tooltip="member.name">
<g-link :to="member.path">
<g-image
:src="member.image"
:alt="member.name"
@@ -48,13 +48,42 @@
</div>
</div>
</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
v-for="edge in $page.tags.edges"
:key="edge.node.id"
:to="edge.node.path"
v-for="tag in $page.project.tags"
:key="tag.id"
: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"
>{{ edge.node.title }}</g-link
>{{ tag.title }}</g-link
>
</section>
</div>
@@ -127,6 +156,11 @@
path
logo
image
tags {
id
title
path
}
}
}
}
@@ -134,17 +168,15 @@
}
}
tags: allProjectTag (filter: { title: {in: ["tech", "foundation"]}}) {
tags: allProjectTag (filter: { title: {in: ["foundation"]}}) {
edges{
node{
id
title
path
}
}
}
}
}
</page-query>
@@ -153,7 +185,6 @@
import PostListItem from "~/components/custom/Cards/PostListItem.vue";
import Pagination from "~/components/custom/Pagination.vue";
export default {
components: {
Pagination,
@@ -178,4 +209,8 @@ export default {
font-family: "Roboto", sans-serif;
font-weight: 300;
}
.linkedin_size {
font-size: 2rem !important;
}
</style>

View File

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

View File

@@ -1,9 +1,14 @@
<template>
<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="flex flex-wrap with-large pt-8 pb-8 mx-4 sm:-mx-4">
<PostListItem
:showtags="true"
v-for="person in $page.entries.edges"
:key="person.id"
:record="person.node"
@@ -15,7 +20,7 @@
<page-query>
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
edges {
node {
@@ -31,11 +36,16 @@ query ($private: Int){
cities
image(width:800)
private
memberships {
id
path
title
}
}
}
}
memberships: allMembership(filter: {title: {in:["cofounders", "tech", "foundation", "ambassadors", "matchmakers", "farmers", "aci_members", "partners", "wisdom_council", "technology_council", "grid_guardians"]}}){
memberships: allMembership(filter: {title: {in: ["cofounders", "tech", "foundation", "ambassadors", "matchmakers", "farmers", "aci_members", "partners", "wisdom_council", "technology_council", "grid_guardians"]}}){
edges{
node{
id