Skip to content

Commit 3cf602e

Browse files
janzhengjanzheng
committed
disqus comments
1 parent a2bcb9c commit 3cf602e

File tree

11 files changed

+254
-73
lines changed

11 files changed

+254
-73
lines changed

‎_coeur_backup--modified/styles/_head-typography.scss

+2
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,8 @@ $typography_: (
5252

5353
$settings: $typography_;
5454

55+
@include addtheme($$settings)
56+
5557
// $theme-typesizes {
5658

5759
// }

‎assets/css/components/_capsid.scss

+37
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,15 @@
7373
font-size: $p4;
7474
line-height: $l4;
7575
}
76+
.Capsid-content {
77+
h4 {
78+
padding-top: $size;
79+
padding-bottom: $size / 2;
80+
}
81+
h3 + h4 {
82+
padding-top: $size / 2;
83+
}
84+
}
7685
h5 {
7786
font-weight: 400;
7887
}
@@ -99,6 +108,11 @@
99108
// border: 0;
100109
// color: usetheme(tertiary); // $color-tertiary;
101110
}
111+
112+
cite {
113+
font-size: $font-size;
114+
font-style: normal;
115+
}
102116
}
103117

104118
p a {
@@ -468,7 +482,30 @@
468482
background-color: usetheme(bg-silver);
469483
padding-top: $size;
470484
padding-bottom: $size;
485+
486+
@include screen-xs {
487+
padding-left: $size/2;
488+
padding-right: $size/2;
489+
}
490+
}
491+
492+
493+
.Capsid-disqus {
494+
padding-top: $size-2;
495+
padding-bottom: $size-2;
496+
background-color: usetheme(bg-silver);
497+
498+
@include screen-xs {
499+
padding-left: $size/2;
500+
padding-right: $size/2;
501+
}
471502
}
503+
#disqus_thread {
504+
margin: 0 auto;
505+
@extend %width-content-paragraph;
506+
}
507+
508+
472509

473510

474511

‎components/CapsidEmail.vue

+9-1
Original file line numberDiff line numberDiff line change
@@ -27,9 +27,17 @@
2727

2828
<!-- hard-coded styles -->
2929
<style type="text/css">
30+
h3 {
31+
padding-top: 21px;
32+
}
3033
h4 {
3134
/*padding: 16px 0;*/
35+
/*padding-top: 16px;*/
3236
padding: 0;
37+
/*padding-top: 21px;*/
38+
padding-top: 21px;
39+
}
40+
h3 + h4 {
3341
padding-top: 16px;
3442
}
3543
h5 {
@@ -59,7 +67,7 @@
5967
background-color: #FCFCFC;
6068
border-radius: 4px;
6169
margin-bottom: 16px;
62-
/*padding: 15px;*/
70+
padding: 15px;
6371
}
6472

