More updates to new item page design with mobile compatibility. #455
This commit is contained in:
parent
cfa167515f
commit
e08f05a46e
|
@ -41,7 +41,8 @@
|
|||
:is-menu-compressed="isMenuCompressed"/>
|
||||
<div
|
||||
id="repository-container"
|
||||
class="column is-main-content">
|
||||
class="column is-main-content"
|
||||
:style="$adminOptions.hidePrimaryMenu ? '--tainacan-sidebar-width: 0px' : ''">
|
||||
<router-view />
|
||||
</div>
|
||||
</template>
|
||||
|
@ -184,7 +185,7 @@
|
|||
|
||||
@media screen and (max-width: 769px) {
|
||||
overflow-y: visible;
|
||||
margin: 40px auto 0 auto;
|
||||
margin: 38px auto 0 auto;
|
||||
|
||||
}
|
||||
|
||||
|
|
|
@ -364,7 +364,9 @@
|
|||
v-if="!$adminOptions.hideItemEditionDocument || !$adminOptions.hideItemEditionThumbnail"
|
||||
class="column is-5">
|
||||
|
||||
<div class="sticky-container">
|
||||
<div
|
||||
:style="isMetadataNavigation && !isMobileScreen ? 'max-height: calc(100vh - 142px);' : ''"
|
||||
class="sticky-container">
|
||||
|
||||
<!-- Hook for extra Form options -->
|
||||
<template v-if="hasBeginLeftForm">
|
||||
|
@ -2026,7 +2028,7 @@ export default {
|
|||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
max-width: 100%;
|
||||
widows: 100%;
|
||||
width: 100%;
|
||||
|
||||
.sub-header {
|
||||
padding-right: 0.5em;
|
||||
|
@ -2067,7 +2069,8 @@ export default {
|
|||
}
|
||||
&>.column.is-5 {
|
||||
max-width: 100%;
|
||||
widows: 100%;
|
||||
width: 100%;
|
||||
padding-top: 2em;
|
||||
padding-left: 0.5em;
|
||||
padding-right: 0.5em;
|
||||
}
|
||||
|
@ -2100,7 +2103,7 @@ export default {
|
|||
}
|
||||
|
||||
&.is-metadata-navigation-active {
|
||||
width: calc(58.33333337% - (2 * var(--tainacan-one-column)) - 3.25em);
|
||||
width: calc(58.33333337% - (2 * var(--tainacan-one-column)) - var(--tainacan-sidebar-width, 3.25em));
|
||||
position: fixed;
|
||||
z-index: 99999;
|
||||
bottom: 0;
|
||||
|
@ -2115,6 +2118,10 @@ export default {
|
|||
top: 0.25em;
|
||||
max-width: 220px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1440px) {
|
||||
width: calc(58.33333337% - var(--tainacan-sidebar-width, 3.25em) - var(--tainacan-one-column));
|
||||
}
|
||||
}
|
||||
|
||||
.metadata-navigation {
|
||||
|
@ -2182,6 +2189,7 @@ export default {
|
|||
padding: 10px 0 0px 0px !important;
|
||||
|
||||
.b-radio {
|
||||
width: auto;
|
||||
margin-right: 24px;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
|
|
@ -288,7 +288,7 @@ export default {
|
|||
height: $header-height;
|
||||
}
|
||||
a {
|
||||
padding: 0.8em !important;
|
||||
padding: 0.85em !important;
|
||||
text-align: center;
|
||||
}
|
||||
.menu-text {
|
||||
|
|
|
@ -317,7 +317,7 @@ export default {
|
|||
.level-item {
|
||||
margin-bottom: 0;
|
||||
a {
|
||||
padding: 0.5em 0.7em !important;
|
||||
padding: 0.45em 0.7em !important;
|
||||
text-align: center;
|
||||
}
|
||||
.menu-text {
|
||||
|
|
|
@ -295,7 +295,7 @@ export default {
|
|||
}
|
||||
|
||||
@media screen and (max-width: 769px) {
|
||||
top: 102px;
|
||||
top: 96px;
|
||||
padding-left: var(--tainacan-one-column) !important;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -632,7 +632,7 @@
|
|||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
max-width: 100%;
|
||||
widows: 100%;
|
||||
width: 100%;
|
||||
|
||||
.sub-header {
|
||||
padding-right: 0.5em;
|
||||
|
@ -673,7 +673,7 @@
|
|||
}
|
||||
&>.column.is-5 {
|
||||
max-width: 100%;
|
||||
widows: 100%;
|
||||
width: 100%;
|
||||
padding-left: 0.5em;
|
||||
padding-right: 0.5em;
|
||||
}
|
||||
|
|
|
@ -136,7 +136,7 @@ a:hover {
|
|||
}
|
||||
// Used for pages with collection subheader
|
||||
.page-container-small {
|
||||
height: calc(100% - 42px);
|
||||
height: calc(100% - 38px);
|
||||
overflow-y: auto;
|
||||
transition: height 0.6s;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue