More grid adjustments on several pages.
This commit is contained in:
parent
deafbfdc36
commit
add2e52eab
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="table-container">
|
||||
<b-field
|
||||
grouped
|
||||
group-multiline>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="table-container">
|
||||
<div class="selection-control">
|
||||
<div class="field select-all is-pulled-left">
|
||||
<span>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="table-container">
|
||||
<div class="table-wrapper">
|
||||
<table class="table">
|
||||
<thead>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="table-container">
|
||||
<!-- <b-field
|
||||
grouped
|
||||
group-multiline>
|
||||
|
@ -365,7 +365,11 @@ export default {
|
|||
|
||||
.selection-control {
|
||||
|
||||
padding: 20px 14px 0px 14px;
|
||||
padding: 6px 14px 0px 14px;
|
||||
z-index: 9999;
|
||||
position: relative;
|
||||
background: white;
|
||||
height: 40px;
|
||||
|
||||
.select-all {
|
||||
color: $gray-light;
|
||||
|
@ -388,7 +392,7 @@ export default {
|
|||
height: 58px;
|
||||
padding: 0;
|
||||
position: absolute !important;
|
||||
left: $page-side-padding;
|
||||
left: 8.333333%;
|
||||
visibility: hidden;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
|
@ -470,7 +474,7 @@ export default {
|
|||
padding: 0px;
|
||||
visibility: hidden;
|
||||
position: absolute;
|
||||
right: $page-side-padding;
|
||||
right: 8.333333%;
|
||||
display: none;
|
||||
|
||||
.actions-container {
|
||||
|
|
|
@ -16,14 +16,15 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="columns above-subheader">
|
||||
<div class="column table-container">
|
||||
<div class="above-subheader">
|
||||
|
||||
<categories-list
|
||||
:is-loading="isLoading"
|
||||
:total-categories="totalCategories"
|
||||
:page="page"
|
||||
:categories-per-page="categoriesPerPage"
|
||||
:categories="categories"/>
|
||||
|
||||
<!-- Footer -->
|
||||
<div
|
||||
class="pagination-area"
|
||||
|
@ -65,7 +66,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
@ -150,12 +150,11 @@
|
|||
.sub-header {
|
||||
max-height: $subheader-height;
|
||||
height: $subheader-height;
|
||||
margin-left: -$page-small-side-padding;
|
||||
margin-right: -$page-small-side-padding;
|
||||
margin-top: -$page-small-top-padding;
|
||||
margin-left: -$page-side-padding;
|
||||
margin-right: -$page-side-padding;
|
||||
padding-top: $page-small-top-padding;
|
||||
padding-left: $page-small-side-padding;
|
||||
padding-right: $page-small-side-padding;
|
||||
padding-left: $page-side-padding;
|
||||
padding-right: $page-side-padding;
|
||||
border-bottom: 0.5px solid #ddd;
|
||||
|
||||
.header-item {
|
||||
|
@ -179,21 +178,6 @@
|
|||
margin-top: 0;
|
||||
min-height: 100%;
|
||||
height: auto;
|
||||
|
||||
.table-container {
|
||||
margin-right: -$page-small-side-padding;
|
||||
padding: 3em 2.5em;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 769px) {
|
||||
.filters-menu {
|
||||
display: none;
|
||||
}
|
||||
.table-container {
|
||||
margin-right: 0;
|
||||
padding: .85em 0em;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
|
@ -148,10 +148,11 @@ export default {
|
|||
.sub-header {
|
||||
min-height: $subheader-height;
|
||||
height: $subheader-height;
|
||||
margin-top: -$page-top-padding;
|
||||
padding-top: $page-top-padding;
|
||||
padding-left: $page-small-side-padding;
|
||||
padding-right: $page-small-side-padding;
|
||||
margin-left: -$page-side-padding;
|
||||
margin-right: -$page-side-padding;
|
||||
padding-top: $page-small-top-padding;
|
||||
padding-left: $page-side-padding;
|
||||
padding-right: $page-side-padding;
|
||||
border-bottom: 0.5px solid #ddd;
|
||||
|
||||
.header-item {
|
||||
|
@ -174,17 +175,6 @@ export default {
|
|||
margin-bottom: 0;
|
||||
margin-top: 0;
|
||||
height: auto;
|
||||
|
||||
@media screen and (max-width: 769px) {
|
||||
.filters-menu {
|
||||
display: none;
|
||||
}
|
||||
.table-container {
|
||||
margin-right: 0;
|
||||
padding: .85em 0em;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
@ -6,10 +6,7 @@
|
|||
'page-container': isRepositoryLevel
|
||||
}">
|
||||
<tainacan-title />
|
||||
<div
|
||||
class="columns"
|
||||
:class="{ 'above-subheader': isRepositoryLevel }">
|
||||
<div class="column table-container">
|
||||
<div :class="{ 'above-subheader': isRepositoryLevel }">
|
||||
<events-list
|
||||
:is-loading="isLoading"
|
||||
:total-events="totalEvents"
|
||||
|
@ -57,7 +54,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
@ -188,17 +184,5 @@
|
|||
margin-top: 0;
|
||||
min-height: 100%;
|
||||
height: auto;
|
||||
|
||||
.table-container {
|
||||
margin-right: -$page-small-side-padding;
|
||||
padding: 3em 2.5em;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 769px) {
|
||||
.table-container {
|
||||
margin-right: 0;
|
||||
padding: .85em 0em;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -116,11 +116,11 @@
|
|||
</ul>
|
||||
</div>
|
||||
|
||||
<div
|
||||
<!-- <div
|
||||
:items="items"
|
||||
id="theme-items-list" />
|
||||
id="theme-items-list" /> -->
|
||||
<!-- LISTING RESULTS ------------------------- -->
|
||||
<div class="table-container above-subheader">
|
||||
<div class="above-subheader">
|
||||
<b-loading
|
||||
:is-full-page="false"
|
||||
:active.sync="isLoadingItems"/>
|
||||
|
@ -387,8 +387,17 @@
|
|||
.above-subheader {
|
||||
margin-bottom: 0;
|
||||
margin-top: 0;
|
||||
min-height: 100%;
|
||||
height: auto;
|
||||
height: calc(100% - 184px);
|
||||
}
|
||||
.pagination-area {
|
||||
margin-left: $page-side-padding;
|
||||
margin-right: $page-side-padding;
|
||||
}
|
||||
|
||||
.table-container {
|
||||
padding-left: 8.333333%;
|
||||
padding-right: 8.333333%;
|
||||
height: calc(100% - 82px);
|
||||
}
|
||||
|
||||
#collection-search-button {
|
||||
|
@ -428,24 +437,12 @@
|
|||
.items-list-area {
|
||||
margin-left: 0;
|
||||
transition: margin-left ease 0.5s;
|
||||
height: 100%;
|
||||
}
|
||||
.spaced-to-right {
|
||||
margin-left: $filter-menu-width;
|
||||
}
|
||||
|
||||
.table-container {
|
||||
padding: 3em 55px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 769px) {
|
||||
|
||||
.table-container {
|
||||
margin-right: 0;
|
||||
padding: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
#filter-menu-compress-button {
|
||||
position: absolute;
|
||||
z-index: 9;
|
||||
|
|
|
@ -66,9 +66,10 @@ $page-height: calc(100% - 53px);
|
|||
|
||||
// Overall Pages padding:
|
||||
$page-side-padding: 4.166666667%;//82px;
|
||||
$page-top-padding: 27px;
|
||||
$page-small-side-padding: 22px;
|
||||
$page-small-top-padding: 22px;
|
||||
$table-side-padding: 4.166666667%;
|
||||
$page-top-padding: 25px;
|
||||
$page-small-side-padding: 25px;
|
||||
$page-small-top-padding: 25px;
|
||||
|
||||
$page-mobile-side-padding: 1em;
|
||||
$page-mobile-top-padding: 1em;
|
||||
|
|
|
@ -92,6 +92,7 @@ a:hover {
|
|||
a.back-link{
|
||||
font-weight: 500;
|
||||
float: right;
|
||||
margin-top: 5px;
|
||||
}
|
||||
hr{
|
||||
margin: 3px 0px 4px 0px;
|
||||
|
@ -525,8 +526,14 @@ a:hover {
|
|||
}
|
||||
|
||||
// Tables
|
||||
.table-container {
|
||||
padding: 0 $table-side-padding;
|
||||
position: relative;
|
||||
|
||||
.table-wrapper {
|
||||
width: 100%;
|
||||
height: calc(100% - 40px);
|
||||
overflow: auto;
|
||||
.table {
|
||||
tbody {
|
||||
td { border-bottom: 0px solid $gray-light !important; }
|
||||
|
@ -538,6 +545,7 @@ a:hover {
|
|||
}
|
||||
margin-bottom: 0px !important;
|
||||
}
|
||||
}
|
||||
.pagination-area {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
|
Loading…
Reference in New Issue