🎨 (fab) update fab button z index to overlap bulma select dropdown icon

This commit is contained in:
Julien Calixte
2020-03-14 22:10:28 +01:00
parent 649ce4eb31
commit 1911b30f98
2 changed files with 19 additions and 24 deletions

View File

@@ -6,7 +6,8 @@
:class="getClass" :class="getClass"
:style="buttonStyle" :style="buttonStyle"
:to="to" :to="to"
@click.native="valid"> @click.native="valid"
>
<span class="icon is-medium"> <span class="icon is-medium">
<slot> <slot>
<awe-icon icon="plus" /> <awe-icon icon="plus" />
@@ -22,7 +23,8 @@
class="button is-primary is-large is-fab" class="button is-primary is-large is-fab"
:class="getClass" :class="getClass"
:style="buttonStyle" :style="buttonStyle"
@click="valid"> @click="valid"
>
<span class="icon is-medium"> <span class="icon is-medium">
<slot> <slot>
<awe-icon icon="plus" /> <awe-icon icon="plus" />
@@ -46,7 +48,7 @@ export default class Home extends Vue {
public margin!: boolean public margin!: boolean
@Prop({ type: Object, default: () => null }) @Prop({ type: Object, default: () => null })
public to!: any | null public to!: any | null
@Prop({ type: Object, required: false, default: () => ({})}) @Prop({ type: Object, required: false, default: () => ({}) })
public buttonStyle!: any public buttonStyle!: any
public uniqueId: string = Date.now().toString() public uniqueId: string = Date.now().toString()
public isLoading: boolean = false public isLoading: boolean = false
@@ -59,14 +61,17 @@ export default class Home extends Vue {
const main = document.getElementById('main') const main = document.getElementById('main')
const fabElm = document.getElementById(`fab-${this.uniqueId}`) const fabElm = document.getElementById(`fab-${this.uniqueId}`)
if (main && fabElm) { if (main && fabElm) {
document.addEventListener('scroll', throttle((evt) => { document.addEventListener(
'scroll',
throttle((evt) => {
this.showFull = main.getBoundingClientRect().top > 0 this.showFull = main.getBoundingClientRect().top > 0
if (this.showFull) { if (this.showFull) {
fabElm.classList.remove('small') fabElm.classList.remove('small')
} else { } else {
fabElm.classList.add('small') fabElm.classList.add('small')
} }
}, 150)) }, 150)
)
} }
} }
@@ -119,7 +124,7 @@ $padding-fab: 24px;
bottom: $padding-fab; bottom: $padding-fab;
position: fixed; position: fixed;
right: $padding-fab; right: $padding-fab;
z-index: 2; z-index: 5;
border: 2px solid $white; border: 2px solid $white;
} }

View File

@@ -25,10 +25,7 @@ if (process.env.NODE_ENV === 'production') {
registrationOptions: {}, registrationOptions: {},
ready() { ready() {
notif.success('Application mise à jour !') notif.success('Application mise à jour !')
console.log( console.log('App is being served from cache by a service worker.')
'App is being served from cache by a service worker.\n' +
'For more details, visit https://goo.gl/AFskqB'
)
}, },
cached() { cached() {
console.log('Content has been cached for offline use.') console.log('Content has been cached for offline use.')
@@ -54,6 +51,7 @@ if (process.env.NODE_ENV === 'production') {
}, },
updated() { updated() {
console.log('New content is available; please refresh.') console.log('New content is available; please refresh.')
location.reload(true)
}, },
offline() { offline() {
console.log( console.log(
@@ -64,12 +62,4 @@ if (process.env.NODE_ENV === 'production') {
console.error('Error during service worker registration:', error) console.error('Error during service worker registration:', error)
} }
}) })
let refreshing: any | undefined
navigator.serviceWorker.addEventListener('controllerchange', () => {
if (refreshing) {
return
}
window.location.reload()
refreshing = true
})
} }