Skip to content

Commit a7da979

Browse files
webdevnerdstuffwebdevnerdstuff
committed
Debugging and testing
1 parent 5d44b7f commit a7da979

File tree

5 files changed

+37
-30
lines changed

5 files changed

+37
-30
lines changed

‎docs/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,4 @@
33
function gtag() { dataLayer.push(arguments); }
44
gtag('js', new Date());
55

6-
gtag('config', 'UA-XXXXXXXXX-X');</script><meta name="base" content="https://webdevnerdstuff.github.io/vuetify-resize-drawer/"><meta name="charset" content="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="keywords" content="vuetify-resize-drawer, vuetifyResizeDrawer, v-resize-drawer, vResizeDrawer, vuetify, navigation drawer, v-navigation-drawer, vNavigationDrawer, api, drawer, resize, resizable, vue, vue2, component, javascript, webdevnerdstuff, wdns"><meta name="description" content="The vuetify-resize-drawer component extends the functionality of the v-navigation-drawer so that it is resizable by the user."><meta name="author" content="WebDevNerdStuff & Bunnies... lots and lots of bunnies! <webdevnerdstuff@gmail.com> (https://webdevnerdstuff.com)"><meta name="robots" content="index, follow"><meta name="googlebot" content="index, follow"><meta name="rating" content="General"><meta name="theme-color" content="#21252a"><meta name="og:type" content="website"><meta name="og:title" content="Vuetify Resize Drawer"><meta name="og:image" content="https://webdevnerdstuff.github.io/vuetify-resize-drawer/images/vuetify-resize-drawer-social.jpg"><meta name="og:image:alt" content="The vuetify-resize-drawer component extends the functionality of the v-navigation-drawer so that it is resizable by the user."><meta name="og:image:width" content="1200"><meta name="og:image:height" content="630"><meta name="og:description" content="The vuetify-resize-drawer component extends the functionality of the v-navigation-drawer so that it is resizable by the user."><meta name="og:site_name" content="Vuetify Resize Drawer"><meta name="og:locale" content="en_US"></head><body><noscript><strong>We're sorry but Vuetify Resize Drawer doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script><script defer="defer" src="vuetify-resize-drawer.js?03bff5b28bf618d2e9f8"></script></body></html>
6+
gtag('config', 'UA-XXXXXXXXX-X');</script><meta name="base" content="https://webdevnerdstuff.github.io/vuetify-resize-drawer/"><meta name="charset" content="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="keywords" content="vuetify-resize-drawer, vuetifyResizeDrawer, v-resize-drawer, vResizeDrawer, vuetify, navigation drawer, v-navigation-drawer, vNavigationDrawer, api, drawer, resize, resizable, vue, vue2, component, javascript, webdevnerdstuff, wdns"><meta name="description" content="The vuetify-resize-drawer component extends the functionality of the v-navigation-drawer so that it is resizable by the user."><meta name="author" content="WebDevNerdStuff & Bunnies... lots and lots of bunnies! <webdevnerdstuff@gmail.com> (https://webdevnerdstuff.com)"><meta name="robots" content="index, follow"><meta name="googlebot" content="index, follow"><meta name="rating" content="General"><meta name="theme-color" content="#21252a"><meta name="og:type" content="website"><meta name="og:title" content="Vuetify Resize Drawer"><meta name="og:image" content="https://webdevnerdstuff.github.io/vuetify-resize-drawer/images/vuetify-resize-drawer-social.jpg"><meta name="og:image:alt" content="The vuetify-resize-drawer component extends the functionality of the v-navigation-drawer so that it is resizable by the user."><meta name="og:image:width" content="1200"><meta name="og:image:height" content="630"><meta name="og:description" content="The vuetify-resize-drawer component extends the functionality of the v-navigation-drawer so that it is resizable by the user."><meta name="og:site_name" content="Vuetify Resize Drawer"><meta name="og:locale" content="en_US"></head><body><noscript><strong>We're sorry but Vuetify Resize Drawer doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script><script defer="defer" src="vuetify-resize-drawer.js?12cceac7c231424b7f32"></script></body></html>

‎docs/vuetify-resize-drawer.js‎

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

‎src/App.vue‎

Lines changed: 27 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -40,13 +40,17 @@
4040

4141
<!-- ====================================================== Navigation Drawer -->
4242
<v-navigation-drawer
43+
app
4344
v-model="drawer"
4445
clipped
4546
fixed
4647
:right="!drawerOptions.right"
4748
:color="drawerOptions.color"
4849
:mini-variant="drawerOptions.miniVariant"
50+
:mini-variant-width="drawerOptions.miniVariantWidth"
4951
:expand-on-hover="drawerOptions.expandOnHover"
52+
:touchless="drawerOptions.touchless"
53+
:stateless="drawerOptions.stateless"
5054
>
5155
<v-list-item>
5256
<v-list-item-content>
@@ -61,11 +65,15 @@
6165
</v-navigation-drawer>
6266

6367
<v-resize-drawer
68+
app
6469
v-model="drawer"
6570
name="ResizeDrawer"
6671
clipped
6772
fixed
73+
:stateless="drawerOptions.stateless"
74+
:touchless="drawerOptions.touchless"
6875
:mini-variant="drawerOptions.miniVariant"
76+
:mini-variant-width="drawerOptions.miniVariantWidth"
6977
:expand-on-hover="drawerOptions.expandOnHover"
7078
:color="drawerOptions.color"
7179
:dark="drawerOptions.dark"
@@ -156,21 +164,30 @@ export default {
156164
dark: false,
157165
drawer: true,
158166
drawerOptions: {
167+
// color: undefined,
168+
// dark: false,
169+
// handlePosition: 'center',
170+
// light: false,
171+
resizable: true,
172+
right: false,
173+
stateless: false,
174+
touchless: false,
175+
176+
// TODO: Maybe try to get this working with the built in width prop //
159177
width: '256px',
160-
// Should be good / Updated //
161-
color: undefined,
162-
light: false,
163-
// Updated //
164-
dark: false,
165-
handlePosition: 'center',
166-
miniVariant: true,
167-
expandOnHover: true,
178+
179+
// overlay //
168180
overlayColor: '#f00',
169181
overlayOpacity: '100%',
170-
resizable: true,
171-
right: false,
182+
183+
// storage //
172184
saveWidth: true,
173185
storageName: 'vuetify-resize-drawer',
186+
187+
// mini-variant //
188+
expandOnHover: false,
189+
miniVariant: false,
190+
miniVariantWidth: 56,
174191
},
175192
drawerOffset: '256px',
176193
links: {

‎src/components/VResizeDrawer.vue‎

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,9 @@
55
class="v-resize-drawer"
66
:class="classes"
77
:style="styles"
8-
:tag="tag"
8+
tag="nav"
99
:value="value"
10+
:stateless="stateless"
1011
:width="drawerOptions.width"
1112
>
1213
<!-- Resize handle -->
@@ -164,7 +165,6 @@ export default {
164165
computed: {
165166
classes() {
166167
return {
167-
'v-navigation-drawer': true,
168168
'v-navigation-drawer--absolute': this.absolute,
169169
'v-navigation-drawer--bottom': this.bottom,
170170
'v-navigation-drawer--clipped': this.clipped,
@@ -175,7 +175,6 @@ export default {
175175
'v-navigation-drawer--is-mouseover': this.isMouseover,
176176
'v-navigation-drawer--mini-variant': this.isMiniVariant,
177177
'v-navigation-drawer--custom-mini-variant': Number(this.miniVariantWidth) !== 56,
178-
'v-navigation-drawer--open': this.isActive,
179178
'v-navigation-drawer--open-on-hover': this.expandOnHover,
180179
'v-navigation-drawer--right': this.right,
181180
'v-navigation-drawer--temporary': this.temporary,
@@ -264,7 +263,6 @@ export default {
264263
},
265264
},
266265
mounted() {
267-
console.log(this);
268266
this.setLocalStorage('set');
269267
},
270268
beforeDestroy() {
@@ -486,11 +484,8 @@ export default {
486484
return false;
487485
}
488486
489-
console.log('blarg');
490-
491487
const intWidth = typeof width === 'number' ? width : width.replace('px', '');
492488
493-
console.log({ intWidth });
494489
if (this.right) {
495490
this.$vuetify.application.right = intWidth;
496491
return false;

‎src/components/documentation/Props.vue‎

Lines changed: 5 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -357,7 +357,7 @@ export default {
357357
{
358358
name: 'disable-route-watcher',
359359
status: 'pending',
360-
notes: 'An environment that uses routes is need to test.',
360+
notes: 'An environment that uses routes is needed to test.',
361361
},
362362
{
363363
name: 'expand-on-hover',
@@ -376,18 +376,13 @@ export default {
376376
},
377377
{
378378
name: 'mobile-breakpoint',
379-
status: 'pending',
380-
notes: 'Needs a successful test to figure out if this works.',
381-
},
382-
{
383-
name: 'stateless',
384-
status: 'pending',
385-
notes: 'Needs a successful test to figure out if this works.',
379+
status: 'needs testing',
380+
notes: 'Needs a successful pass/fail test to figure out if this works.',
386381
},
387382
{
388383
name: 'touchless',
389-
status: 'pending',
390-
notes: 'Needs a successful test to figure out if this works.',
384+
status: 'debugging',
385+
notes: 'Drawer does not function like it should with <code>touchless</code> enabled.',
391386
},
392387
{
393388
name: 'width',

0 commit comments

Comments
 (0)