tmdinosaurcenter
/
tainacan
mirror of https://github.com/tainacan/tainacan
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

More grid adjustments on several pages.

This commit is contained in:
Mateus Machado Luna 2018-05-17 11:28:20 -03:00
parent deafbfdc36
commit add2e52eab
10 changed files with 146 additions and 178 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/admin/components/lists/categories-list.vue
View File

@ -1,5 +1,5 @@
<template>
<div>
<div class="table-container">
<b-field
grouped
group-multiline>

2
src/admin/components/lists/collections-list.vue
View File

@ -1,5 +1,5 @@
<template>
<div>
<div class="table-container">
<div class="selection-control">
<div class="field select-all is-pulled-left">
<span>

2
src/admin/components/lists/events-list.vue
View File

@ -1,5 +1,5 @@
<template>
<div>
<div class="table-container">
<div class="table-wrapper">
<table class="table">
<thead>

12
src/admin/components/lists/items-list.vue
View File

@ -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 {

30
src/admin/pages/lists/categories-page.vue
View File

@ -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>

20
src/admin/pages/lists/collections-page.vue
View File

@ -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>

18
src/admin/pages/lists/events-page.vue
View File

@ -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>

35
src/admin/pages/lists/items-page.vue
View File

@ -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 {
@ -427,25 +436,13 @@
.items-list-area {
margin-left: 0;
transition: margin-left ease 0.5s ;
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;

7
src/admin/scss/_variables.scss
View File

@ -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;

10
src/admin/scss/tainacan-admin.scss
View File

@ -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-wrapper {
.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; }
@ -537,6 +544,7 @@ a:hover {
}
}
margin-bottom: 0px !important;
}
}
.pagination-area {
display: flex;