Skip to content

Navigation Menu

Sign in

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Appearance settings

Commit 73cbdfe

Browse filesBrowse files
janoshrubosjanoshrubos
authored
feat: responsive native navigation (#32)
1 parent 520e51c commit 73cbdfe
Copy full SHA for 73cbdfe

File tree

2 files changed

+160
-43
lines changed
Filter options

2 files changed

+160
-43
lines changed

‎.vitepress/theme/nativescript-theme/index.js

Copy file name to clipboardExpand all lines: .vitepress/theme/nativescript-theme/index.js
+150-40
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,13 @@ import {
2828
nextTick,
2929
renderSlot,
3030
} from 'vue'
31-
import { useRoute, useSiteDataByRoute, useSiteData, inBrowser } from 'vitepress'
31+
import {
32+
useRoute,
33+
useSiteDataByRoute,
34+
useSiteData,
35+
useRouter,
36+
inBrowser,
37+
} from 'vitepress'
3238

3339
/*! @docsearch/js 1.0.0-alpha.28 (UNRELEASED 0a58769) | MIT License | © Algolia, Inc. and contributors | https://github.com/francoischalifour/autocomplete.js */
3440
function e(e, t, n) {
@@ -6212,11 +6218,11 @@ function docsearch(e) {
62126218
)
62136219
}
62146220

6215-
var _hoisted_1$b = {
6221+
var _hoisted_1$c = {
62166222
class: 'algolia-search-box',
62176223
id: 'docsearch',
62186224
}
6219-
var script$b = defineComponent({
6225+
var script$c = defineComponent({
62206226
expose: [],
62216227
props: {
62226228
options: {
@@ -6287,18 +6293,18 @@ var script$b = defineComponent({
62876293
}
62886294

62896295
return function (_ctx, _cache) {
6290-
return openBlock(), createBlock('div', _hoisted_1$b)
6296+
return openBlock(), createBlock('div', _hoisted_1$c)
62916297
}
62926298
},
62936299
})
62946300

6295-
var script$a = defineComponent({
6301+
var script$b = defineComponent({
62966302
props: {
62976303
variant: String,
62986304
},
62996305
})
63006306

6301-
var _hoisted_1$a = {
6307+
var _hoisted_1$b = {
63026308
key: 0,
63036309
viewBox: '0 0 532 100',
63046310
xmlns: 'http://www.w3.org/2000/svg',
@@ -6308,7 +6314,7 @@ var _hoisted_1$a = {
63086314
'stroke-miterlimit': '2',
63096315
}
63106316

6311-
var _hoisted_2$9 = /*#__PURE__*/ createVNode(
6317+
var _hoisted_2$a = /*#__PURE__*/ createVNode(
63126318
'g',
63136319
{
63146320
transform: 'translate(-362.21733 -1030)',
@@ -6476,15 +6482,15 @@ var _hoisted_4$7 = /*#__PURE__*/ createVNode(
64766482
-1
64776483
)
64786484

6479-
function render$a(_ctx, _cache, $props, $setup, $data, $options) {
6485+
function render$b(_ctx, _cache, $props, $setup, $data, $options) {
64806486
return _ctx.variant === 'blue'
6481-
? (openBlock(), createBlock('svg', _hoisted_1$a, [_hoisted_2$9]))
6487+
? (openBlock(), createBlock('svg', _hoisted_1$b, [_hoisted_2$a]))
64826488
: (openBlock(), createBlock('svg', _hoisted_3$7, [_hoisted_4$7]))
64836489
}
64846490

6485-
script$a.render = render$a
6491+
script$b.render = render$b
64866492

6487-
var script$9 = defineComponent({
6493+
var script$a = defineComponent({
64886494
props: {
64896495
nav: Array,
64906496
mainURL: {
@@ -6513,12 +6519,12 @@ var script$9 = defineComponent({
65136519
}
65146520
},
65156521
components: {
6516-
AlgoliaSearchBox: script$b,
6517-
NativeScriptLogo: script$a,
6522+
AlgoliaSearchBox: script$c,
6523+
NativeScriptLogo: script$b,
65186524
},
65196525
})
65206526

6521-
var _hoisted_1$9 = /*#__PURE__*/ createVNode(
6527+
var _hoisted_1$a = /*#__PURE__*/ createVNode(
65226528
'a',
65236529
{
65246530
href: '/professional-services-summit-2021',
@@ -6545,8 +6551,8 @@ var _hoisted_1$9 = /*#__PURE__*/ createVNode(
65456551
-1
65466552
)
65476553

6548-
var _hoisted_2$8 = {
6549-
class: 'top-0 z-10 lg:sticky nav-bar',
6554+
var _hoisted_2$9 = {
6555+
class: 'top-0 z-10 lg:sticky',
65506556
}
65516557
var _hoisted_3$6 = {
65526558
class: 'pt-6 pb-6 bg-ns-blue',
@@ -6985,7 +6991,7 @@ var _hoisted_39 = /*#__PURE__*/ createVNode(
69856991
-1
69866992
)
69876993

6988-
function render$9(_ctx, _cache, $props, $setup, $data, $options) {
6994+
function render$a(_ctx, _cache, $props, $setup, $data, $options) {
69896995
var _component_NativeScriptLogo = resolveComponent('NativeScriptLogo')
69906996

69916997
var _component_AlgoliaSearchBox = resolveComponent('AlgoliaSearchBox')
@@ -6998,8 +7004,8 @@ function render$9(_ctx, _cache, $props, $setup, $data, $options) {
69987004
Fragment,
69997005
null,
70007006
[
7001-
_hoisted_1$9,
7002-
createVNode('header', _hoisted_2$8, [
7007+
_hoisted_1$a,
7008+
createVNode('header', _hoisted_2$9, [
70037009
createVNode('div', _hoisted_3$6, [
70047010
createVNode('nav', _hoisted_4$6, [
70057011
createVNode('div', _hoisted_5$3, [
@@ -7280,15 +7286,15 @@ function render$9(_ctx, _cache, $props, $setup, $data, $options) {
72807286
)
72817287
}
72827288

7283-
script$9.render = render$9
7289+
script$a.render = render$a
72847290

7285-
var _hoisted_1$8 = {
7291+
var _hoisted_1$9 = {
72867292
xmlns: 'http://www.w3.org/2000/svg',
72877293
viewBox: '0 0 1000 320',
72887294
fill: 'currentColor',
72897295
}
72907296

7291-
var _hoisted_2$7 = /*#__PURE__*/ createVNode(
7297+
var _hoisted_2$8 = /*#__PURE__*/ createVNode(
72927298
'g',
72937299
null,
72947300
[
@@ -7364,24 +7370,24 @@ var _hoisted_2$7 = /*#__PURE__*/ createVNode(
73647370
-1
73657371
)
73667372

7367-
function render$8(_ctx, _cache) {
7368-
return openBlock(), createBlock('svg', _hoisted_1$8, [_hoisted_2$7])
7373+
function render$9(_ctx, _cache) {
7374+
return openBlock(), createBlock('svg', _hoisted_1$9, [_hoisted_2$8])
73697375
}
73707376

7371-
var script$8 = {}
7372-
script$8.render = render$8
7377+
var script$9 = {}
7378+
script$9.render = render$9
73737379

7374-
var script$7 = defineComponent({
7380+
var script$8 = defineComponent({
73757381
setup: function setup() {},
73767382
components: {
7377-
OpenJSLogo: script$8,
7383+
OpenJSLogo: script$9,
73787384
},
73797385
})
73807386

7381-
var _hoisted_1$7 = {
7387+
var _hoisted_1$8 = {
73827388
class: '',
73837389
}
7384-
var _hoisted_2$6 = {
7390+
var _hoisted_2$7 = {
73857391
class:
73867392
'px-4 pt-10 pb-4 mx-auto max-w-7xl sm:px-6 md:flex md:items-center md:justify-between lg:px-6',
73877393
}
@@ -7561,13 +7567,13 @@ var _hoisted_9$1 = /*#__PURE__*/ createStaticVNode(
75617567
1
75627568
)
75637569

7564-
function render$7(_ctx, _cache, $props, $setup, $data, $options) {
7570+
function render$8(_ctx, _cache, $props, $setup, $data, $options) {
75657571
var _component_OpenJSLogo = resolveComponent('OpenJSLogo')
75667572

75677573
return (
75687574
openBlock(),
7569-
createBlock('footer', _hoisted_1$7, [
7570-
createVNode('div', _hoisted_2$6, [
7575+
createBlock('footer', _hoisted_1$8, [
7576+
createVNode('div', _hoisted_2$7, [
75717577
_hoisted_3$5,
75727578
createVNode('div', _hoisted_4$5, [
75737579
createVNode('a', _hoisted_5$2, [
@@ -7592,7 +7598,7 @@ function render$7(_ctx, _cache, $props, $setup, $data, $options) {
75927598
)
75937599
}
75947600

7595-
script$7.render = render$7
7601+
script$8.render = render$8
75967602

75977603
function _defineProperty(obj, key, value) {
75987604
if (key in obj) {
@@ -8021,7 +8027,7 @@ function createChildren(children) {
80218027
// }))
80228028
// }
80238029

8024-
var script$6 = defineComponent({
8030+
var script$7 = defineComponent({
80258031
setup: function setup() {
80268032
var items = useSideBar()
80278033
return {
@@ -8033,16 +8039,16 @@ var script$6 = defineComponent({
80338039
},
80348040
})
80358041

8036-
var _hoisted_1$6 = {
8042+
var _hoisted_1$7 = {
80378043
key: 0,
80388044
class: '',
80398045
}
8040-
function render$6(_ctx, _cache, $props, $setup, $data, $options) {
8046+
function render$7(_ctx, _cache, $props, $setup, $data, $options) {
80418047
var _component_SideBarLink = resolveComponent('SideBarLink')
80428048

80438049
return _ctx.items.length > 0
80448050
? (openBlock(),
8045-
createBlock('ul', _hoisted_1$6, [
8051+
createBlock('ul', _hoisted_1$7, [
80468052
(openBlock(true),
80478053
createBlock(
80488054
Fragment,
@@ -8068,6 +8074,105 @@ function render$6(_ctx, _cache, $props, $setup, $data, $options) {
80688074
: createCommentVNode('', true)
80698075
}
80708076

8077+
script$7.render = render$7
8078+
8079+
var script$6 = defineComponent({
8080+
setup: function setup() {
8081+
var items = useSideBar()
8082+
var route = useRoute()
8083+
var router = useRouter()
8084+
var isSelected = computed(function () {
8085+
return function (link) {
8086+
return route.path.includes(link)
8087+
}
8088+
})
8089+
return {
8090+
items: items,
8091+
route: route,
8092+
isSelected: isSelected,
8093+
onChange: function onChange(event) {
8094+
router.go(event.target.value)
8095+
},
8096+
}
8097+
},
8098+
})
8099+
8100+
var _hoisted_1$6 = {
8101+
class: 'bg-blue-50 lg:hidden',
8102+
}
8103+
var _hoisted_2$6 = {
8104+
class: 'mx-auto p-4 px-6',
8105+
}
8106+
function render$6(_ctx, _cache, $props, $setup, $data, $options) {
8107+
return (
8108+
openBlock(),
8109+
createBlock('div', _hoisted_1$6, [
8110+
createVNode('div', _hoisted_2$6, [
8111+
createVNode(
8112+
'select',
8113+
{
8114+
onChange:
8115+
_cache[1] ||
8116+
(_cache[1] = function () {
8117+
return _ctx.onChange && _ctx.onChange.apply(_ctx, arguments)
8118+
}),
8119+
class: 'w-full p-2',
8120+
title: 'Navigation',
8121+
},
8122+
[
8123+
(openBlock(true),
8124+
createBlock(
8125+
Fragment,
8126+
null,
8127+
renderList(_ctx.items, function (item) {
8128+
return (
8129+
openBlock(),
8130+
createBlock(
8131+
'optgroup',
8132+
{
8133+
label: item.text,
8134+
key: item.text,
8135+
},
8136+
[
8137+
(openBlock(true),
8138+
createBlock(
8139+
Fragment,
8140+
null,
8141+
renderList(item.children, function (child) {
8142+
return (
8143+
openBlock(),
8144+
createBlock(
8145+
'option',
8146+
{
8147+
key: child,
8148+
value: child.link,
8149+
text: child.text,
8150+
selected: _ctx.isSelected(child.link),
8151+
},
8152+
null,
8153+
8,
8154+
['value', 'text', 'selected']
8155+
)
8156+
)
8157+
}),
8158+
128
8159+
)),
8160+
],
8161+
8,
8162+
['label']
8163+
)
8164+
)
8165+
}),
8166+
128
8167+
)),
8168+
],
8169+
32
8170+
),
8171+
]),
8172+
])
8173+
)
8174+
}
8175+
80718176
script$6.render = render$6
80728177

80738178
var _hoisted_1$5 = {
@@ -8400,8 +8505,9 @@ script$4.__scopeId = 'data-v-2dcc8330'
84008505
var script$3 = defineComponent({
84018506
setup: function setup() {},
84028507
components: {
8403-
Header: script$9,
8404-
SideBar: script$6,
8508+
Header: script$a,
8509+
SideBar: script$7,
8510+
MobileNavigation: script$6,
84058511
SubHeader: script$5,
84068512
OnThisPage: script$4,
84078513
},
@@ -8476,6 +8582,8 @@ var _hoisted_15 = /*#__PURE__*/ createVNode(
84768582
function render$3(_ctx, _cache, $props, $setup, $data, $options) {
84778583
var _component_Header = resolveComponent('Header')
84788584

8585+
var _component_MobileNavigation = resolveComponent('MobileNavigation')
8586+
84798587
var _component_SideBar = resolveComponent('SideBar')
84808588

84818589
var _component_Content = resolveComponent('Content')
@@ -8490,13 +8598,15 @@ function render$3(_ctx, _cache, $props, $setup, $data, $options) {
84908598
createVNode(
84918599
_component_Header,
84928600
{
8601+
class: 'nav-bar',
84938602
nav: _ctx.$themeConfig.nav,
84948603
mainURL: _ctx.$themeConfig.mainURL,
84958604
},
84968605
null,
84978606
8,
84988607
['nav', 'mainURL']
84998608
),
8609+
createVNode(_component_MobileNavigation),
85008610
createVNode('div', _hoisted_2$3, [
85018611
createVNode('div', _hoisted_3$3, [
85028612
createVNode('div', _hoisted_4$3, [

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.