Skip to content

Commit 9a13a3d

Browse files
sagalbotsagalbot
committed
WIP - Updating Documentation to Use Markdown
- switch to scss for docs - add sidebar navigation
1 parent e202474 commit 9a13a3d

File tree

18 files changed

+464
-263
lines changed

18 files changed

+464
-263
lines changed

‎docs/Docs.vue

Lines changed: 47 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,32 @@
11
<style lang="scss">
2-
@import 'assets/scss/_demo.scss';
3-
@import 'assets/scss/_cyan_theme.scss';
4-
@import 'assets/scss/_prism.scss';
5-
@import 'assets/scss/_octicons.scss';
2+
@import './assets/scss/docs.scss';
3+
4+
#sidebar nav {
5+
// position: fixed;
6+
// top: 0;
7+
}
68
</style>
79

810
<template>
911
<div id="docs" class="container-fluid">
10-
<div class="col-md-2 col-md-offset-1">
11-
<ul class="nav nav-pills nav-stacked">
12-
<li><a href="#">Install &amp; Usage</a></li>
13-
<li><a href="#">Examples</a></li>
14-
<li><a href="#">Ajax</a></li>
15-
<li><a href="#">Parameters</a></li>
16-
</ul>
12+
<div class="col-md-3" id="sidebar">
13+
<nav>
14+
<div class="form-group">
15+
<label class="control-label">Version</label>
16+
<v-select id="select-version" v-model="version" :searchable="false" :options="versions"></v-select>
17+
</div>
18+
<p v-if="version.v == 'v1'"><small><code>v1.x</code> of <code>vue-select</code> should be used with <code>vue 1.x</code></small></p>
19+
<sidebar></sidebar>
20+
</nav>
1721
</div>
1822
<div class="col-md-7">
19-
<article v-html="install"></article>
20-
<article v-html="vModel"></article>
23+
<article v-html="getDocHtml('install')"></article>
24+
<v-select v-model="selected" :options="['foo','bar']"></v-select>
25+
<!-- <article v-html="vModel"></article>
2126
<article v-html="single"></article>
2227
<article v-html="reactive"></article>
2328
<article v-html="labels"></article>
24-
<article v-html="ajax"></article>
29+
<article v-html="ajax"></article> -->
2530
</div>
2631
</div>
2732
</template>
@@ -38,17 +43,39 @@
3843
// import Params from './components/Params.vue'
3944
// import Ajax from './components/snippets/Ajax.vue'
4045
46+
const docs = {
47+
'v1.x': {
48+
install: require('./md/v2/install/Install.md'),
49+
vModel: require('./md/VModel.md'),
50+
single: require('./md/SingleMultiple.md'),
51+
reactive: require('./md/ReactiveOptions.md'),
52+
labels: require('./md/CustomLabels.md'),
53+
ajax: require('./md/Ajax.md'),
54+
},
55+
'v2.x': {
56+
install: require('./md/v2/install/Install.md'),
57+
vModel: require('./md/VModel.md'),
58+
single: require('./md/SingleMultiple.md'),
59+
reactive: require('./md/ReactiveOptions.md'),
60+
labels: require('./md/CustomLabels.md'),
61+
ajax: require('./md/Ajax.md'),
62+
}
63+
}
64+
4165
export default {
4266
// components: { Params, Examples, Ajax }
4367
data () {
4468
return {
45-
install: require('./md/Install.md'),
46-
vModel: require('./md/VModel.md'),
47-
single: require('./md/SingleMultiple.md'),
48-
reactive: require('./md/ReactiveOptions.md'),
49-
labels: require('./md/CustomLabels.md'),
50-
ajax: require('./md/Ajax.md'),
69+
docs,
70+
versions: ['v1.x','v2.x'],
71+
version: 'v2.x'
5172
}
5273
},
74+
75+
methods: {
76+
getDocHtml(doc) {
77+
return this.docs[this.version][doc]
78+
}
79+
}
5380
}
5481
</script>

‎docs/assets/scss/_buttons.scss

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
.btn-outline {
2+
background: none;
3+
line-height: 1.3333333;
4+
border-radius: 6px;
5+
border: 2px solid #91ddec;
6+
color: #147688;
7+
8+
&.btn-lg {
9+
border-width: 3px;
10+
}
11+
12+
&:hover {
13+
border-color: rgb(65, 184, 131);
14+
background-color: rgba(65, 184, 131, 0.67);
15+
}
16+
17+
&:active,
18+
&:focus {
19+
border-color: rgb(65, 184, 131);
20+
background-color: rgba(65, 184, 131, 1);
21+
}
22+
}
23+
24+
.down-arrow {
25+
position: absolute;
26+
bottom: 10px;
27+
width: 100%;
28+
text-align: center;
29+
color: rgba(0,0,0,.5);
30+
font-size: 1.6em;
31+
32+
i {
33+
font-size: 0.7em;
34+
opacity: 0.4;
35+
}
36+
}

‎docs/assets/scss/_cyan_theme.scss

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,4 +30,8 @@
3030
background: #4CC3D9;
3131
color: #fff;
3232
}
33-
}
33+
.selected-tag .close {
34+
font-family: "Helvetica Neue", "Helvetica";
35+
font-weight: 400;
36+
}
37+
}

‎docs/assets/scss/_demo.scss

Lines changed: 0 additions & 120 deletions
This file was deleted.

‎docs/assets/scss/_doc.scss

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
.doc-row {
2+
// padding: 2em 0;
3+
}
4+
5+
#docs {
6+
height: 100vh;
7+
padding-top: 4em;
8+
9+
article *:first-child {
10+
margin-top: 0;
11+
}
12+
13+
article a {
14+
color: $green;
15+
16+
&:hover {
17+
text-decoration: none;
18+
border-bottom: 2px solid $green;
19+
}
20+
}
21+
}

‎docs/assets/scss/_sidebar.scss

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
#docs {
2+
3+
#select-version {
4+
max-width: 110px;
5+
.selected-tag {
6+
background: none;
7+
border: none;
8+
}
9+
}
10+
11+
}

0 commit comments

Comments
 (0)