vikunja/frontend
Archived
6
39
Fork 48
Code Issues 1 Pull Requests 4 Projects Releases 26 Activity

New design #14

Merged
konrad merged 43 commits from new-design into master 2018-12-25 15:03:52 +00:00
Conversation 0 Commits 43 Files Changed 51 +14 -8
3 changed files with 14 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 67f11b1ec4 - Show all commits

12
src/App.vue
View File

@ -1,11 +1,11 @@
<template>
<div id="app">
<nav class="navbar is-dark" role="navigation" aria-label="main navigation" v-if="user.authenticated">
<div class="navbar-brand">
<router-link :to="{name: 'home'}" class="navbar-item logo">
<img src="/images/logo-full-white.svg"/>
</router-link>
</div>
<nav class="navbar is-dark is-fixed-top" role="navigation" aria-label="main navigation" v-if="user.authenticated">
<div class="navbar-brand">
<router-link :to="{name: 'home'}" class="navbar-item logo">
<img src="/images/logo-full-white.svg"/>
</router-link>
</div>
</nav>
<a @click="mobileMenuActive = true" class="mobilemenu-show-button" v-if="!mobileMenuActive"><icon icon="bars"></icon></a>
<a @click="mobileMenuActive = false" class="mobilemenu-hide-button" v-if="mobileMenuActive"><icon icon="times"></icon></a>

1
src/styles/_variables.scss
View File

@ -22,5 +22,6 @@ $vikunja-light-text: darken(#fff, 10%);
$vikunja-blue: #7F23FF;// #7F23FF; // #5974d9
$vikunja-green: #4DB788;
$navbar-padding: 1.5em;
//$navbar-height: 64px;
$transition: 150ms ease;

9
src/styles/general.scss
View File

@ -41,15 +41,17 @@
color: $vikunja-light-text;
padding: 0;
transition: all $transition;
position: fixed;
bottom: 0;
top: $navbar-height + 0.75rem;
overflow-x: auto;
@media screen and (max-width: $tablet) {
padding: 0 0 1em;
position: fixed;
left: -147vw;
top: 0;
bottom: 0;
width: 70vw;
overflow-x: auto;
z-index: 5;
&.is-active {
@ -173,8 +175,11 @@
padding: 1.5em;
z-index: 2;
background: url('../public/images/llama-upside-down.svg') no-repeat top right darken(#fff, 4);
margin-left: 16.66666%;
margin-top: $navbar-height + 0.75rem;
@media screen and (max-width: $tablet) {
margin-left: 0;
margin-top: 1.6em;
min-height: calc(100vh - 4.25rem);
}