Vue

by zoomieos

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/framework7/4.1.0/js/framework7.min.js"></script>
<template>
    <f7-page class="style__test">
        <f7-navbar>
            <f7-nav-left>
                <f7-link icon="icon-bars" panel-open="left">
                    <img :src="dropdown">
                </f7-link>
            </f7-nav-left>
            <f7-nav-title style="color: white" large>
                Fuel
            </f7-nav-title>
            <f7-nav-right>
                <f7-link>
                    <img :src="headerCar">
                </f7-link>
                <f7-link>
       <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" viewBox="0 0 511.746 511.746" style="fill: white; enable-background:new 0 0 511.746 511.746;" xml:space="preserve" width="20" height="20">
<g>
	<path d="M421.74,39.391V9.388h-30v30.003H120.006V9.388h-30v30.003H0v462.967h511.746V39.391H421.74z M90.006,69.391v30.003h30   V69.391H391.74v30.003h30V69.391h60.006v60.005H30V69.391H90.006z M30,472.358V159.396h451.746v312.962H30z"/>
    <rect x="79.393" y="199.401" width="52.941" height="52.941"/>
    <rect x="179.398" y="199.401" width="52.942" height="52.941"/>
    <rect x="279.405" y="199.401" width="52.941" height="52.941"/>
    <rect x="379.411" y="199.401" width="52.942" height="52.941"/>
    <rect x="79.393" y="289.406" width="52.941" height="52.941"/>
    <rect x="179.398" y="289.406" width="52.942" height="52.941"/>
    <rect x="279.405" y="289.406" width="52.941" height="52.941"/>
    <rect x="379.411" y="289.406" width="52.942" height="52.941"/>
    <rect x="79.393" y="379.412" width="52.941" height="52.941"/>
    <rect x="179.398" y="379.412" width="52.942" height="52.941"/>
    <rect x="279.405" y="379.412" width="52.941" height="52.941"/>
    <rect x="379.411" y="379.412" width="52.942" height="52.941"/>
</g>
</svg>
                </f7-link>
            </f7-nav-right>
       ...