1
0

feat: add print styles

This commit is contained in:
kolaente
2022-06-02 23:00:21 +02:00
parent 1deb0a58bd
commit 6fc87e1515
10 changed files with 101 additions and 78 deletions

View File

@ -2,7 +2,7 @@
<header
:class="{'has-background': background}"
aria-label="main navigation"
class="navbar main-theme is-fixed-top"
class="navbar main-theme is-fixed-top d-print-none"
>
<router-link :to="{name: 'home'}" class="logo-link">
<Logo width="164" height="48"/>

View File

@ -3,7 +3,7 @@
<BaseButton
v-if="menuActive"
@click="$store.commit('menuActive', false)"
class="menu-hide-button"
class="menu-hide-button d-print-none"
>
<icon icon="times"/>
</BaseButton>
@ -14,9 +14,9 @@
>
<div
:class="{'is-visible': background}"
class="app-container-background background-fade-in"
class="app-container-background background-fade-in d-print-none"
:style="{'background-image': background && `url(${background})`}"></div>
<navigation/>
<navigation class="d-print-none"/>
<main
:class="[
{ 'is-menu-enabled': menuActive },
@ -27,12 +27,11 @@
<BaseButton
v-if="menuActive"
@click="$store.commit('menuActive', false)"
class="mobile-overlay"
class="mobile-overlay d-print-none"
/>
<quick-actions/>
<router-view :route="routeWithModal" v-slot="{ Component }">
<keep-alive :include="['list.list', 'list.gantt', 'list.table', 'list.kanban']">
<component :is="Component"/>
@ -51,7 +50,7 @@
</transition>
<a
class="keyboard-shortcuts-button"
class="keyboard-shortcuts-button d-print-none"
@click="showKeyboardShortcuts()"
v-shortcut="'?'"
>
@ -238,9 +237,13 @@ store.dispatch('labels/loadAllLabels')
}
.app-content {
padding: $navbar-height + 1.5rem 1.5rem 1rem 1.5rem;
z-index: 10;
position: relative;
padding-top: 1rem;
@media screen {
padding: $navbar-height + 1.5rem 1.5rem 1rem 1.5rem;
}
// Used to make sure the spinner is always in the middle while loading
> .loader-container {
@ -253,12 +256,14 @@ store.dispatch('labels/loadAllLabels')
min-height: calc(100vh - 4rem);
}
&.is-menu-enabled {
margin-left: $navbar-width;
@media screen {
&.is-menu-enabled {
margin-left: $navbar-width;
@media screen and (max-width: $tablet) {
min-width: 100%;
margin-left: 0;
@media screen and (max-width: $tablet) {
min-width: 100%;
margin-left: 0;
}
}
}

View File

@ -16,11 +16,11 @@
<p class="has-text-centered has-text-grey is-italic my-5" v-if="showPreviewText">
{{ emptyText }}
<template v-if="isEditEnabled">
<a @click="toggleEdit">{{ $t('input.editor.edit') }}</a>.
<a @click="toggleEdit" class="d-print-none">{{ $t('input.editor.edit') }}</a>.
</template>
</p>
<ul class="actions" v-if="bottomActions.length > 0">
<ul class="actions d-print-none" v-if="bottomActions.length > 0">
<li v-if="isEditEnabled && !showPreviewText && showSave">
<a v-if="showEditButton" @click="toggleEdit">{{ $t('input.editor.edit') }}</a>
<a v-else-if="isEditActive" @click="toggleEdit" class="done-edit">{{ $t('misc.save') }}</a>
@ -30,7 +30,7 @@
</li>
</ul>
<template v-else-if="isEditEnabled && showSave">
<ul v-if="showEditButton" class="actions">
<ul v-if="showEditButton" class="actions d-print-none">
<li>
<a @click="toggleEdit">{{ $t('input.editor.edit') }}</a>
</li>

View File

@ -1,6 +1,6 @@
<template>
<div class="content details" v-if="enabled">
<h3 v-if="canWrite || comments.length > 0">
<h3 v-if="canWrite || comments.length > 0" :class="{'d-print-none': comments.length === 0}">
<span class="icon is-grey">
<icon :icon="['far', 'comments']"/>
</span>
@ -29,7 +29,7 @@
<img
:src="c.author.getAvatarUrl(20)"
alt=""
class="image is-avatar"
class="image is-avatar d-print-none"
height="20"
width="20"
/>
@ -82,7 +82,7 @@
/>
</div>
</div>
<div class="media comment" v-if="canWrite">
<div class="media comment d-print-none" v-if="canWrite">
<figure class="media-left is-hidden-mobile">
<img
:src="userAvatar"

View File

@ -3,7 +3,7 @@
<x-button
v-if="editEnabled && Object.keys(relatedTasks).length > 0"
@click="showNewRelationForm = !showNewRelationForm"
class="is-pulled-right add-task-relation-button"
class="is-pulled-right add-task-relation-button d-print-none"
:class="{'is-active': showNewRelationForm}"
v-tooltip="$t('task.relation.add')"
variant="secondary"