ourworld_web/www_threefold_io
23
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Replace linkedin menu

Browse Source
This commit is contained in:
samaradel
2020-11-15 11:30:11 +02:00
parent 39870c7b71
commit bf233875e9
2 changed files with 88 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
src/templates/Person.vue
View File

@@ -9,9 +9,21 @@
></g-image> ></g-image>
</div> </div>
<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">{{ $page.person.name }}</h1> <h1 class="pb-0 mb-0 mt-0 text-4xl font-medium">
{{ $page.person.name }}
<p class="text-gray-700 text-xl" v-if="$page.person.bio">{{ $page.person.bio }}</p> <a
:href="$page.person.linkedin"
target="_blank"
rel="noopener noreferrer"
class="text-gray-400 hover:text-black"
>
<font-awesome :icon="['fab', 'linkedin']" />
</a>
</h1>
<p class="text-gray-700 text-xl" v-if="$page.person.bio">
{{ $page.person.bio }}
</p>
<div class="author-social"> <div class="author-social">
{{ $page.person.belongsTo.totalCount }} Projects {{ $page.person.belongsTo.totalCount }} Projects
&nbsp;&middot;&nbsp; &nbsp;&middot;&nbsp;
@@ -33,23 +45,20 @@
<font-awesome :icon="['fab', 'twitter']" /> <font-awesome :icon="['fab', 'twitter']" />
</a> </a>
&nbsp; --> &nbsp; -->
<a
:href="$page.person.linkedin"
target="_blank"
rel="noopener noreferrer"
class="text-gray-400 hover:text-black"
>
<font-awesome :icon="['fab', 'linkedin']" />
</a>
</div> </div>
</div> </div>
</div> </div>
<div class="pt-8 border-b mx-4 sm:-mx-4"></div> <div class="pt-8 border-b mx-4 sm:-mx-4"></div>
<section class="post-content container mx-auto relative font-serif text-gray-700"> <section
<div class="post-content-text text-xl" v-html="$page.person.content"></div> class="post-content container mx-auto relative font-serif text-gray-700"
</section> >
<div
class="post-content-text text-xl"
v-html="$page.person.content"
></div>
</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>
@@ -142,18 +151,18 @@ import Pagination from "~/components/Pagination.vue";
export default { export default {
components: { components: {
Pagination, Pagination,
PostListItem PostListItem,
}, },
computed: { computed: {
postLabel: function() { postLabel: function () {
var pluralize = require("pluralize"); var pluralize = require("pluralize");
return pluralize("post", this.$page.person.belongsTo.totalCount); return pluralize("post", this.$page.person.belongsTo.totalCount);
} },
}, },
metaInfo() { metaInfo() {
return { return {
title: this.$page.person.name title: this.$page.person.name,
}; };
} },
}; };
</script> </script>

121
src/templates/Project.vue
View File

@@ -9,14 +9,8 @@
></g-image> ></g-image>
</div> </div>
<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">{{ $page.project.title }}</h1> <h1 class="pb-0 mb-0 mt-0 text-4xl font-medium">
{{ $page.project.title }}
<p class="text-gray-700 text-xl" v-if="$page.project.bio">{{ $page.project.bio }}</p>
<div class="avatars">
<div class="flex items-center">
<div class="author-social">
<a <a
:href="$page.project.linkedin" :href="$page.project.linkedin"
target="_blank" target="_blank"
@@ -25,56 +19,62 @@
> >
<font-awesome :icon="['fab', 'linkedin']" /> <font-awesome :icon="['fab', 'linkedin']" />
</a> </a>
</h1>
<p class="text-gray-700 text-xl" v-if="$page.project.bio">
{{ $page.project.bio }}
</p>
<div class="avatars">
<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">
<li
v-for="member in $page.project.members"
:key="member.id"
class="author-list-item"
>
<g-link :to="member.path" v-tooltip="member.name">
<g-image
:src="member.image"
:alt="member.name"
class="w-8 h-8 rounded-full bg-gray-200 border-2 border-white"
/>
</g-link>
</li>
</ul>
</div>
</div>
</div>
</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"
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
>
</section>
</div> </div>
</div>
<section>
<br/>
<div class="avatars">
<div class="flex items-center">
<div class="flex justify-between items-center">
<ul class="list-none flex author-list m-0">
<li
v-for="member in $page.project.members"
:key="member.id"
class="author-list-item"
>
<g-link :to="member.path" v-tooltip="member.name">
<g-image
:src="member.image"
:alt="member.name"
class="w-8 h-8 rounded-full bg-gray-200 border-2 border-white"
/>
</g-link>
</li>
</ul>
</div>
</div>
</div>
</section>
<section class="post-tags container mx-auto relative py-10">
<g-link
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"
>{{ tag.title }}</g-link>
</section>
</div>
</div> </div>
</div> </div>
<div class="pt-8 border-b mx-4 sm:-mx-4"></div> <div class="pt-8 border-b mx-4 sm:-mx-4"></div>
<section class="post-content container mx-auto relative text-gray-700"> <section class="post-content container mx-auto relative text-gray-700">
<div class="post-content-text text-xl" v-html="$page.project.content"></div> <div
</section> class="post-content-text text-xl"
v-html="$page.project.content"
></div>
</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>
<br/> <br />
<section> <section>
<div class="avatars"> <div class="avatars">
<div class="flex items-center"> <div class="flex items-center">
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<ul class="list-none flex author-list m-0"> <ul class="list-none flex author-list m-0">
<li <li
@@ -82,13 +82,12 @@
:key="author.id" :key="author.id"
class="author-list-item" class="author-list-item"
> >
<g-link :to="author.path" v-tooltip="author.name"> <g-link :to="author.path" v-tooltip="author.name">
<g-image <g-image
:src="author.image" :src="author.image"
:alt="author.name" :alt="author.name"
class="w-8 h-8 rounded-full bg-gray-200 border-2 border-white" class="w-8 h-8 rounded-full bg-gray-200 border-2 border-white"
/> />
</g-link> </g-link>
</li> </li>
</ul> </ul>
@@ -112,9 +111,9 @@
{{ $page.project.status }} {{ $page.project.status }}
</p> </p>
</div> </div>
</div> </div>
</div> </div>
</section> </section>
<div class="pagination flex justify-center mb-8"> <div class="pagination flex justify-center mb-8">
<Pagination <Pagination
:baseUrl="$page.project.path" :baseUrl="$page.project.path"
@@ -196,19 +195,19 @@ import Pagination from "~/components/Pagination.vue";
export default { export default {
components: { components: {
Pagination, Pagination,
PostListItem PostListItem,
}, },
computed: { computed: {
postLabel: function() { postLabel: function () {
var pluralize = require("pluralize"); var pluralize = require("pluralize");
return pluralize("post", this.$page.project.belongsTo.totalCount); return pluralize("post", this.$page.project.belongsTo.totalCount);
} },
}, },
metaInfo() { metaInfo() {
return { return {
title: this.$page.project.title title: this.$page.project.title,
}; };
} },
}; };
</script> </script>
<style scoped> <style scoped>