Moves backbutton from collection to repository header if collection header is hidden #659

This commit is contained in:
mateuswetah 2022-02-01 17:12:56 -03:00
parent 007bc84216
commit a95fda7c84
1 changed files with 46 additions and 2 deletions

View File

@ -3,8 +3,27 @@
id="tainacan-repository-subheader"
class="level secondary-page"
:class="{'is-menu-compressed': isMenuCompressed, 'is-repository-level' : isRepositoryLevel}">
<h1 v-if="isRepositoryLevel">{{ repositoryName }}</h1>
<h1 v-else>
<div
v-if="$adminOptions.hideTainacanCollectionSubheader"
class="back-button is-hidden-mobile">
<button
@click="$router.go(-1)"
class="button is-turquoise4">
<span class="icon">
<i class="tainacan-icon tainacan-icon-previous"/>
</span>
</button>
</div>
<h1
v-if="isRepositoryLevel"
:style="$adminOptions.hideTainacanCollectionSubheader ? 'margin-right: auto;' : ''">
{{ repositoryName }}
</h1>
<h1
v-else
:style="$adminOptions.hideTainacanCollectionSubheader ? 'margin-right: auto;' : ''">
{{ $i18n.get('collection') + '' }}
<span class="has-text-weight-bold">
{{ collection && collection.name ? collection.name : '' }}
@ -214,6 +233,31 @@ export default {
transition: all 0.2s linear;
}
.back-button {
padding: 0;
margin: 0;
width: var(--tainacan-one-column);
min-width: var(--tainacan-one-column);
color: var(--tainacan-white);
display: flex;
margin-left: calc(-1 * var(--tainacan-one-column));
button,
button:hover,
button:focus,
button:active {
width: 100%;
color: var(--tainacan-white);
background-color: transparent !important;
border: none;
height: $subheader-height !important;
.icon {
margin-top: -2px;
font-size: 1.5em;
}
}
}
.repository-subheader-icons {
display: flex;
flex-wrap: nowrap;