Untitled
unknown
plain_text
2 years ago
1.6 kB
2
Indexable
<template> <div class="menu-container"> <div class="menu"> <MenuSelectorComponent name="ANALYTICS" path="/analytics/" :active="view === 'analytics'"></MenuSelectorComponent> <MenuSelectorComponent name="LOG" path="/log/" :active="view === 'log'"></MenuSelectorComponent> <div></div> <img :src=logo width="40" class="img_navbar" /> <p class="h1-console">Feedback admin pannel</p> </div> </div> </template> <script> import MenuSelectorComponent from './MenuSelectorComponent.vue' export default { components: { MenuSelectorComponent }, name: 'MenuComponent', props: { view: String }, data: function () { return { logo: require('../../assets/data/veolia.png') } } } </script> <style scoped> .h1-console { justify-content: flex-end; margin-left: auto; } .img_navbar { justify-content: flex-end; margin-left: auto; } .menu-container { width: auto; z-index: 1; padding: 10px; } .menu { background-color: #fefaec; height: 40px; border-radius: 7px; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; gap: 0px; padding: 15px; width: auto; } @media (max-width: 720px) { .menu-container { top: 0; width: auto; z-index: 1; padding: 0px; } .menu { background-color: #fefaec; height: 65px; border-radius: 0px; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; gap: 0px; padding: 3px; width: auto; border-radius: 7px; padding: 15px; } } </style>
Editor is loading...