Skip to content
Snippets Groups Projects
Commit 0a07d705 authored by xaralis's avatar xaralis
Browse files

Better naming for subnav items

parent 5557e00e
No related branches found
No related tags found
No related merge requests found
<div class="__js-root" data-app="Subnav">
<ui-subnav inline-template>
<ui-subnav-view-provider :initial="{regions: false, calendar: false}" v-slot="{ showView, toggleView }">
<ui-subnav-view-provider :initial="{regions: false, calendar: false}" v-slot="{ isCurrentView, toggleView }">
<nav class="subnav">
<div class="container container--wide">
<div class="flex">
<button
@click="toggleView('regions')"
class="btn btn--condensed btn--grey-500 btn--overlay btn--overlay-white text-sm mr-2"
:class="{'btn--overlay-active': showView('regions')}"
:class="{'btn--overlay-active': isCurrentView('regions')}"
>
<div class="btn__body">
<span>Pardubický kraj</span>
......@@ -18,7 +18,7 @@
<button
@click="toggleView('calendar')"
class="btn btn--inline-icon btn--condensed btn--overlay btn--grey-500 btn--overlay-red-100 text-sm"
:class="{'btn--overlay-active': showView('calendar')}"
:class="{'btn--overlay-active': isCurrentView('calendar')}"
>
<div class="btn__body">
<i class="btn__inline-icon fas fa-calendar-alt mr-0 md:mr-2"></i>
......@@ -43,11 +43,11 @@
</div>
</nav>
<aside class="subnav-aside">
<div class="subnav-aside__item" :class="{'subnav-aside__item--visible': showView('regions')}">
<div class="subnav-aside__item" :class="{'subnav-aside__item--visible': isCurrentView('regions')}">
<a @click="toggleView('regions')" class="subnav-aside__close"><i class="fas fa-times"></i></a>
<ui-region-map class="container container--default" />
</div>
<div class="subnav-aside__item" :class="{'subnav-aside__item--visible': showView('calendar')}">
<div class="subnav-aside__item" :class="{'subnav-aside__item--visible': isCurrentView('calendar')}">
<a @click="toggleView('calendar')" class="subnav-aside__close"><i class="fas fa-times"></i></a>
<div class="container container--default">
{{> molecules-calendar }}
......
<template>
<div>
<slot v-bind:views="views" v-bind:showView="showView" v-bind:toggleView="toggleView"></slot>
<slot v-bind:views="views" v-bind:isCurrentView="isCurrentView" v-bind:toggleView="toggleView"></slot>
</div>
</template>
......@@ -33,9 +33,9 @@ export default {
}
});
this.setView(viewId, !this.showView(viewId));
this.setView(viewId, !this.isCurrentView(viewId));
},
showView(viewId) {
isCurrentView(viewId) {
return this.$data.views[viewId];
},
hideAllViews() {
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment