Skip to content

Commit 02d2432

Browse files
cwaringcwaring
authored
Merge pull request #28 from ipfs/feat/content-status
feat: content status with related resources
2 parents 125c015 + 1a13554 commit 02d2432

File tree

9 files changed

+167
-32
lines changed

9 files changed

+167
-32
lines changed

‎docs/.vuepress/config.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,8 @@ module.exports = {
1919
}
2020
},
2121
themeConfig: {
22+
betaTestFormUrl:
23+
'https://docs.google.com/forms/d/1LVaD1B2uyW6Ff0jfU_iQ5mCeyQcHfyQO6BDD99XAgK0/viewform',
2224
// edit links
2325
repo: 'ipfs/ipfs-docs-v2',
2426
docsRepo: 'ipfs/ipfs-docs-v2',

‎docs/.vuepress/nav/en.js

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,6 @@
1-
module.exports = []
1+
module.exports = [
2+
{
3+
text: 'Suggest a Feature',
4+
link: 'https://ipfs.canny.io/docs-features'
5+
}
6+
]

‎docs/.vuepress/theme/global-components/ContentStatus.vue

Lines changed: 126 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,139 @@
11
<template>
2-
<main>
3-
<h1>This content is still preparing for liftoff!</h1>
4-
<img src="../assets/pencil-rocket.svg" />
5-
{{ $page }}
2+
<main class="content-status">
3+
<div>
4+
<div class="illustration">
5+
<img src="../assets/pencil-rocket.svg" />
6+
</div>
7+
<h2>{{ title }}</h2>
8+
<div v-if="issueNum" class="content-status-status">
9+
<a
10+
target="_blank"
11+
:href="`https://github.com/${repo}/issue/${issueNum}`"
12+
>Check the status</a
13+
>
14+
of this page on GitHub.
15+
</div>
16+
<div class="section content-status-vote">
17+
<h3>Is this topic important to you?</h3>
18+
<button>Yes</button>
19+
<button>Not really</button>
20+
</div>
21+
<div class="section content-status-info">
22+
<h3>Give us a hand</h3>
23+
<ul>
24+
<li v-if="issueNum">
25+
<a :href="`https://github.com/${repo}/issue/${issueNum}`"
26+
>Help write this page</a
27+
>
28+
</li>
29+
<li v-if="$site.themeConfig.betaTestFormUrl">
30+
<a :href="$site.themeConfig.betaTestFormUrl" target="_blank"
31+
>Sign up to be a beta tester</a
32+
>
33+
</li>
34+
</ul>
35+
</div>
36+
</div>
37+
38+
<div class="content-status-info" style="clear: both">
39+
<div v-if="related" class="section content-other-resources">
40+
<h3>Other resources to try</h3>
41+
<ul>
42+
<li v-for="(item, title) in related">
43+
<a :href="item" :alt="title" target="_blank">{{ title }}</a>
44+
</li>
45+
</ul>
46+
</div>
47+
</div>
648
</main>
749
</template>
850

951
<script>
1052
export default {
11-
name: 'ContentStatus',
53+
computed: {
54+
issueNum: function() {
55+
return this.$frontmatter && this.$frontmatter.issueNum
56+
},
57+
repo: function() {
58+
return this.$site && this.$site.themeConfig && this.$site.themeConfig.repo
59+
},
60+
related: function() {
61+
return this.$frontmatter.related
62+
}
63+
},
1264
props: {
13-
test: String
65+
title: {
66+
type: String,
67+
default: 'This content is still preparing for liftoff!'
68+
}
1469
}
1570
}
1671
</script>
1772

18-
<style scoped>
19-
h1 {
20-
color: red;
73+
<style lang="stylus" scoped>
74+
h2, h3 {
75+
border-bottom: none;
76+
margin: 0.5rem 0; // TODO: make global
77+
}
78+
79+
ul {
80+
list-style: none;
81+
margin: 0;
82+
padding: 0;
83+
84+
li {
85+
margin: 0;
86+
padding: 0;
87+
}
88+
}
89+
90+
.content-status-vote {
91+
margin-top: 3rem;
92+
}
93+
94+
.illustration {
95+
width: 20%;
96+
float: right;
97+
}
98+
99+
// TODO: make global
100+
.section {
101+
margin-bottom: 3rem;
102+
}
103+
104+
// TODO: make global
105+
.content-status-vote {
106+
button {
107+
font-weight: bold;
108+
padding: 10px 15px;
109+
background-color: darken($accentColor, 30%);
110+
border: none;
111+
font-size: 1em;
112+
color: white;
113+
margin-right: 10px;
114+
border-radius: 2px;
115+
cursor: pointer;
116+
transition: all 0.3s;
117+
min-width: 45%;
118+
119+
&:hover {
120+
background-color: $accentColor;
121+
}
122+
123+
outline: none;
124+
}
125+
}
126+
127+
@media (min-width: $MQNarrow) {
128+
.illustration {
129+
width: 40%;
130+
float: right;
131+
}
132+
133+
.content-status-vote {
134+
button {
135+
min-width: auto;
136+
}
137+
}
21138
}
22139
</style>

‎docs/.vuepress/theme/styles/layout-center.styl

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -5,17 +5,25 @@
55
@extend .relative;
66
}
77

8+
.navbar {
9+
position: sticky;
10+
}
11+
12+
.theme-default-content:not(.custom) {
13+
margin: inherit;
14+
15+
& > h1 {
16+
padding-top: 1em;
17+
}
18+
}
19+
820
@media (min-width: $MQNarrow) {
921
.sidebar {
1022
position: fixed;
1123
left: inherit;
1224
border-right: none;
1325
}
1426

15-
.navbar {
16-
position: sticky;
17-
}
18-
1927
// center links/search
2028
header.navbar .links {
2129
right: inherit;
@@ -38,12 +46,4 @@
3846
footer.page-edit {
3947
margin: inherit;
4048
}
41-
}
42-
43-
.theme-default-content:not(.custom) {
44-
margin: inherit;
45-
46-
& > h1 {
47-
padding-top: 1em;
48-
}
4949
}

‎docs/.vuepress/theme/styles/palette.styl

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,4 +18,5 @@ $MQNarrow = 959px;
1818
$MQMobile = 719px;
1919
$MQMobileNarrow = 419px;
2020
$maxWidth = 1280px;
21-
$contentWidth = 740px;
21+
$contentWidth = 740px;
22+
$gutterWidth = 1rem;

‎docs/.vuepress/theme/styles/util.styl

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,10 @@
1616
float: left;
1717
}
1818

19+
.float-r {
20+
float: right;
21+
}
22+
1923
// margins
2024
.mx-auto {
2125
margin-left: auto;

‎docs/essentials/bitswap.md

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,14 @@
11
---
22
title: Bitswap
33
sidebarDepth: 0
4+
issueNum: 333
5+
related:
6+
an interesting article: https://ipfs.io
7+
another interesting article: https://ipfs.io
48
---
59

610
# Bitswap
711

8-
> This content is still preparing for liftoff. In the meantime, check out [this video from IPFS Camp 2019](https://www.youtube.com/watch?v=fLUq0RkiTBA) on how Bitswap fits into the overall lifecycle of data in IPFS!
12+
<ContentStatus />
13+
14+
In the meantime, check out [this video from IPFS Camp 2019](https://www.youtube.com/watch?v=fLUq0RkiTBA) on how Bitswap fits into the overall lifecycle of data in IPFS!

‎package-lock.json

Lines changed: 6 additions & 6 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,10 +16,10 @@
1616
"markdown-it-footnote": "^3.0.2",
1717
"markdown-it-task-lists": "^2.1.1",
1818
"markdown-it-video": "^0.6.3",
19-
"prettier": "^1.18.2",
19+
"prettier": "^1.19.1",
2020
"stylus-supremacy": "^2.14.0",
2121
"vuepress": "^1.2.0",
22-
"vuepress-plugin-clean-urls": "^1.1.0"
22+
"vuepress-plugin-clean-urls": "^1.1.1"
2323
},
2424
"prettier": {
2525
"arrowParens": "avoid",

0 commit comments

Comments
 (0)