local-it/vikunja-frontend
0
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Better responsive layout for unauthenticated pages

Browse source
This commit is contained in:
kolaente 2020-05-12 15:18:37 +02:00
parent b876a4d4dc
commit d0f6a4ce99
No known key found for this signature in database
GPG key ID: F40E70337AB24C9B
2 changed files with 23 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
src/App.vue
View file

@ -187,19 +187,17 @@
</div> </div>
</div> </div>
<div v-else> <div v-else>
<div class="container"> <div class="noauth-container">
<div class="column is-4 is-offset-4"> <img src="/images/logo-full.svg" alt="Vikunja"/>
<img src="/images/logo-full.svg" alt="Vikunja"/> <div class="message is-info" v-if="motd !== ''">
<div class="message is-info" v-if="motd !== ''"> <div class="message-header">
<div class="message-header"> <p>Info</p>
<p>Info</p> </div>
</div> <div class="message-body">
<div class="message-body"> {{ motd }}
{{ motd }}
</div>
</div> </div>
<router-view/>
</div> </div>
<router-view/>
</div> </div>
</div> </div>
<notification/> <notification/>

17
src/styles/theme/content.scss
View file

@ -1,10 +1,10 @@
.app-container{ .app-container {
min-height: calc(100vh - 65px); min-height: calc(100vh - 65px);
@media screen and (max-width: $tablet) { @media screen and (max-width: $tablet) {
padding-top: $navbar-height + 0.75rem; padding-top: $navbar-height + 0.75rem;
} }
.app-content{ .app-content {
padding: $navbar-height + 1.5rem 1.5em 0 1.5em; padding: $navbar-height + 1.5rem 1.5em 0 1.5em;
z-index: 2; z-index: 2;
margin-left: 17vw; margin-left: 17vw;
@ -15,8 +15,19 @@
min-height: calc(100vh - 4rem); min-height: calc(100vh - 4rem);
} }
.card{ .card {
background: #fff; background: #fff;
} }
} }
} }
.noauth-container {
width: 450px;
margin: 0 auto;
padding: 1rem 0;
@media screen and (max-width: calc(450px + 2rem)) {
width: 100%;
padding: 1rem;
}
}