Mercurial > gemma
view client/src/components/Sidebar.vue @ 117:5e95c62a7e74
Move component. Re-add Css.
Move components to separate folders.
Re-adding login css to appropriate component
(=undoing ae6535d44563) according to vue style.
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Tue, 26 Jun 2018 17:26:34 +0200 |
parents | |
children | 992e17912405 |
line wrap: on
line source
<template> <div class="sidebar"> <nav class="nav flex-column"> <a class="nav-link active" href="#">Active</a> <a class="nav-link" href="#">Link</a> <a class="nav-link" href="#">Link</a> <a class="nav-link disabled" href="#">Disabled</a> </nav> </div> </template> <script> export default { name: "sidebar", computed: { sidebarStyle() { return { sidebarcollapsed: this.collapsed, sidebarextended: this.collapsed }; } }, data() { return { collapsed: false }; } }; </script> <style lang="scss"> @import "../assets/application.scss"; $sidebar-full-width: 150px; $sidebar-collapsed-width: 80px; .sidebar { padding-top: $large-offset; } .sidebarcollapsed { width: $sidebar-collapsed-width; } .sidebarextended { width: $sidebar-full-width; } </style>