Remove some non-read-only elements from mobile

This commit is contained in:
Ramon Wenger 2019-04-08 17:12:52 +02:00
parent b95fd6161f
commit 1bce7a710f
4 changed files with 23 additions and 3 deletions

View File

@ -37,15 +37,20 @@
<style scoped lang="scss">
@import "@/styles/_variables.scss";
@import "@/styles/_mixins.scss";
.add-objective-group-button {
display: grid;
display: none;
grid-template-columns: 45px auto;
align-items: center;
margin-top: -20px;
margin-bottom: 35px;
cursor: pointer;
@include desktop {
display: grid;
}
&__icon {
width: 25px;
height: 25px;

View File

@ -1,5 +1,6 @@
<template>
<component :is="component" v-bind="properties" class="add-widget" @click="$emit('click')" :class="{ 'add-widget--reverse': reverse }">
<component :is="component" v-bind="properties" class="add-widget" @click="$emit('click')"
:class="{ 'add-widget--reverse': reverse }">
<add-icon class="add-widget__add"></add-icon>
</component>
</template>
@ -47,12 +48,16 @@
@import "@/styles/_mixins.scss";
.add-widget {
display: flex;
display: none;
align-items: center;
justify-content: center;
@include widget-shadow;
cursor: pointer;
@include desktop {
display: flex;
}
&__add {
width: 80px;
fill: $color-grey;

View File

@ -54,8 +54,12 @@
.header-bar {
display: -ms-grid;
@supports (display: grid) {
display: none;
@include desktop {
display: grid;
}
}
align-items: center;
justify-content: space-around;
background-color: $color-white;

View File

@ -34,6 +34,7 @@
<style scoped lang="scss">
@import "@/styles/_variables.scss";
@import "@/styles/_mixins.scss";
.widget-footer {
background-color: $color-grey--lighter;
@ -43,6 +44,11 @@
position: relative;
border-bottom-left-radius: $default-border-radius;
border-bottom-right-radius: $default-border-radius;
visibility: hidden;
@include desktop {
visibility: visible;
}
/*
* For IE10+