6573
.Section-table {

‎nuxt.config.js

+7-1
Original file line numberDiff line numberDiff line change
@@ -326,6 +326,12 @@ module.exports = (async function() {
326326
path: '/capsid',
327327
component: resolve(__dirname, 'pages/capsidlist.vue')
328328
},
329+
{
330+
// always shows the latest capsid; GOES BEFORE capsidIssue / capsid/:slug
331+
name: 'capsidLatest',
332+
path: '/capsid/latest',
333+
component: resolve(__dirname, 'pages/capsidlatest.vue')
334+
},
329335
{
330336
// opens each issue separately, good for deeplinking, possibly comments
331337
name: 'capsidIssue',
@@ -508,7 +514,7 @@ module.exports = (async function() {
508514
},
509515
generate: {
510516
interval: 100, // slow down api calls // https://nuxtjs.org/api/configuration-generate/
511-
fallback: false, // if you want to use '404.html' — for surge, use false if you want to use 200 spa fallback
517+
// fallback: false, // if you want to use '404.html' — for surge, use false if you want to use 200 spa fallback
512518
// concurrency: 1, // reduce server strain
513519
routes: async function (callback) {
514520

‎package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,10 +16,10 @@
1616
"generate": "nuxt generate",
1717
"deploy": "cd dist; surge . -d https://phage.directory; say 'prod ready'",
1818
"stagedeploy": "cd dist; surge . -d phagedirectory.surge.sh; say 'stage ready'",
19-
"stage": "NODE_ENV=spa npm run generate -- --spa; npm run stagedeploy",
19+
"stage": "NODE_ENV=spa npm run generate --spa; npm run stagedeploy",
2020
"stagebuild": "npm run generate; npm run stagedeploy",
2121
"prod": "npm run generate; npm run deploy",
22-
"prodspa": "NODE_ENV=spa npm run generate -- --spa; npm run deploy",
22+
"prodspa": "NODE_ENV=spa npm run generate --spa; npm run deploy",
2323
"kisacodeploy": "cd dist; surge . -d phagedirectorykisaco.surge.sh; say 'stage ready'",
2424
"kisaco": "npm run generate; npm run kisacodeploy"
2525
},

‎pages/capsidissue.vue

+24
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,12 @@
3939
</div>
4040
</div>
4141

42+
<no-ssr>
43+
<div id="comment" class="Capsid-disqus" >
44+
<div id="disqus_thread" />
45+
</div>
46+
</no-ssr>
47+
4248
<div class="CapsidIssue-footer _section-content _margin-center">
4349
<!-- <CapsidBanner class="_margin-center _margin-top-2 _margin-bottom-2" /> -->
4450
<CapsidMicroBanner class="_section-article _margin-center _margin-top-2 _margin-bottom" />
@@ -55,6 +61,7 @@
5561
</div>
5662
</template>
5763

64+
5865
<script>
5966

6067
// import Article from '~/components/Article.vue'
@@ -133,6 +140,23 @@ export default {
133140
},
134141

135142
mounted: async function () {
143+
144+
// load disqus
145+
if (!process.server) {
146+
/**
147+
* RECOMMENDED CONFIGURATION VARIABLES: EDIT AND UNCOMMENT THE SECTION BELOW TO INSERT DYNAMIC VALUES FROM YOUR PLATFORM OR CMS.
148+
* LEARN WHY DEFINING THESE VARIABLES IS IMPORTANT: https://disqus.com/admin/universalcode/#configuration-variables*/
149+
// var disqus_config = function () {
150+
// this.page.url = this.slug; // PAGE_URL; // Replace PAGE_URL with your page's canonical URL variable
151+
// this.page.identifier = this.slug //PAGE_IDENTIFIER; // Replace PAGE_IDENTIFIER with your page's unique identifier variable
152+
// };
153+
154+
(function() { // DON'T EDIT BELOW THIS LINE
155+
var d = document, s = d.createElement('script')
156+
s.src = 'https://capsid-tail.disqus.com/embed.js'
157+
s.setAttribute('data-timestamp', +new Date())(d.head || d.body).appendChild(s)
158+
})()
159+
}
136160
},
137161

138162
methods: {

‎pages/capsidlatest.vue

+106
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
2+
<!--
3+
4+
A clone of capsidissue, shows the latest capsid
5+
6+
-->
7+
8+
<template>
9+
<div class="CapsidIssue _section-page _margin-top _margin-center">
10+
<div class="_section-content _margin-center _padding-bottom-2">
11+
<div class="" v-html="$md.render(title || '')" />
12+
</div>
13+
14+
<div class="_section-content _margin-center">
15+
<Capsid :issues="issues" :show-preview="showPreview" />
16+
17+
<div v-if="issues.length == 0">
18+
<h4>Sorry, no Capsid & Tail issue was found at this URL</h4>
19+
<div>
20+
If you think this is a bug, please email us at <a href="mailto:[email protected]">[email protected]</a>
21+
</div>
22+
</div>
23+
</div>
24+
25+
<div class="CapsidIssue-footer _section-content _margin-center">
26+
<CapsidMicroBanner class="_section-article _margin-center _margin-top-2 _margin-bottom" />
27+
<div class="_section-article _margin-center _margin-bottom-2" v-html="$md.render(highlight)" />
28+
<!-- <Capsid :issues="issues" :show-preview="showPreview" /> -->
29+
</div>
30+
31+
<div class="_section-content _margin-center">
32+
<div class="_section-article _margin-center _font-small" v-html="$md.render(fineprint || '')" />
33+
</div>
34+
35+
</div>
36+
</template>
37+
38+
<script>
39+
40+
// import Article from '~/components/Article.vue'
41+
import CapsidBanner from '~/components/CapsidBanner.vue'
42+
import CapsidMicroBanner from '~/components/CapsidMicroBanner.vue'
43+
import Capsid from '~/components/Capsid.vue'
44+
45+
export default {
46+
47+
components: {
48+
CapsidBanner,
49+
CapsidMicroBanner,
50+
Capsid,
51+
},
52+
53+
layout: 'contentframe',
54+
middleware: 'pageload',
55+
meta: {
56+
tableQueries: ["_capsid-content", "_capsid-data"] // combine queries
57+
},
58+
59+
// these are dynamic, and aren't grabbed on generation
60+
// async asyncData({env, route, store}) {
61+
async asyncData({route}) {
62+
63+
// await loadNews(env, store, 'capsid')
64+
65+
const slug = unescape(route.params.slug)
66+
return {
67+
slug,
68+
showPreview: slug ? true : false, // used to show previews on capsid/slug titles, for testing
69+
}
70+
},
71+
72+
data: function () {
73+
return {
74+
title: this.$cytosis.find('Content.capsid-title', {'Content': this.$store.state['Content']} )[0]['fields']['Markdown'],
75+
fineprint: this.$cytosis.find('Content.capsid-fine', {'Content': this.$store.state['Content']} )[0]['fields']['Markdown'],
76+
intro: this.$cytosis.find('Content.capsid-intro', {'Content': this.$store.state['Content']} )[0]['fields']['Markdown'],
77+
highlight: this.$cytosis.find('Content.capsid-highlight', {'Content': this.$store.state['Content']} )[0]['fields']['Markdown'],
78+
}
79+
},
80+
81+
computed: {
82+
83+
issues() {
84+
85+
let result = [this.$store.state['C&T'][0]]
86+
87+
// console.log('issue slug: ', result)
88+
return result // array of issues
89+
}
90+
91+
},
92+
93+
mounted: async function () {
94+
},
95+
96+
methods: {
97+
}
98+
99+
}
100+
</script>
101+
102+
103+
<style lang="scss" scoped>
104+
105+
</style>
106+

‎pages/capsidlist.vue

+1
Original file line numberDiff line numberDiff line change
@@ -77,6 +77,7 @@ export default {
7777
middleware: 'pageload',
7878
meta: {
7979
// tableQuery: "_basic",
80+
// tableQuery: "_capsid-titles",
8081
tableQueries: ["_capsid-content", "_capsid-titles"] // combine queries
8182
},
8283

‎pages/index.vue

+8-7
Original file line numberDiff line numberDiff line change
@@ -56,13 +56,6 @@
5656
-->
5757
<div class="Stream">
5858

59-
<StreamCard>
60-
<div slot="sidebar" style="width:100px">
61-
<img class="cnt _block _left _margin-center" src="/phagefutures.png" width="80px" alt="Phage Futures" >
62-
</div>
63-
<div slot="main" class="_card --border-active _padding _md-p_fix" v-html="$md.render(phagefutures || '')" />
64-
</StreamCard>
65-
6659
<StreamCard>
6760
<div slot="sidebar" style="width:100px">
6861
<img class="cnt _block _left" src="/cnt.png" width="100px" alt="Capsid and Tail" >
@@ -74,6 +67,14 @@
7467
<FormCapsidFeedback class=""/>
7568
</div>
7669
</StreamCard>
70+
71+
<StreamCard>
72+
<div slot="sidebar" style="width:100px">
73+
<img class="cnt _block _left _margin-center" src="/phagefutures.png" width="80px" alt="Phage Futures" >
74+
</div>
75+
<div slot="main" class="_card --border-active _padding _md-p_fix" v-html="$md.render(phagefutures || '')" />
76+
</StreamCard>
77+
7778
</div>
7879

7980
<div class="">

‎static/sticker_roomy.png

4.23 KB
Loading

0 commit comments

Comments
 (0)