Make task list, teams and settings pages max width of $desktop and centered
This commit is contained in:
parent
6a2380ea30
commit
3c6c5ff845
10 changed files with 15 additions and 11 deletions
|
@ -15,7 +15,7 @@
|
|||
flex-flow: row wrap;
|
||||
|
||||
.image {
|
||||
width: calc(100% / 6 - 1em);
|
||||
width: calc(100% / 5 - 1em);
|
||||
height: 120px;
|
||||
margin: .5em;
|
||||
background-size: cover;
|
||||
|
@ -23,7 +23,7 @@
|
|||
display: flex;
|
||||
|
||||
@media screen and (min-width: $desktop) {
|
||||
&:nth-child(6n) {
|
||||
&:nth-child(5n) {
|
||||
page-break-after: always; // CSS 2.1 syntax
|
||||
break-after: always; // New syntax
|
||||
}
|
||||
|
|
|
@ -2,7 +2,6 @@
|
|||
margin-top: 1rem;
|
||||
padding: 0;
|
||||
text-align: left;
|
||||
max-width: 80vw;
|
||||
|
||||
@media screen and (min-width: $tablet) {
|
||||
&.short {
|
||||
|
@ -149,4 +148,3 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -63,3 +63,9 @@ button.table {
|
|||
.pagination {
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
.is-max-width-desktop {
|
||||
width: 100%;
|
||||
max-width: $desktop;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="loader-container edit-list" :class="{ 'is-loading': listService.loading}">
|
||||
<div class="loader-container edit-list is-max-width-desktop" :class="{ 'is-loading': listService.loading}">
|
||||
<div class="notification is-warning" v-if="list.isArchived">
|
||||
This list is archived.
|
||||
It is not possible to create new or edit tasks or it.
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="loader-container" :class="{ 'is-loading': taskCollectionService.loading}">
|
||||
<div class="loader-container is-max-width-desktop" :class="{ 'is-loading': taskCollectionService.loading}">
|
||||
<div class="filter-container">
|
||||
<div class="items">
|
||||
<div class="search">
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="loader-container" v-bind:class="{ 'is-loading': namespaceService.loading}">
|
||||
<div class="loader-container is-max-width-desktop" v-bind:class="{ 'is-loading': namespaceService.loading}">
|
||||
<div class="notification is-warning" v-if="namespace.isArchived">
|
||||
This namespace is archived.
|
||||
It is not possible to create new lists or edit it.
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="is-max-width-desktop">
|
||||
<h3 v-if="showAll">Current tasks</h3>
|
||||
<h3 v-else>Tasks from {{startDate.toLocaleDateString()}} until {{endDate.toLocaleDateString()}}</h3>
|
||||
<template v-if="!taskService.loading && (!hasUndoneTasks || !tasks)">
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="loader-container" v-bind:class="{ 'is-loading': teamService.loading}">
|
||||
<div class="loader-container is-max-width-desktop" v-bind:class="{ 'is-loading': teamService.loading}">
|
||||
<div class="card is-fullwidth" v-if="userIsAdmin">
|
||||
<header class="card-header">
|
||||
<p class="card-header-title">
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="content loader-container" v-bind:class="{ 'is-loading': teamService.loading}">
|
||||
<div class="content loader-container is-max-width-desktop" v-bind:class="{ 'is-loading': teamService.loading}">
|
||||
<router-link :to="{name:'teams.create'}" class="button is-success button-right" >
|
||||
<span class="icon is-small">
|
||||
<icon icon="plus"/>
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div
|
||||
class="loader-container"
|
||||
class="loader-container is-max-width-desktop"
|
||||
:class="{ 'is-loading': passwordUpdateService.loading || emailUpdateService.loading || totpService.loading }">
|
||||
<!-- Password update -->
|
||||
<div class="card">
|
||||
|
|
Loading…
Reference in a new issue