mirror of
https://thingvellir.net/git/overte
synced 2025-03-27 23:52:03 +01:00
Merge pull request #140 from kasenvr/feature/js-doc-menu-hide
API Docs viewport restriction removal + menu toggle
This commit is contained in:
kasenvr
GitHub
commit
3a3c2750bc
3 changed files with 110 additions and 72 deletions
0
tools/jsdoc/hifi-jsdoc-template/static/styles/main.css
Normal file
0
tools/jsdoc/hifi-jsdoc-template/static/styles/main.css
Normal file
17
tools/jsdoc/hifi-jsdoc-template/static/styles/responsive.css
Normal file
17
tools/jsdoc/hifi-jsdoc-template/static/styles/responsive.css
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
.nav-header {
|
||||
display: none;
|
||||
}
|
||||
|
||||
nav {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
section {
|
||||
margin-right: 0px !important;
|
||||
}
|
||||
|
||||
#main {
|
||||
margin-left: 15px !important;
|
||||
margin-right: 15px !important;
|
||||
overflow: auto;
|
||||
}
|
||||
|
|
@ -4,10 +4,10 @@
|
|||
<?js if (!env.conf.docdash) { env.conf.docdash = {};} ?>
|
||||
<meta charset="utf-8">
|
||||
<title><?js= title ?></title>
|
||||
|
||||
<script src="scripts/vue.min.js"></script>
|
||||
<script src="scripts/vuetify.js"></script>
|
||||
|
||||
|
||||
<script src="scripts/vue.min.js"></script>
|
||||
<script src="scripts/vuetify.js"></script>
|
||||
|
||||
<script src="scripts/prettify/prettify.js"></script>
|
||||
<script src="scripts/prettify/lang-css.js"></script>
|
||||
<!--[if lt IE 9]>
|
||||
|
|
@ -15,55 +15,68 @@
|
|||
<![endif]-->
|
||||
<link type="text/css" rel="stylesheet" href="styles/prettify.css">
|
||||
<link type="text/css" rel="stylesheet" href="styles/jsdoc.css">
|
||||
<link type="text/css" rel="stylesheet" href="styles/night.css">
|
||||
<link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/css?family=Material+Icons|Material+Icons+Outlined|Material+Icons+Two+Tone|Material+Icons+Round|Material+Icons+Sharp" rel="stylesheet">
|
||||
<link href="styles/materialdesignicons.min.css" rel="stylesheet">
|
||||
<link href="styles/vuetify.css" rel="stylesheet">
|
||||
<style>
|
||||
.v-application--wrap {
|
||||
min-height: 0 !important;
|
||||
}
|
||||
|
||||
/** Override Vue CSS. */
|
||||
.theme--dark.v-application {
|
||||
background: #27343b !important;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
//We are running the check here to preload the theme because it may load the incorrect one first for a split second.
|
||||
var darkDisabled = JSON.parse(localStorage.getItem('darkDisabled'));
|
||||
if (darkDisabled == null) {
|
||||
localStorage.setItem('darkDisabled', JSON.stringify(false));
|
||||
} else {
|
||||
var nightSheet = document.querySelector('[href="styles/night.css"]');
|
||||
nightSheet.disabled = darkDisabled;
|
||||
}
|
||||
</script>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
|
||||
<link type="text/css" rel="stylesheet" href="styles/night.css">
|
||||
<link type="text/css" rel="stylesheet" href="styles/responsive.css">
|
||||
<link type="text/css" rel="stylesheet" href="styles/main.css">
|
||||
<link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/css?family=Material+Icons|Material+Icons+Outlined|Material+Icons+Two+Tone|Material+Icons+Round|Material+Icons+Sharp" rel="stylesheet">
|
||||
<link href="styles/materialdesignicons.min.css" rel="stylesheet">
|
||||
<link href="styles/vuetify.css" rel="stylesheet">
|
||||
<style>
|
||||
.v-application--wrap {
|
||||
min-height: 0 !important;
|
||||
}
|
||||
|
||||
/** Override Vue CSS. */
|
||||
.theme--dark.v-application {
|
||||
background: #27343b !important;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
//We are running the check here to preload the theme because it may load the incorrect one first for a split second.
|
||||
var darkDisabled = JSON.parse(localStorage.getItem('darkDisabled'));
|
||||
if (darkDisabled == null) {
|
||||
localStorage.setItem('darkDisabled', JSON.stringify(false));
|
||||
} else {
|
||||
var nightSheet = document.querySelector('[href="styles/night.css"]');
|
||||
nightSheet.disabled = darkDisabled;
|
||||
}
|
||||
|
||||
var responsiveDisabled = JSON.parse(localStorage.getItem('responsiveDisabled'));
|
||||
if (responsiveDisabled === null) {
|
||||
localStorage.setItem('responsiveDisabled', JSON.stringify(true));
|
||||
} else {
|
||||
var responsiveSheet = document.querySelector('[href="styles/responsive.css"]');
|
||||
responsiveSheet.disabled = responsiveDisabled;
|
||||
}
|
||||
</script>
|
||||
<!-- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui"> -->
|
||||
<link href="images/fav-icon.ico" rel="shortcut icon">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="nav-header">
|
||||
<p><a href="https://projectathena.io"><img src="images/project-athena-logo.png" width="214px" /></a></p>
|
||||
<?js if (env.conf.docdash.search) { ?>
|
||||
<input type="text" class="search-input" id="nav-search" placeholder="Search API Docs ..." />
|
||||
<?js } ?>
|
||||
<p><a href="https://docs.projectathena.dev">Looking for <strong>Project Athena</strong><br /> Documentation?</a></p>
|
||||
<div id="app">
|
||||
<v-app dark>
|
||||
<v-btn @click="toggleNightMode" text dark>
|
||||
Toggle
|
||||
<v-icon class="ml-2">mdi-theme-light-dark</v-icon>
|
||||
</v-btn>
|
||||
</v-app>
|
||||
<v-app dark>
|
||||
<div id="vue-menu">
|
||||
<template>
|
||||
<v-btn @click="toggleResponsive" fab large dark style="position: fixed; right: 15px; top: 15px;">
|
||||
<v-icon class="ml-4">mdi-backburger</v-icon>
|
||||
</v-btn>
|
||||
<div class="nav-header">
|
||||
<p><a href="https://projectathena.io"><img src="images/project-athena-logo.png" width="214px" /></a></p>
|
||||
<?js if (env.conf.docdash.search) { ?>
|
||||
<input type="text" class="search-input" id="nav-search" placeholder="Search API Docs ..." />
|
||||
<?js } ?>
|
||||
<p><a href="https://docs.projectathena.dev">Looking for <strong>Project Athena</strong><br /> Documentation?</a></p>
|
||||
<v-btn @click="toggleNightMode" text dark>
|
||||
<span>Toggle</span>
|
||||
<v-icon style="margin-left: 5px;">mdi-theme-light-dark</v-icon>
|
||||
</v-btn>
|
||||
</div>
|
||||
<nav>
|
||||
<?js= this.nav ?>
|
||||
</nav>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<nav>
|
||||
<?js= this.nav ?>
|
||||
</nav>
|
||||
</v-app>
|
||||
|
||||
<div id="main">
|
||||
<h1 class="page-title"><?js= title ?></h1>
|
||||
|
|
@ -109,30 +122,38 @@
|
|||
<?js } ?>
|
||||
|
||||
<script>
|
||||
new Vue({
|
||||
el: '#app',
|
||||
vuetify: new Vuetify({
|
||||
theme: {
|
||||
dark: true,
|
||||
},
|
||||
}),
|
||||
data: () => ({
|
||||
new Vue({
|
||||
el: '#vue-menu',
|
||||
vuetify: new Vuetify({
|
||||
theme: {
|
||||
dark: true,
|
||||
},
|
||||
}),
|
||||
data: () => ({
|
||||
|
||||
}),
|
||||
created: function () {
|
||||
|
||||
},
|
||||
methods: {
|
||||
toggleNightMode: function() {
|
||||
var darkDisabled = JSON.parse(localStorage.getItem('darkDisabled'));
|
||||
localStorage.setItem('darkDisabled', JSON.stringify(!darkDisabled));
|
||||
darkDisabled = !darkDisabled;
|
||||
|
||||
var nightSheet = document.querySelector('[href="styles/night.css"]');
|
||||
nightSheet.disabled = darkDisabled;
|
||||
}
|
||||
},
|
||||
})
|
||||
}),
|
||||
created: function () {
|
||||
|
||||
},
|
||||
methods: {
|
||||
toggleNightMode: function() {
|
||||
var darkDisabled = JSON.parse(localStorage.getItem('darkDisabled'));
|
||||
localStorage.setItem('darkDisabled', JSON.stringify(!darkDisabled));
|
||||
darkDisabled = !darkDisabled;
|
||||
|
||||
var nightSheet = document.querySelector('[href="styles/night.css"]');
|
||||
nightSheet.disabled = darkDisabled;
|
||||
},
|
||||
toggleResponsive: function() {
|
||||
var responsiveDisabled = JSON.parse(localStorage.getItem('responsiveDisabled'));
|
||||
localStorage.setItem('responsiveDisabled', JSON.stringify(!responsiveDisabled));
|
||||
responsiveDisabled = !responsiveDisabled;
|
||||
|
||||
var responsiveSheet = document.querySelector('[href="styles/responsive.css"]');
|
||||
responsiveSheet.disabled = responsiveDisabled;
|
||||
}
|
||||
},
|
||||
})
|
||||
</script>
|
||||
|
||||
<!-- Start Google Analytics Tag -->
|
||||
|
|
|
|||
Loading…
Reference in a new issue