diff --git a/source/_patterns/02-organisms/00-global/subnav.mustache b/source/_patterns/02-organisms/00-global/subnav.mustache index e47e4b21e54e94d390b8b48745c03a928ac2f228..ddf7810944895d4904db4c08c6b12568ef1fbb57 100644 --- a/source/_patterns/02-organisms/00-global/subnav.mustache +++ b/source/_patterns/02-organisms/00-global/subnav.mustache @@ -1,13 +1,13 @@ <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 }} diff --git a/source/js/apps/subnav/SubnavViewProvider.vue b/source/js/apps/subnav/SubnavViewProvider.vue index 7aa4c27cef873619f7c2c1610163687bf8af59e6..40632c7d5bb36a6c9331e7d11b54f67ead6d0b44 100644 --- a/source/js/apps/subnav/SubnavViewProvider.vue +++ b/source/js/apps/subnav/SubnavViewProvider.vue @@ -1,6 +1,6 @@ <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() {