Skip to content

Commit 314e9b2

Browse files
committed
chore(docs): updated enhancements
1 parent ccba6a4 commit 314e9b2

File tree

13 files changed

+72
-58
lines changed

13 files changed

+72
-58
lines changed

docs/build/markdown.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ function highlight (str, lang) {
4242
const code = Prism.highlight(str, Prism.languages[ lang ], lang)
4343

4444
return '<pre class="markdown--code">'
45-
+ `<code class="markdown--code__inner language-${ lang }">${ code }</code></pre>\n`
45+
+ `<code class="markdown--code__inner markdown--code__inner--prerendered language-${ lang }">${ code }</code></pre>\n`
4646
}
4747

4848
return ''

docs/quasar.conf.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -28,8 +28,7 @@ module.exports = configure(function (ctx) {
2828

2929
// https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-css
3030
css: [
31-
'app.sass',
32-
'Markdown.sass'
31+
'app.sass'
3332
],
3433

3534
// https://github.com/quasarframework/quasar/tree/dev/extras

docs/src/components/DocsMenu.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ import {
88
Ripple
99
} from 'quasar'
1010

11-
// import { mdiArrowDownThinCircleOutline } from '@quasar/extras/mdi-v5'
1211
import { biCaretDown, biCaretDownFill } from '@quasar/extras/bootstrap-icons'
1312
import { h, ref, watch, onMounted, onBeforeUpdate, withDirectives } from 'vue'
1413
import { useRoute } from 'vue-router'

docs/src/components/MarkdownPage.vue

Lines changed: 39 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -6,51 +6,53 @@
66
:nav="nav"
77
/>
88

9-
<slot></slot>
10-
11-
<div v-if="related !== undefined" class="full-width">
12-
<h5 class="q-ma-none">Related</h5>
13-
<q-separator />
14-
<div class="q-gutter-md flex flex-center q-mt-md markdown-page__related">
15-
<router-link
16-
v-for="link in related"
17-
:key="link.category + link.path"
18-
:to="link.path"
19-
class="markdown-page__related--link markdown-page__related--bordered rounded-borders q-pa-md cursor-pointer column justify-center bg-grey-3"
20-
>
21-
<div class="row no-wrap items-center justify-center">
22-
<div class="col">
23-
<div class="markdown-page__nav--cat">{{ link.category || 'Docs' }}</div>
24-
<div class="markdown-page__nav--name text-weight-bold">{{ link.name }}</div>
9+
<div :class="$route.path !== '/' ? 'q-ma-xs' : ''">
10+
<slot></slot>
11+
12+
<div v-if="related !== undefined" class="full-width">
13+
<h5 class="q-ma-none q-mt-lg">Related</h5>
14+
<q-separator />
15+
<div class="q-gutter-md flex flex-center q-mt-md markdown-page__related">
16+
<router-link
17+
v-for="link in related"
18+
:key="link.category + link.path"
19+
:to="link.path"
20+
class="markdown-page__related--link markdown-page__related--bordered rounded-borders q-pa-md cursor-pointer column justify-center bg-grey-3"
21+
>
22+
<div class="row no-wrap items-center justify-center">
23+
<div class="col">
24+
<div class="markdown-page__nav--cat">{{ link.category || 'Docs' }}</div>
25+
<div class="markdown-page__nav--name text-weight-bold">{{ link.name }}</div>
26+
</div>
27+
<q-icon :name="biBoxArrowUpRight" class="q-ml-lg" />
2528
</div>
26-
<q-icon :name="biBoxArrowUpRight" class="q-ml-lg" />
27-
</div>
28-
</router-link>
29+
</router-link>
30+
</div>
2931
</div>
30-
</div>
3132

3233

33-
<div class="markdown-page__footer">
34-
<q-separator class="q-mb-lg" />
35-
<div v-if="path && noEdit !== true">
36-
<div class="full-width row justify-center items-center">
37-
Found an error on this page or feel it could be improved?
38-
<markdown-link
39-
:to="'https://github.com/quasarframework/quasar-ui-qiconpicker/edit/next/docs/src/pages' + path + '.md'"
40-
>
41-
&nbsp; Edit this page on GitHub
42-
</markdown-link>
34+
<div class="markdown-page__footer">
35+
<q-separator class="q-mb-lg" />
36+
<div v-if="path && noEdit !== true">
37+
<div class="full-width row justify-center items-center">
38+
Found an error on this page or feel it could be improved?
39+
<markdown-link
40+
:to="'https://github.com/quasarframework/quasar-ui-qiconpicker/edit/next/docs/src/pages' + path + '.md'"
41+
>
42+
&nbsp; Edit this page on GitHub
43+
</markdown-link>
44+
</div>
4345
</div>
44-
</div>
4546

46-
<markdown-footer />
47+
<markdown-footer />
4748

48-
<div class="row justify-center">
49-
<a href="https://www.netlify.com" target="_blank" noopener noreferrer class="row justify-center">
50-
<img src="https://www.netlify.com/img/global/badges/netlify-color-accent.svg" alt="Deploys by Netlify" />
51-
</a>
52-
</div>
49+
<div class="row justify-center">
50+
<a href="https://www.netlify.com" target="_blank" noopener noreferrer class="row justify-center">
51+
<img src="https://www.netlify.com/img/global/badges/netlify-color-accent.svg" alt="Deploys by Netlify" />
52+
</a>
53+
</div>
5354

55+
</div>
5456
</div>
5557
<div class="q-mb-md"></div>
5658
</div>

docs/src/components/page-parts/releases/PackageReleases.vue

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -38,13 +38,13 @@ import sanitize from './sanitize'
3838
import parseMdTable from './md-table-parser'
3939
4040
export default {
41-
props: [ 'active', 'releases' ],
41+
props: [ 'latestVersion', 'releases' ],
4242
4343
setup (props) {
4444
const search = ref('')
45-
const selectedVersion = ref(props.active)
45+
const selectedVersion = ref(props.latestVersion)
4646
47-
watch(() => props.active, val => {
47+
watch(() => props.latestVersion, val => {
4848
selectedVersion.value = val
4949
})
5050
@@ -75,7 +75,7 @@ export default {
7575
.replace(/# ([\S ]+)/g, '<div class="text-h4">$1</div>')
7676
.replace(/\*\*([\S ]*?)\*\*/g, '<strong>$1</strong>')
7777
.replace(/\*([\S ]*?)\*/g, '<em>$1</em>')
78-
.replace(/```([\S]+)/g, '<code class="markdown--code__inner release__code">')
78+
.replace(/```([\S]+)/g, '<code class="markdown--code__inner markdown--code__inner--prerendered release__code">')
7979
.replace(/```\n/g, '</code>')
8080
.replace(/\`(.*?)\`/g, '<code class="markdown--token">$1</code>')
8181
.replace(/#([\d]+)/g, '<a class="markdown-link" href="https://github.com/quasarframework/quasar-ui-qiconpicker/issues/$1" target="_blank">#$1</a>')
@@ -84,6 +84,7 @@ export default {
8484
.replace(/^ {2}[-*] ([\S .]+)$/gm, '<li class="q-pl-md">$1</li>')
8585
.replace(/^[-*] ([\S .]+)$/gm, '<li>$1</li>')
8686
.replace(/<\/li>[\s\n\r]*<li/g, '</li><li')
87+
.replace(/\n/g, '<br>')
8788
8889
return content.indexOf('| -') > -1
8990
? parseMdTable(content)

docs/src/components/page-parts/releases/QIconPickerReleases.vue renamed to docs/src/components/page-parts/releases/Releases.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
<q-separator />
1717
<q-tab-panels v-model="currentPackage" animated class="packages-container">
1818
<q-tab-panel v-for="(packageReleases, packageName) in packages" :name="packageName" :key="packageName" class="q-pa-none">
19-
<package-releases :active="latestVersions[packageName]" :releases="packageReleases" />
19+
<package-releases :latest-version="latestVersions[packageName]" :releases="packageReleases" />
2020
</q-tab-panel>
2121
</q-tab-panels>
2222
</template>
@@ -32,7 +32,7 @@ import PackageReleases from './PackageReleases'
3232
const { extractDate, formatDate } = date
3333
3434
export default {
35-
name: 'QIconPickerReleases',
35+
name: 'Releases',
3636
3737
components: {
3838
PackageReleases

docs/src/css/app.sass

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11

2-
// @import 'quasar/src/css/variables.sass'
3-
@import './quasar.variables.sass'
4-
@import './Markdown.sass'
2+
@import 'quasar/src/css/variables.sass'
3+
@import 'markdown.sass'
54
@import 'quasar-ui-example-viewer/src/index.sass'
65
@import 'quasar-ui-json-api-viewer/src/index.sass'
76

Lines changed: 15 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -261,6 +261,10 @@
261261
&--code__inner
262262
margin: 0
263263
position: relative
264+
font-size: 12px
265+
color: $grey-10
266+
background-color: $blue-grey-1
267+
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace
264268
text-align: left
265269
white-space: pre
266270
word-spacing: normal
@@ -269,21 +273,28 @@
269273
line-height: 1.5
270274
tab-size: 4
271275
hyphens: none
272-
border-radius: $generic-border-radius
273-
background: $blue-grey-1
274-
color: $grey-10
275-
276276

277277
&--code
278278
overflow: visible
279279
padding: 0
280+
border-radius: $generic-border-radius
280281

281282
&__inner
283+
background-color: $grey-2
282284
max-height: inherit
283285
height: inherit
286+
padding: 1em
284287
display: block
285288
overflow: auto
286289

290+
&--prerendered
291+
border-width: 1px 4px
292+
border-style: solid
293+
border-color: $separator-color
294+
border-left-color: $primary
295+
border-right-color: $primary
296+
border-radius: $generic-border-radius
297+
287298
&--table
288299
border-color: $grey-4
289300
background: $grey-1

docs/src/pages/all-about-qiconpicker/installation-types.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -125,7 +125,7 @@ import '@quasar/quasar-ui-qiconpicker/dist/icon-set/mdi-v4.umd.js'
125125
import '@quasar/quasar-ui-qiconpicker/dist/icon-set/mdi-v5.umd.js'
126126
import '@quasar/quasar-ui-qiconpicker/dist/icon-set/mdi-v6.umd.js'
127127
import '@quasar/quasar-ui-qiconpicker/dist/icon-set/themify.umd.js'
128-
import '@quasar/quasar-ui-qiconpicker/dist/icon-set/lineawesome.umd.js'
128+
import '@quasar/quasar-ui-qiconpicker/dist/icon-set/line-awesome.umd.js'
129129
import '@quasar/quasar-ui-qiconpicker/dist/icon-set/bootstrap-icons.umd.js'
130130
export default {
131131
name: 'App'
@@ -224,7 +224,7 @@ Choices are:
224224
7. material-icons.umd.js
225225
8. mdi-v4.umd.js
226226
9. mdi-v5.umd.js
227-
10. mdi-v5.umd.js
227+
10. mdi-v6.umd.js
228228
11. themify.umd.js
229229
12. line-awesome.umd.js
230230
13. bootstrap-icons.umd.js

docs/src/pages/all-about-qiconpicker/what-is-qiconpicker.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,7 @@ QIconPicker is an icon picker for your Quasar application. It allows you to have
3838
- mdi-v5
3939
- mdi-v6
4040
- fontawesome-v5
41+
- line-awesome
4142
- eva-icons
4243
- themify
4344
- bootstrap-icons

0 commit comments

Comments
 (0)