I am developing a webapp with laravel and vuejs. In most mobile devices, the application looks correct but I have a bug with an iphone 7: the icons in the top menu are not shown, showing only the blank bar. The elements exist since you can click them.

This only happens on an iPhone 7, model MN952QL/A. It is an app that opens the browser by default showing https://odour.100x100.net/. The menu is not displayed even if you open the app or access the url from browsers (safari and chrome have the same behavior). I checked that it was not a problem of z-index or that javascript was disabled.

<v-toolbar-side-icon v-show="!create_odours" @click="goCreateOdour"><img :src="add_icon_top"></v-toolbar-side-icon>  

<v-toolbar-side-icon v-show="create_odours" @click="cancelCreateOdour">
    <p class="left-button">Cancel</p>
</v-toolbar-side-icon>

<v-toolbar-title class="text-md-center">
    <div @click="resetAll" class="text-md-center font-weight-regular logo">
        <img class="logo pointer" :src="logo_icon">
    </div>
</v-toolbar-title>  

<v-spacer></v-spacer>  

<v-toolbar-side-icon @click.stop="drawerRight = !drawerRight">
    <img :src="menu_icon">
</v-toolbar-side-icon>

I expect it shows the two buttons and the logo in the top menu but only the white bar is shown.

Related posts

Recent Viewed