mirror of
https://github.com/btcpayserver/btcpayserver.git
synced 2025-03-10 09:19:24 +01:00
UI: Offcanvas fixes
This commit is contained in:
parent
bd91c45d1f
commit
672491c66c
6 changed files with 10 additions and 8 deletions
|
@ -142,7 +142,7 @@
|
||||||
Empty
|
Empty
|
||||||
</button>
|
</button>
|
||||||
<button id="CartClose" type="button" class="cart-toggle-btn" v-on:click="toggleCart" aria-controls="cart" aria-label="Close">
|
<button id="CartClose" type="button" class="cart-toggle-btn" v-on:click="toggleCart" aria-controls="cart" aria-label="Close">
|
||||||
<vc:icon symbol="close" />
|
<vc:icon symbol="cross" />
|
||||||
</button>
|
</button>
|
||||||
</header>
|
</header>
|
||||||
<div class="offcanvas-body py-0">
|
<div class="offcanvas-body py-0">
|
||||||
|
|
|
@ -81,7 +81,7 @@
|
||||||
<vc:icon symbol="nav-mobile-menu"/>
|
<vc:icon symbol="nav-mobile-menu"/>
|
||||||
</button>
|
</button>
|
||||||
<div class="offcanvas offcanvas-end" data-bs-backdrop="static" tabindex="-1" id="ItemsListOffcanvas" aria-labelledby="ItemsListToggle" v-if="showItems">
|
<div class="offcanvas offcanvas-end" data-bs-backdrop="static" tabindex="-1" id="ItemsListOffcanvas" aria-labelledby="ItemsListToggle" v-if="showItems">
|
||||||
<div class="offcanvas-header flex-wrap p-3">
|
<div class="offcanvas-header justify-content-between flex-wrap p-3">
|
||||||
<h5 class="offcanvas-title" id="offcanvasExampleLabel">Products</h5>
|
<h5 class="offcanvas-title" id="offcanvasExampleLabel">Products</h5>
|
||||||
<button type="button" class="btn btn-sm rounded-pill" :class="{ 'btn-primary': cart.length > 0, 'btn-outline-secondary': cart.length === 0}" data-bs-dismiss="offcanvas" v-text="cart.length > 0 ? 'Apply' : 'Close'"></button>
|
<button type="button" class="btn btn-sm rounded-pill" :class="{ 'btn-primary': cart.length > 0, 'btn-outline-secondary': cart.length === 0}" data-bs-dismiss="offcanvas" v-text="cart.length > 0 ? 'Apply' : 'Close'"></button>
|
||||||
@if (Model.ShowSearch)
|
@if (Model.ShowSearch)
|
||||||
|
|
|
@ -151,7 +151,7 @@
|
||||||
class="bg-tile pb-2 rounded" />
|
class="bg-tile pb-2 rounded" />
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xl-5 offcanvas-xl offcanvas-end" tabindex="-1" ref="editorOffcanvas">
|
<div class="col-xl-5 offcanvas-xl offcanvas-end" tabindex="-1" ref="editorOffcanvas">
|
||||||
<div class="offcanvas-header p-3">
|
<div class="offcanvas-header justify-content-between p-3">
|
||||||
<h5 class="offcanvas-title">Edit Item</h5>
|
<h5 class="offcanvas-title">Edit Item</h5>
|
||||||
<button type="button" class="btn btn-sm rounded-pill" :class="{ 'btn-primary': itemChanged, 'btn-outline-secondary': !itemChanged }" v-on:click="hideOffcanvas" v-text="itemChanged ? 'Apply' : 'Close'"></button>
|
<button type="button" class="btn btn-sm rounded-pill" :class="{ 'btn-primary': itemChanged, 'btn-outline-secondary': !itemChanged }" v-on:click="hideOffcanvas" v-text="itemChanged ? 'Apply' : 'Close'"></button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -270,7 +270,7 @@
|
||||||
class="bg-tile pb-2 rounded" />
|
class="bg-tile pb-2 rounded" />
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xl-5 offcanvas-xl offcanvas-end" tabindex="-1" ref="editorOffcanvas">
|
<div class="col-xl-5 offcanvas-xl offcanvas-end" tabindex="-1" ref="editorOffcanvas">
|
||||||
<div class="offcanvas-header p-3">
|
<div class="offcanvas-header justify-content-between p-3">
|
||||||
<h5 class="offcanvas-title">Edit Field</h5>
|
<h5 class="offcanvas-title">Edit Field</h5>
|
||||||
<button type="button" class="btn-close" aria-label="Close" v-on:click="hideOffcanvas">
|
<button type="button" class="btn-close" aria-label="Close" v-on:click="hideOffcanvas">
|
||||||
<vc:icon symbol="close" />
|
<vc:icon symbol="close" />
|
||||||
|
|
|
@ -222,11 +222,12 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||||
return fields
|
return fields
|
||||||
},
|
},
|
||||||
showOffcanvas() {
|
showOffcanvas() {
|
||||||
if (window.getComputedStyle(this.$refs.editorOffcanvas).visibility === 'hidden')
|
if (this.editorOffcanvas && window.getComputedStyle(this.$refs.editorOffcanvas).visibility === 'hidden')
|
||||||
this.editorOffcanvas.show();
|
this.editorOffcanvas.show();
|
||||||
},
|
},
|
||||||
hideOffcanvas() {
|
hideOffcanvas() {
|
||||||
this.editorOffcanvas.hide();
|
if (this.editorOffcanvas)
|
||||||
|
this.editorOffcanvas.hide();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted () {
|
mounted () {
|
||||||
|
|
|
@ -298,11 +298,12 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||||
this.items.splice(newIndex, 0, this.items.splice(oldIndex, 1)[0])
|
this.items.splice(newIndex, 0, this.items.splice(oldIndex, 1)[0])
|
||||||
},
|
},
|
||||||
showOffcanvas() {
|
showOffcanvas() {
|
||||||
if (window.getComputedStyle(this.$refs.editorOffcanvas).visibility === 'hidden')
|
if (this.editorOffcanvas && window.getComputedStyle(this.$refs.editorOffcanvas).visibility === 'hidden')
|
||||||
this.editorOffcanvas.show();
|
this.editorOffcanvas.show();
|
||||||
},
|
},
|
||||||
hideOffcanvas() {
|
hideOffcanvas() {
|
||||||
this.editorOffcanvas.hide();
|
if (this.editorOffcanvas)
|
||||||
|
this.editorOffcanvas.hide();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
|
|
Loading…
Add table
Reference in a new issue