mirror of
https://github.com/ipfs/ipfs-blog.git
synced 2026-03-28 17:32:37 +01:00
feat: blog card iterative load
This commit is contained in:
Ricardo
5
package-lock.json
generated
5
package-lock.json
generated
@@ -18379,6 +18379,11 @@
|
||||
"resolved": "https://registry.npmjs.org/vue-multiselect/-/vue-multiselect-2.1.6.tgz",
|
||||
"integrity": "sha512-s7jmZPlm9FeueJg1RwJtnE9KNPtME/7C8uRWSfp9/yEN4M8XcS/d+bddoyVwVnvFyRh9msFo0HWeW0vTL8Qv+w=="
|
||||
},
|
||||
"vue-observe-visibility": {
|
||||
"version": "0.4.6",
|
||||
"resolved": "https://registry.npmjs.org/vue-observe-visibility/-/vue-observe-visibility-0.4.6.tgz",
|
||||
"integrity": "sha512-xo0CEVdkjSjhJoDdLSvoZoQrw/H2BlzB5jrCBKGZNXN2zdZgMuZ9BKrxXDjNP2AxlcCoKc8OahI3F3r3JGLv2Q=="
|
||||
},
|
||||
"vue-property-decorator": {
|
||||
"version": "8.5.1",
|
||||
"resolved": "https://registry.npmjs.org/vue-property-decorator/-/vue-property-decorator-8.5.1.tgz",
|
||||
|
||||
@@ -74,6 +74,7 @@
|
||||
"v-scroll-lock": "^1.3.1",
|
||||
"vue-mq": "^1.0.1",
|
||||
"vue-multiselect": "^2.1.6",
|
||||
"vue-observe-visibility": "^0.4.6",
|
||||
"vuepress-plugin-img-lazy": "^1.0.4",
|
||||
"vuex": "^3.5.1"
|
||||
}
|
||||
|
||||
@@ -35,9 +35,19 @@ module.exports = {
|
||||
themeConfig: {
|
||||
dateFormat: 'DD MMMM YYYY',
|
||||
socialLinks: [
|
||||
{
|
||||
text: 'Github',
|
||||
link: 'https://github.com/ipfs',
|
||||
icon: 'github-icon',
|
||||
},
|
||||
{
|
||||
text: 'YouTube',
|
||||
link: 'https://www.youtube.com/channel/UCdjsUXJ3QawK4O5L1kqqsew',
|
||||
icon: 'youtube-icon',
|
||||
},
|
||||
{
|
||||
text: 'Twitter',
|
||||
link: 'https://twitter.com/protocollabs',
|
||||
link: 'http://twitter.com/ipfs',
|
||||
icon: 'twitter-icon',
|
||||
},
|
||||
{
|
||||
@@ -45,13 +55,21 @@ module.exports = {
|
||||
link: 'https://www.linkedin.com/company/protocollabs/',
|
||||
icon: 'linkedin-icon',
|
||||
},
|
||||
],
|
||||
footerLinks: [
|
||||
{ text: 'Blog & News', link: '/' },
|
||||
{ text: 'Press', link: 'https://ipfs.io/media/' },
|
||||
{
|
||||
text: 'YouTube',
|
||||
link: 'https://www.youtube.com/ProtocolLabs/',
|
||||
icon: 'youtube-icon',
|
||||
text: 'Code of Conduct',
|
||||
link:
|
||||
'https://github.com/ipfs/community/blob/master/code-of-conduct.md',
|
||||
},
|
||||
{
|
||||
text: 'Security',
|
||||
link:
|
||||
'https://github.com/ipfs/community/blob/master/CONTRIBUTING.md#security-issues',
|
||||
},
|
||||
],
|
||||
footerLinks: [],
|
||||
footerLegal: '',
|
||||
headerLinks: [
|
||||
{ text: 'About', link: 'https://ipfs.io/#why' },
|
||||
|
||||
@@ -2,224 +2,55 @@
|
||||
<footer class="footer bg-gradient-6 text-white py-8 md:py-16">
|
||||
<div class="grid grid-cols-12 grid-margins">
|
||||
<NewsletterForm class="col-start-1 col-span-12 pb-20" />
|
||||
<div class="col-start-1 col-span-12 flex justify-between">
|
||||
<div class="">
|
||||
<ul class="">
|
||||
<li class="sitemap-head">Protocol Labs</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://protocol.ai"
|
||||
>About</a
|
||||
<div class="col-start-2 md:col-start-1 col-span-10 md:col-span-12">
|
||||
<div class="flex flex-col md:flex-row md:items-top md:justify-between">
|
||||
<div class="flex flex-col md:flex-row md:items-center mb-8 md:mb-0">
|
||||
<ul class="flex flex-col md:flex-row mt-8 md:mt-0">
|
||||
<li
|
||||
v-for="(item, index) in footerLinks"
|
||||
:key="'link-' + index"
|
||||
class="md:mr-10 last:mr-0"
|
||||
:class="[{ 'mb-4': item.children && item.children.length }]"
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://protocol.ai/join"
|
||||
>Join</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="grid-flex-cell">
|
||||
<ul class="">
|
||||
<li class="sitemap-head">IPFS</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://ipfs.io/#install"
|
||||
>Install</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://github.com/ipfs/ipfs"
|
||||
>GitHub</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://github.com/ipfs/community/blob/master/code-of-conduct.md"
|
||||
>Code of Conduct</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://docs.ipfs.io/"
|
||||
>Docs</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://docs.ipfs.io/community/"
|
||||
>Community</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://ipfs.io/help"
|
||||
>Help</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://awesome.ipfs.io/"
|
||||
>Awesome IPFS</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://cluster.ipfs.io/"
|
||||
>IPFS Cluster</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://ipfs.io/team"
|
||||
>Team</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://ipfs.io/media"
|
||||
>Media</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-blueGreen hover:text-white" href="//blog.ipfs.io/"
|
||||
>Blog</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://ipfs.io/legal/"
|
||||
>Legal</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="grid-flex-cell">
|
||||
<ul class="">
|
||||
<li class="sitemap-head">ProtoSchool</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://proto.school/#/tutorials"
|
||||
>Tutorials</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://proto.school/#/chapters"
|
||||
>Chapters</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="grid-flex-cell">
|
||||
<ul class="">
|
||||
<li class="sitemap-head">Filecoin</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://filecoin.io/"
|
||||
>About</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://filecoin.io/faqs/"
|
||||
>FAQ</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="">
|
||||
<li class="sitemap-head" style="padding-top: 30px">
|
||||
Other Projects
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://libp2p.io/"
|
||||
>libp2p</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-blueGreen hover:text-white" href="https://ipld.io/"
|
||||
>IPLD</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://drand.love/"
|
||||
>Drand</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://multiformats.io/"
|
||||
>Multiformats</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="http://testground.ai/"
|
||||
>Testground</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="share-links">
|
||||
<ul class="share list-unstyled">
|
||||
<NavLink
|
||||
:item="item"
|
||||
class="type-p3 hover:opacity-75 transition transition-opacity duration-300 ease-in-out font-semibold"
|
||||
/>
|
||||
<ul
|
||||
v-if="item.children && item.children.length"
|
||||
class="mt-4 mb-4"
|
||||
>
|
||||
<li
|
||||
v-for="(childItem, childIndex) in item.children"
|
||||
:key="'link-child' + childIndex"
|
||||
class="mb-2 last:mb-0"
|
||||
>
|
||||
<NavLink
|
||||
:item="childItem"
|
||||
class="type-p4 hover:opacity-75 transition transition-opacity duration-300 ease-in-out"
|
||||
/>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<SocialLinks class="flex items-center" />
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="col-start-1 col-span-12">
|
||||
<center>
|
||||
© Protocol Labs | Except as
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://protocol.ai/legal/"
|
||||
>noted</a
|
||||
>, content licensed
|
||||
<a
|
||||
class="text-blueGreen hover:text-white"
|
||||
href="https://creativecommons.org/licenses/by/3.0/"
|
||||
>CC-BY 3.0.</a
|
||||
>
|
||||
</center>
|
||||
</div>
|
||||
<FooterLegal class="mt-8" />
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SocialLinks from '@theme/components/SocialLinks'
|
||||
import FooterLegal from '@theme/components/FooterLegal'
|
||||
import NavLink from '@theme/components/NavLink.vue'
|
||||
import NewsletterForm from '@theme/components/blog/NewsletterForm'
|
||||
|
||||
export default {
|
||||
name: 'Footer',
|
||||
components: { SocialLinks, NewsletterForm },
|
||||
components: { SocialLinks, NewsletterForm, NavLink, FooterLegal },
|
||||
computed: {
|
||||
footerLinks() {
|
||||
return this.$site.themeConfig.footerLinks
|
||||
|
||||
51
src/.vuepress/theme/components/FooterLegal.vue
Normal file
51
src/.vuepress/theme/components/FooterLegal.vue
Normal file
@@ -0,0 +1,51 @@
|
||||
<template>
|
||||
<div class="flex items-center">
|
||||
<a href="https://protocol.ai" target="_blank" class="mr-1"
|
||||
><SVGIcon
|
||||
name="logo-icon"
|
||||
title="Protocol Labs"
|
||||
:class-list="['w-4', 'h-4', 'fill-current']"
|
||||
/></a>
|
||||
<span
|
||||
>©
|
||||
<a
|
||||
class="text-blueGreen hover:underline"
|
||||
href="https://protocol.ai"
|
||||
target="_blank"
|
||||
>Protocol Labs</a
|
||||
>
|
||||
| Except as
|
||||
<a
|
||||
class="text-blueGreen hover:underline"
|
||||
href="https://ipfs.io/legal#report-copyright-infringement-on-the-ipfs-gateway-service"
|
||||
>noted</a
|
||||
>, content licensed
|
||||
<a
|
||||
class="text-blueGreen hover:underline"
|
||||
href="https://creativecommons.org/licenses/by/3.0/"
|
||||
>CC-BY 3.0</a
|
||||
>
|
||||
|
|
||||
<a
|
||||
class="text-blueGreen hover:underline"
|
||||
href="https://ipfs.io/legal#terms-of-service"
|
||||
>Terms</a
|
||||
>
|
||||
|
|
||||
<a
|
||||
class="text-blueGreen hover:underline"
|
||||
href="https://ipfs.io/legal#privacy-policy"
|
||||
>Privacy</a
|
||||
></span
|
||||
>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SVGIcon from '@theme/components/base/SVGIcon.vue'
|
||||
|
||||
export default {
|
||||
name: 'FooterLegal',
|
||||
components: { SVGIcon },
|
||||
}
|
||||
</script>
|
||||
@@ -16,7 +16,7 @@
|
||||
<div class="flex justify-between items-center h-20">
|
||||
<a
|
||||
class="hover:opacity-75 transition transition-opacity duration-300 ease-in-out mobile-list-item"
|
||||
href="https://blog.ipfs.io/"
|
||||
href="https://ipfs.io/"
|
||||
>
|
||||
<SVGIcon
|
||||
name="ipfs-logo"
|
||||
|
||||
@@ -1,12 +1,26 @@
|
||||
<template>
|
||||
<div>
|
||||
<a
|
||||
class="rss-link flex items-center text-gray-dark transition-filter duration-700 ease-in-out"
|
||||
v-for="(link, index) in socialLinks"
|
||||
:key="index"
|
||||
class="mr-2"
|
||||
:href="link.link"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<SVGIcon
|
||||
class="w-6 h-6 opacity-50 hover:opacity-100 transition transition-opacity duration-300 ease-in-out"
|
||||
:name="link.icon"
|
||||
:title="link.text"
|
||||
/>
|
||||
</a>
|
||||
<a
|
||||
class="flex items-center text-gray-dark transition-filter duration-700 ease-in-out"
|
||||
href="/index.xml"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<SVGIcon
|
||||
class="rss-icon w-6 h-6 fill-current mr-2"
|
||||
class="w-6 h-6 opacity-50 hover:opacity-100 transition transition-opacity duration-300 ease-in-out"
|
||||
name="rss"
|
||||
title="rss"
|
||||
/>
|
||||
@@ -18,15 +32,19 @@ import SVGIcon from '@theme/components/base/SVGIcon'
|
||||
export default {
|
||||
name: 'RSSSubscription',
|
||||
components: { SVGIcon },
|
||||
data: () => ({
|
||||
socialLinks: [
|
||||
{
|
||||
text: 'Twitter',
|
||||
link: 'http://twitter.com/ipfs',
|
||||
icon: 'twitter-icon',
|
||||
},
|
||||
{
|
||||
text: 'YouTube',
|
||||
link: 'https://www.youtube.com/channel/UCdjsUXJ3QawK4O5L1kqqsew',
|
||||
icon: 'youtube-icon',
|
||||
},
|
||||
],
|
||||
}),
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="postcss" scoped>
|
||||
.rss-link {
|
||||
filter: grayscale(1);
|
||||
|
||||
&:hover {
|
||||
filter: grayscale(0);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
<template>
|
||||
<div
|
||||
v-if="activeTags.length || searchedText.length"
|
||||
v-if="
|
||||
activeTags.length || searchedText.length || activeCategory !== 'all types'
|
||||
"
|
||||
class="border border-opacity-10 flex items-center rounded px-1 py-2"
|
||||
>
|
||||
<span class="p-1">
|
||||
@@ -8,7 +10,7 @@
|
||||
<strong
|
||||
>{{ numberOfPosts }} result{{ numberOfPosts > 1 ? 's' : '' }}</strong
|
||||
>
|
||||
(newest first)
|
||||
(newest first) of {{ activeCategory }}
|
||||
<span v-if="searchedText.length">
|
||||
for "
|
||||
<span v-for="text in searchedText" :key="text" class=""
|
||||
@@ -43,6 +45,11 @@ export default {
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
activeCategory() {
|
||||
const queryCategory = this.$route.query.category
|
||||
|
||||
return queryCategory ? `type "${queryCategory}"` : 'all types'
|
||||
},
|
||||
activeTags() {
|
||||
const queryTags = this.$route.query.tags
|
||||
return queryTags ? queryTags.split(',') : []
|
||||
|
||||
@@ -15,7 +15,9 @@
|
||||
rel="noopener noreferrer"
|
||||
>RSS</a
|
||||
>, or social media.
|
||||
<RSSSubscription class="flex justify-end" />
|
||||
<div class="flex ml-2">
|
||||
<RSSSubscription class="flex justify-end" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -65,6 +65,10 @@ export default {
|
||||
...this.$route.query,
|
||||
tags,
|
||||
search: texts,
|
||||
category:
|
||||
this.selectedCat === this.categories[0]
|
||||
? undefined
|
||||
: this.selectedCat,
|
||||
}
|
||||
|
||||
this.$router.replace({ path: currentPath, query: newQuery })
|
||||
|
||||
@@ -1,7 +1,11 @@
|
||||
<template>
|
||||
<div class="grid-margins opacity-85">
|
||||
<LinksAndSocial />
|
||||
<SearchCategoriesAndTags class="mt-2" :tags="tags" />
|
||||
<SearchCategoriesAndTags
|
||||
class="mt-2"
|
||||
:tags="tags"
|
||||
:categories="categories"
|
||||
/>
|
||||
<ActiveTags :number-of-posts="numberOfPosts" class="mt-4" />
|
||||
</div>
|
||||
</template>
|
||||
@@ -19,6 +23,10 @@ export default {
|
||||
SearchCategoriesAndTags,
|
||||
},
|
||||
props: {
|
||||
categories: {
|
||||
type: Array,
|
||||
required: true,
|
||||
},
|
||||
tags: {
|
||||
type: Array,
|
||||
required: true,
|
||||
|
||||
@@ -4,6 +4,7 @@ import { createStore } from '@theme/store/store'
|
||||
import VScrollLock from 'v-scroll-lock'
|
||||
import VueMq from 'vue-mq'
|
||||
import { VLazyImagePlugin } from 'v-lazy-image'
|
||||
import VueObserveVisibility from 'vue-observe-visibility'
|
||||
|
||||
import Transition from '@theme/components/directives/Transition.js'
|
||||
|
||||
@@ -28,6 +29,7 @@ export default ({ Vue, router, siteData }) => {
|
||||
Vue.use(VScrollLock)
|
||||
Vue.use(VueMq, { breakpoints })
|
||||
Vue.use(VLazyImagePlugin)
|
||||
Vue.use(VueObserveVisibility)
|
||||
|
||||
Vue.directive(Transition.name, Transition.directive)
|
||||
|
||||
|
||||
@@ -13,27 +13,38 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="pt-8 bg-white">
|
||||
<SortAndFilter :number-of-posts="publicPages.length" :tags="tags" />
|
||||
<SortAndFilter
|
||||
:number-of-posts="pagesToShow.length"
|
||||
:tags="tags"
|
||||
:categories="categories"
|
||||
/>
|
||||
<div
|
||||
class="grid-margins pt-8 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-8"
|
||||
itemscope
|
||||
itemtype="http://schema.org/Blog"
|
||||
>
|
||||
<Card
|
||||
v-for="page in publicPages"
|
||||
v-for="page in pagesToShow"
|
||||
:key="page.key"
|
||||
class="mb-4"
|
||||
:card="page"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<router-link v-if="$pagination.hasPrev" :to="$pagination.prevLink"
|
||||
>Prev</router-link
|
||||
>
|
||||
<router-link v-if="$pagination.hasNext" :to="$pagination.nextLink"
|
||||
>Next</router-link
|
||||
<div
|
||||
v-if="!infiniteScroll && pagesToShow.length < publicPages.length"
|
||||
class="flex justify-center mt-8 pb-4"
|
||||
>
|
||||
<button
|
||||
class="p-2 text-white bg-blueGreen rounded hover:opacity-75"
|
||||
@click="handleLoadMoreClick"
|
||||
>
|
||||
Load More
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
v-else-if="pagesToShow.length < publicPages.length"
|
||||
v-observe-visibility="handleBottomVisibilityChange"
|
||||
></div>
|
||||
</div>
|
||||
</Layout>
|
||||
</template>
|
||||
@@ -47,7 +58,8 @@ import Breadcrumbs from '@theme/components/Breadcrumbs'
|
||||
import { getTags } from '@theme/util/tagUtils'
|
||||
import { parseProtectedPost } from '@theme/util/blogUtils'
|
||||
|
||||
const protectedCardTypes = ['newslinks']
|
||||
const protectedCardTypes = ['newslink']
|
||||
const defaultCategory = 'Blog Post'
|
||||
|
||||
export default {
|
||||
name: 'BlogIndex',
|
||||
@@ -59,16 +71,21 @@ export default {
|
||||
},
|
||||
data: function () {
|
||||
return {
|
||||
numberOfPagesToShow: 20,
|
||||
categories: ['All Content', defaultCategory, ...protectedCardTypes],
|
||||
numberOfPagesToShow: 21,
|
||||
infiniteScroll: false,
|
||||
delayValues: [0, 0.15, 0.3],
|
||||
tags: [],
|
||||
breadcrumbs: [
|
||||
{ title: 'Home', link: 'https://blog.ipfs.io/', external: true },
|
||||
{ title: 'Home', link: 'https://ipfs.io/', external: true },
|
||||
{ title: 'Blog & News' },
|
||||
],
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
activeCategory() {
|
||||
return this.$route.query.category
|
||||
},
|
||||
activeTags() {
|
||||
const queryTags = this.$route.query.tags
|
||||
return queryTags ? queryTags.split(',') : []
|
||||
@@ -80,14 +97,26 @@ export default {
|
||||
publicPages: function () {
|
||||
let result = []
|
||||
this.$pagination.pages.forEach((page) => {
|
||||
if (protectedCardTypes.includes(page.frontmatter.url)) {
|
||||
if (protectedCardTypes.includes(page.frontmatter.type)) {
|
||||
result = [
|
||||
...result,
|
||||
...parseProtectedPost(page, this.activeTags, this.searchedText),
|
||||
...parseProtectedPost(
|
||||
page,
|
||||
this.activeTags,
|
||||
this.searchedText,
|
||||
this.activeCategory
|
||||
),
|
||||
]
|
||||
return
|
||||
}
|
||||
|
||||
if (
|
||||
this.activeCategory &&
|
||||
decodeURI(this.activeCategory) !== defaultCategory
|
||||
) {
|
||||
return false
|
||||
}
|
||||
|
||||
for (let i = 0; i < this.activeTags.length; i++) {
|
||||
if (
|
||||
!page.frontmatter.tags ||
|
||||
@@ -111,17 +140,35 @@ export default {
|
||||
page.frontmatter &&
|
||||
(page.frontmatter.sitemap ? !page.frontmatter.sitemap.exclude : true)
|
||||
) {
|
||||
result.push(page)
|
||||
result.push({
|
||||
...page,
|
||||
category: defaultCategory,
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
return result
|
||||
},
|
||||
pagesToShow() {
|
||||
return this.numberOfPagesToShow > this.publicPages.length
|
||||
? this.publicPages
|
||||
: this.publicPages.slice(0, this.numberOfPagesToShow)
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.tags = getTags(this.publicPages)
|
||||
},
|
||||
methods: {
|
||||
showMorePages() {
|
||||
this.numberOfPagesToShow = this.numberOfPagesToShow + 21
|
||||
},
|
||||
handleLoadMoreClick() {
|
||||
this.infiniteScroll = true
|
||||
this.numberOfPagesToShow = 40
|
||||
},
|
||||
handleBottomVisibilityChange(isVisible) {
|
||||
isVisible && this.showMorePages()
|
||||
},
|
||||
delayVal: function () {
|
||||
this.current =
|
||||
this.current < this.delayValues.length - 1 ? this.current : -1
|
||||
|
||||
1
src/.vuepress/theme/svg-icon/github-icon.svg
Normal file
1
src/.vuepress/theme/svg-icon/github-icon.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg viewBox="-2 -2 35 35" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="mb1 mr3" data-v-44e24651=""><g id="Symbols" stroke="none" stroke-width="1" data-v-44e24651=""><g id="components/navigation/footer/Black/desktop" transform="translate(-1024.000000, -483.000000)" data-v-44e24651=""><g id="footer" data-v-44e24651=""><g id="bottom" transform="translate(0.000000, 474.000000)" data-v-44e24651=""><path d="M1036.9988,9 C1029.82105,9 1024,14.9675467 1024,22.3294028 C1024,28.2183968 1027.72455,33.2138544 1032.89039,34.9763795 C1033.54081,35.0991181 1033.77783,34.6875349 1033.77783,34.334048 C1033.77783,34.0182009 1033.76666,33.1794877 1033.76028,32.0674767 C1030.14426,32.8726414 1029.38132,30.2804039 1029.38132,30.2804039 C1028.78996,28.7404447 1027.93763,28.330498 1027.93763,28.330498 C1026.7573,27.5040587 1028.02701,27.5204238 1028.02701,27.5204238 C1029.33184,27.6145233 1030.01817,28.8942769 1030.01817,28.8942769 C1031.17775,30.930918 1033.06117,30.3425914 1033.80177,30.0013784 C1033.91989,29.1405722 1034.25587,28.5530639 1034.62697,28.2200334 C1031.74038,27.8837298 1028.70536,26.7398069 1028.70536,21.6322481 C1028.70536,20.1773875 1029.21213,18.9868239 1030.04371,18.0556477 C1029.90964,17.7185259 1029.46352,16.3626744 1030.1714,14.5281428 C1030.1714,14.5281428 1031.26235,14.1697463 1033.74591,15.8946316 C1034.78259,15.5984226 1035.89509,15.4511364 1037.0004,15.4454086 C1038.10491,15.4511364 1039.21661,15.5984226 1040.25489,15.8946316 C1042.73686,14.1697463 1043.82621,14.5281428 1043.82621,14.5281428 C1044.53568,16.3626744 1044.08957,17.7185259 1043.95629,18.0556477 C1044.78947,18.9868239 1045.29224,20.1773875 1045.29224,21.6322481 C1045.29224,26.752899 1042.25243,27.8796385 1039.35707,28.209396 C1039.82314,28.6209792 1040.23893,29.4343264 1040.23893,30.6780767 C1040.23893,32.4594217 1040.22297,33.8970989 1040.22297,34.334048 C1040.22297,34.6908079 1040.4576,35.1056641 1041.11679,34.9755613 C1046.27865,33.2089449 1050,28.2167603 1050,22.3294028 C1050,14.9675467 1044.17895,9 1036.9988,9" id="icon/github" data-v-44e24651=""></path></g></g></g></g></svg>
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
@@ -1,6 +1 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<circle cx="12" cy="12" r="12" fill="#156FF7"/>
|
||||
<path d="M8 18C9.10457 18 10 17.1046 10 16C10 14.8954 9.10457 14 8 14C6.89543 14 6 14.8954 6 16C6 17.1046 6.89543 18 8 18Z" fill="#ffffff"/>
|
||||
<path d="M14 17.11C14 17.346 13.9062 17.5724 13.7393 17.7393C13.5724 17.9062 13.346 18 13.11 18C12.874 18 12.6476 17.9062 12.4807 17.7393C12.3138 17.5724 12.22 17.346 12.22 17.11C12.22 15.6964 11.6584 14.3407 10.6589 13.3411C9.65931 12.3416 8.3036 11.78 6.89 11.78C6.77312 11.78 6.65739 11.757 6.54941 11.7123C6.44143 11.6675 6.34332 11.602 6.26068 11.5193C6.17803 11.4367 6.11247 11.3386 6.06775 11.2306C6.02302 11.1226 6 11.0069 6 10.89C6 10.7731 6.02302 10.6574 6.06775 10.5494C6.11247 10.4414 6.17803 10.3433 6.26068 10.2607C6.34332 10.178 6.44143 10.1125 6.54941 10.0677C6.65739 10.023 6.77312 10 6.89 10C8.77569 10 10.5841 10.7491 11.9175 12.0825C13.2509 13.4159 14 15.2243 14 17.11Z" fill="#ffffff"/>
|
||||
<path d="M18 17.08C17.9762 17.3087 17.8685 17.5205 17.6976 17.6745C17.5268 17.8285 17.305 17.9137 17.075 17.9137C16.845 17.9137 16.6232 17.8285 16.4524 17.6745C16.2815 17.5205 16.1738 17.3087 16.15 17.08C16.1474 14.6329 15.1741 12.2867 13.4437 10.5563C11.7133 8.82594 9.36713 7.85265 6.92 7.85C6.69126 7.82618 6.47945 7.71846 6.32548 7.54763C6.17151 7.3768 6.0863 7.15498 6.0863 6.925C6.0863 6.69502 6.17151 6.4732 6.32548 6.30237C6.47945 6.13154 6.69126 6.02382 6.92 6C8.37504 6 9.81584 6.28659 11.1601 6.84341C12.5044 7.40024 13.7259 8.21638 14.7547 9.24526C15.7836 10.2741 16.5998 11.4956 17.1566 12.8399C17.7134 14.1842 18 15.625 18 17.08Z" fill="#ffffff"/>
|
||||
</svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" fill="#000" height="24" viewBox="-2 -2 34 34" class="pb2 ml2" data-v-5480b51c=""><path d="M6.503 20.752c0 1.794-1.456 3.248-3.251 3.248-1.796 0-3.252-1.454-3.252-3.248 0-1.794 1.456-3.248 3.252-3.248 1.795.001 3.251 1.454 3.251 3.248zm-6.503-12.572v4.811c6.05.062 10.96 4.966 11.022 11.009h4.817c-.062-8.71-7.118-15.758-15.839-15.82zm0-3.368c10.58.046 19.152 8.594 19.183 19.188h4.817c-.03-13.231-10.755-23.954-24-24v4.812z" data-v-5480b51c=""></path></svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 509 B |
@@ -233,7 +233,7 @@ module.exports = {
|
||||
margin: ['responsive', 'first', 'last'],
|
||||
scale: ['group-hover', 'hover'],
|
||||
rotate: ['group-hover'],
|
||||
opacity: ['group-hover', 'responsive'],
|
||||
opacity: ['group-hover', 'responsive', 'hover'],
|
||||
},
|
||||
plugins: [
|
||||
require('tailwindcss-typography')({ componentPrefix: 'type-' }),
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
export const parseProtectedPost = (
|
||||
post,
|
||||
activeTags = [],
|
||||
searchedText = []
|
||||
searchedText = [],
|
||||
activeCategory = ''
|
||||
) => {
|
||||
if (!post.frontmatter.data) {
|
||||
return []
|
||||
@@ -10,6 +11,10 @@ export const parseProtectedPost = (
|
||||
const result = []
|
||||
|
||||
post.frontmatter.data.forEach((item) => {
|
||||
if (activeCategory && decodeURI(activeCategory) !== post.frontmatter.type) {
|
||||
return false
|
||||
}
|
||||
|
||||
for (let i = 0; i < activeTags.length; i++) {
|
||||
if (!item.tags || !item.tags.includes(activeTags[i])) {
|
||||
return false
|
||||
@@ -23,6 +28,7 @@ export const parseProtectedPost = (
|
||||
}
|
||||
|
||||
result.push({
|
||||
category: post.frontmatter.type,
|
||||
type: post.frontmatter.type,
|
||||
date: item.date,
|
||||
title: item.title,
|
||||
|
||||
@@ -1,6 +1,4 @@
|
||||
---
|
||||
date: 2020-10-21
|
||||
url: newslinks
|
||||
title: Newslinks
|
||||
type: newslink
|
||||
data:
|
||||
|
||||
Reference in New Issue
Block a user