Mercurial > gemma

annotate client/src/components/Sidebar.vue @ 117:5e95c62a7e74

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
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
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
117
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
1 <template>
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
2 <div class="sidebar">
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
3 <nav class="nav flex-column">
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
4 <a class="nav-link active" href="#">Active</a>
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
5 <a class="nav-link" href="#">Link</a>
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
6 <a class="nav-link" href="#">Link</a>
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
7 <a class="nav-link disabled" href="#">Disabled</a>
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
8 </nav>
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
9 </div>
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
10 </template>
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
11
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
12 <script>
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
13 export default {
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
14 name: "sidebar",
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
15 computed: {
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
16 sidebarStyle() {
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
17 return {
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
18 sidebarcollapsed: this.collapsed,
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
19 sidebarextended: this.collapsed
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
20 };
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
21 }
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
22 },
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
23 data() {
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
24 return {
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
25 collapsed: false
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
26 };
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
27 }
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
28 };
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
29 </script>
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
30
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
31 <style lang="scss">
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
32 @import "../assets/application.scss";
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
33
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
34 $sidebar-full-width: 150px;
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
35
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
36 $sidebar-collapsed-width: 80px;
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
37
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
38 .sidebar {
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
39 padding-top: $large-offset;
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
40 }
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
41
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
42 .sidebarcollapsed {
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
43 width: $sidebar-collapsed-width;
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
44 }
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
45
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
46 .sidebarextended {
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
47 width: $sidebar-full-width;
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
48 }
5e95c62a7e74 Move component. Re-add Css.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
49 </style>