Fixes hierarchy issue with new metadata sections classes.

This commit is contained in:
mateuswetah 2022-10-05 12:06:30 -03:00
parent f3869b9155
commit 2ab0c3184b
6 changed files with 145 additions and 132 deletions

View File

@ -21,7 +21,8 @@
.tainacan-item-section--document, .tainacan-item-section--document,
.tainacan-item-section--gallery { grid-area: document } .tainacan-item-section--gallery { grid-area: document }
.tainacan-item-section--attachments { grid-area: attachments } .tainacan-item-section--attachments { grid-area: attachments }
.tainacan-item-section--metadata { grid-area: metadata } .tainacan-item-section--metadata,
.tainacan-item-section--metadata-sections { grid-area: metadata }
.tainacan-item-section--items-related-to-this { grid-area: related } .tainacan-item-section--items-related-to-this { grid-area: related }
&.tainacan-item-single--layout-type-dam { &.tainacan-item-single--layout-type-dam {
@ -458,8 +459,8 @@
} }
/* Metadata section layouts */ /* Metadata section layouts */
.tainacan-metadata-sections-container { .tainacan-item-section--metadata-sections {
&.metadata-section-layout--tabs { .metadata-section-layout--tabs {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
box-sizing: border-box; box-sizing: border-box;
@ -507,8 +508,8 @@
} }
} }
} }
&.metadata-section-layout--collapses, .metadata-section-layout--collapses,
&.metadata-section-layout--accordion { .metadata-section-layout--accordion {
box-sizing: border-box; box-sizing: border-box;
.tainacan-item-section { .tainacan-item-section {

View File

@ -403,7 +403,8 @@ body:not(.tainacan-admin-page) .tainacan-modal-content .modal-card-body {
grid-area: attachments; grid-area: attachments;
} }
.tainacan-item-single-page .tainacan-item-single .tainacan-item-section--metadata { .tainacan-item-single-page .tainacan-item-single .tainacan-item-section--metadata,
.tainacan-item-single-page .tainacan-item-single .tainacan-item-section--metadata-sections {
grid-area: metadata; grid-area: metadata;
} }
@ -842,20 +843,20 @@ body:not(.tainacan-admin-page) .tainacan-modal-content .modal-card-body {
transform: scale(1); transform: scale(1);
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--tabs { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--tabs {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
box-sizing: border-box; box-sizing: border-box;
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--tabs .tainacan-item-section { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--tabs .tainacan-item-section {
width: 100%; width: 100%;
display: none; display: none;
padding: 2rem 42px 1rem 42px; padding: 2rem 42px 1rem 42px;
border-top: 1px solid var(--formBorderInitialColor, #e0e5eb); border-top: 1px solid var(--formBorderInitialColor, #e0e5eb);
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--tabs label { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--tabs label {
width: 100%; width: 100%;
text-align: center; text-align: center;
margin: 0; margin: 0;
@ -865,42 +866,44 @@ body:not(.tainacan-admin-page) .tainacan-modal-content .modal-card-body {
transition: border-bottom 0.2s ease; transition: border-bottom 0.2s ease;
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--tabs label .tainacan-single-item-section { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--tabs label .tainacan-single-item-section {
margin: 0.75rem 1.5rem; margin: 0.75rem 1.5rem;
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--tabs label:hover { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--tabs label:hover {
opacity: 1.0; opacity: 1.0;
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--tabs input { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--tabs input {
position: absolute; position: absolute;
opacity: 0; opacity: 0;
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--tabs input:checked + label { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--tabs input:checked + label {
opacity: 1.0; opacity: 1.0;
border-bottom-color: var(--paletteColor1, #3eaf7c); border-bottom-color: var(--paletteColor1, #3eaf7c);
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--tabs input:checked + label + .tainacan-item-section { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--tabs input:checked + label + .tainacan-item-section {
display: block; display: block;
} }
@media screen and (min-width: 768px) { @media screen and (min-width: 768px) {
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--tabs label { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--tabs label {
width: auto; width: auto;
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--tabs .tainacan-item-section { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--tabs .tainacan-item-section {
order: 99; order: 99;
} }
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--collapses, .tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--accordion { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--collapses,
.tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--accordion {
box-sizing: border-box; box-sizing: border-box;
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--collapses .tainacan-item-section, .tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--accordion .tainacan-item-section { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--collapses .tainacan-item-section,
.tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--accordion .tainacan-item-section {
width: 100%; width: 100%;
display: none; display: none;
padding: 2rem 42px 1rem 42px; padding: 2rem 42px 1rem 42px;
@ -908,7 +911,8 @@ body:not(.tainacan-admin-page) .tainacan-modal-content .modal-card-body {
margin-bottom: 0; margin-bottom: 0;
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--collapses label, .tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--accordion label { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--collapses label,
.tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--accordion label {
display: flex; display: flex;
align-items: center; align-items: center;
width: 100%; width: 100%;
@ -919,39 +923,47 @@ body:not(.tainacan-admin-page) .tainacan-modal-content .modal-card-body {
transition: opacity 0.2s ease; transition: opacity 0.2s ease;
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--collapses label .tainacan-single-item-section, .tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--accordion label .tainacan-single-item-section { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--collapses label .tainacan-single-item-section,
.tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--accordion label .tainacan-single-item-section {
margin: 0.75rem; margin: 0.75rem;
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--collapses label .tainacan-icon, .tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--accordion label .tainacan-icon { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--collapses label .tainacan-icon,
.tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--accordion label .tainacan-icon {
color: var(--paletteColor1, #3eaf7c); color: var(--paletteColor1, #3eaf7c);
transform: rotate(0deg); transform: rotate(0deg);
transition: transform 0.2s ease; transition: transform 0.2s ease;
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--collapses label .tainacan-icon::before, .tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--accordion label .tainacan-icon::before { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--collapses label .tainacan-icon::before,
.tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--accordion label .tainacan-icon::before {
font-size: 1.75em; font-size: 1.75em;
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--collapses label:hover, .tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--accordion label:hover { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--collapses label:hover,
.tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--accordion label:hover {
opacity: 1.0; opacity: 1.0;
border-bottom: 1px solid var(--formBorderInitialColor, #e0e5eb); border-bottom: 1px solid var(--formBorderInitialColor, #e0e5eb);
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--collapses input, .tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--accordion input { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--collapses input,
.tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--accordion input {
position: absolute; position: absolute;
opacity: 0; opacity: 0;
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--collapses input:checked + label, .tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--accordion input:checked + label { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--collapses input:checked + label,
.tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--accordion input:checked + label {
opacity: 1.0; opacity: 1.0;
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--collapses input:checked + label .tainacan-icon, .tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--accordion input:checked + label .tainacan-icon { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--collapses input:checked + label .tainacan-icon,
.tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--accordion input:checked + label .tainacan-icon {
transform: rotate(90deg); transform: rotate(90deg);
} }
.tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--collapses input:checked + label + .tainacan-item-section, .tainacan-item-single-page .tainacan-metadata-sections-container.metadata-section-layout--accordion input:checked + label + .tainacan-item-section { .tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--collapses input:checked + label + .tainacan-item-section,
.tainacan-item-single-page .tainacan-item-section--metadata-sections .metadata-section-layout--accordion input:checked + label + .tainacan-item-section {
display: block; display: block;
} }

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -87,116 +87,116 @@
'exclude_title' => $exclude_title_metadata 'exclude_title' => $exclude_title_metadata
); );
if ( $show_default_section_separated ) { echo '<div class="tainacan-item-section tainacan-item-section--metadata-sections">';
$sections_args = array(
'metadata_sections__in' => [ \Tainacan\Entities\Metadata_Section::$default_section_slug ], if ( $show_default_section_separated ) {
'before' => '<section class="tainacan-item-section tainacan-item-section--metadata">', $sections_args = array(
'after' => '</section>', 'metadata_sections__in' => [ \Tainacan\Entities\Metadata_Section::$default_section_slug ],
'before_name' => '<h2 class="tainacan-single-item-section" id="metadata-section-$slug">', 'before' => '<section class="tainacan-item-section tainacan-item-section--metadata">',
'after_name' => '</h2>', 'after' => '</section>',
'hide_name' => !$display_section_labels, 'before_name' => '<h2 class="tainacan-single-item-section" id="metadata-section-$slug">',
'before_metadata_list' => do_action( 'tainacan-blocksy-single-item-metadata-begin' ) . '<div class="tainacan-item-section__metadata ' . $metadata_list_structure_type . '">', 'after_name' => '</h2>',
'after_metadata_list' => '</div>' . do_action( 'tainacan-blocksy-single-item-metadata-end' ), 'hide_name' => !$display_section_labels,
'metadata_list_args' => $metadata_args 'before_metadata_list' => do_action( 'tainacan-blocksy-single-item-metadata-begin' ) . '<div class="tainacan-item-section__metadata ' . $metadata_list_structure_type . '">',
); 'after_metadata_list' => '</div>' . do_action( 'tainacan-blocksy-single-item-metadata-end' ),
'metadata_list_args' => $metadata_args
);
tainacan_the_metadata_sections( $sections_args );
}
echo '<div class="tainacan-metadata-sections-container">'; if ( $section_layout == 'metadata-section-type-2') {
tainacan_the_metadata_sections( $sections_args );
echo '</div>';
}
if ( $section_layout == 'metadata-section-type-2') {
add_filter('tainacan-get-metadata-section-as-html-before-name--index-0', function($before, $item_metadatum) { add_filter('tainacan-get-metadata-section-as-html-before-name--index-0', function($before, $item_metadatum) {
return str_replace('<input', '<input checked="checked"', $before); return str_replace('<input', '<input checked="checked"', $before);
}, 10, 2); }, 10, 2);
$sections_args = array( $sections_args = array(
'metadata_sections__not_in' => $show_default_section_separated ? [ \Tainacan\Entities\Metadata_Section::$default_section_slug ] : [], 'metadata_sections__not_in' => $show_default_section_separated ? [ \Tainacan\Entities\Metadata_Section::$default_section_slug ] : [],
'before' => '', 'before' => '',
'after' => '', 'after' => '',
'before_name' => '<input name="tabs" type="radio" id="tab-section-$id" /> 'before_name' => '<input name="tabs" type="radio" id="tab-section-$id" />
<label for="tab-section-$id"> <label for="tab-section-$id">
<h2 class="tainacan-single-item-section" id="metadata-section-$slug">', <h2 class="tainacan-single-item-section" id="metadata-section-$slug">',
'after_name' => '</h2> 'after_name' => '</h2>
</label>', </label>',
'before_metadata_list' => '<section class="tainacan-item-section tainacan-item-section--metadata">' . do_action( 'tainacan-blocksy-single-item-metadata-begin' ) . ' 'before_metadata_list' => '<section class="tainacan-item-section tainacan-item-section--metadata">' . do_action( 'tainacan-blocksy-single-item-metadata-begin' ) . '
<div class="tainacan-item-section__metadata ' . $metadata_list_structure_type . '" aria-labelledby="metadata-section-$slug">',
'after_metadata_list' => '</div>' . do_action( 'tainacan-blocksy-single-item-metadata-end' ) . '</section>',
'metadata_list_args' => $metadata_args
);
echo '<div class="metadata-section-layout--tabs">';
tainacan_the_metadata_sections( $sections_args );
echo '</div>';
} else if ( $section_layout == 'metadata-section-type-3') {
add_filter('tainacan-get-metadata-section-as-html-before-name--index-0', function($before, $item_metadatum) {
return str_replace('<input', '<input checked="checked"', $before);
}, 10, 2);
$sections_args = array(
'metadata_sections__not_in' => $show_default_section_separated ? [ \Tainacan\Entities\Metadata_Section::$default_section_slug ] : [],
'before' => '',
'after' => '',
'before_name' => '<input name="collapses" type="checkbox" id="collapse-section-$id"/>
<label for="collapse-section-$id">
<i class="tainacan-icon tainacan-icon-arrowright"></i>
<h2 class="tainacan-single-item-section" id="metadata-section-$slug">',
'after_name' => '</h2>
</label>',
'before_metadata_list' => '<section class="tainacan-item-section tainacan-item-section--metadata">' . do_action( 'tainacan-blocksy-single-item-metadata-begin' ) . '
<div class="tainacan-item-section__metadata ' . $metadata_list_structure_type . '" aria-labelledby="metadata-section-$slug">', <div class="tainacan-item-section__metadata ' . $metadata_list_structure_type . '" aria-labelledby="metadata-section-$slug">',
'after_metadata_list' => '</div>' . do_action( 'tainacan-blocksy-single-item-metadata-end' ) . '</section>', 'after_metadata_list' => '</div>' . do_action( 'tainacan-blocksy-single-item-metadata-end' ) . '</section>',
'metadata_list_args' => $metadata_args 'metadata_list_args' => $metadata_args
); );
echo '<div class="tainacan-metadata-sections-container metadata-section-layout--tabs">';
tainacan_the_metadata_sections( $sections_args );
echo '</div>';
} else if ( $section_layout == 'metadata-section-type-3') { echo '<div class="metadata-section-layout--collapses">';
tainacan_the_metadata_sections( $sections_args );
echo '</div>';
add_filter('tainacan-get-metadata-section-as-html-before-name--index-0', function($before, $item_metadatum) { } else if ( $section_layout == 'metadata-section-type-4') {
return str_replace('<input', '<input checked="checked"', $before);
}, 10, 2);
$sections_args = array( add_filter('tainacan-get-metadata-section-as-html-before-name--index-0', function($before, $item_metadatum) {
'metadata_sections__not_in' => $show_default_section_separated ? [ \Tainacan\Entities\Metadata_Section::$default_section_slug ] : [], return str_replace('<input', '<input checked="checked"', $before);
'before' => '', }, 10, 2);
'after' => '',
'before_name' => '<input name="collapses" type="checkbox" id="collapse-section-$id"/>
<label for="collapse-section-$id">
<i class="tainacan-icon tainacan-icon-arrowright"></i>
<h2 class="tainacan-single-item-section" id="metadata-section-$slug">',
'after_name' => '</h2>
</label>',
'before_metadata_list' => '<section class="tainacan-item-section tainacan-item-section--metadata">' . do_action( 'tainacan-blocksy-single-item-metadata-begin' ) . '
<div class="tainacan-item-section__metadata ' . $metadata_list_structure_type . '" aria-labelledby="metadata-section-$slug">',
'after_metadata_list' => '</div>' . do_action( 'tainacan-blocksy-single-item-metadata-end' ) . '</section>',
'metadata_list_args' => $metadata_args
);
echo '<div class="tainacan-metadata-sections-container metadata-section-layout--collapses">'; $sections_args = array(
tainacan_the_metadata_sections( $sections_args ); 'metadata_sections__not_in' => $show_default_section_separated ? [ \Tainacan\Entities\Metadata_Section::$default_section_slug ] : [],
echo '</div>'; 'before' => '',
'after' => '',
'before_name' => '<input name="accordion" type="radio" id="accordion-section-$id"/>
<label for="accordion-section-$id">
<i class="tainacan-icon tainacan-icon-arrowright"></i>
<h2 class="tainacan-single-item-section" id="metadata-section-$slug">',
'after_name' => '</h2>
</label>',
'before_metadata_list' => '<section class="tainacan-item-section tainacan-item-section--metadata">' . do_action( 'tainacan-blocksy-single-item-metadata-begin' ) . '
<div class="tainacan-item-section__metadata ' . $metadata_list_structure_type . '" aria-labelledby="metadata-section-$slug">',
'after_metadata_list' => '</div>' . do_action( 'tainacan-blocksy-single-item-metadata-end' ) . '</section>',
'metadata_list_args' => $metadata_args
);
} else if ( $section_layout == 'metadata-section-type-4') { echo '<div class="metadata-section-layout--accordion">';
tainacan_the_metadata_sections( $sections_args );
echo '</div>';
add_filter('tainacan-get-metadata-section-as-html-before-name--index-0', function($before, $item_metadatum) { } else {
return str_replace('<input', '<input checked="checked"', $before); $sections_args = array(
}, 10, 2); 'metadata_sections__not_in' => $show_default_section_separated ? [ \Tainacan\Entities\Metadata_Section::$default_section_slug ] : [],
'before' => '<section class="tainacan-item-section tainacan-item-section--metadata">',
'after' => '</section>',
'before_name' => '<h2 class="tainacan-single-item-section" id="metadata-section-$slug">',
'after_name' => '</h2>',
'hide_name' => !$display_section_labels,
'before_metadata_list' => do_action( 'tainacan-blocksy-single-item-metadata-begin' ) . '<div class="tainacan-item-section__metadata ' . $metadata_list_structure_type . '">',
'after_metadata_list' => '</div>' . do_action( 'tainacan-blocksy-single-item-metadata-end' ),
'metadata_list_args' => $metadata_args
);
tainacan_the_metadata_sections( $sections_args );
}
$sections_args = array( echo '</div>';
'metadata_sections__not_in' => $show_default_section_separated ? [ \Tainacan\Entities\Metadata_Section::$default_section_slug ] : [],
'before' => '',
'after' => '',
'before_name' => '<input name="accordion" type="radio" id="accordion-section-$id"/>
<label for="accordion-section-$id">
<i class="tainacan-icon tainacan-icon-arrowright"></i>
<h2 class="tainacan-single-item-section" id="metadata-section-$slug">',
'after_name' => '</h2>
</label>',
'before_metadata_list' => '<section class="tainacan-item-section tainacan-item-section--metadata">' . do_action( 'tainacan-blocksy-single-item-metadata-begin' ) . '
<div class="tainacan-item-section__metadata ' . $metadata_list_structure_type . '" aria-labelledby="metadata-section-$slug">',
'after_metadata_list' => '</div>' . do_action( 'tainacan-blocksy-single-item-metadata-end' ) . '</section>',
'metadata_list_args' => $metadata_args
);
echo '<div class="tainacan-metadata-sections-container metadata-section-layout--accordion">';
tainacan_the_metadata_sections( $sections_args );
echo '</div>';
} else {
$sections_args = array(
'metadata_sections__not_in' => $show_default_section_separated ? [ \Tainacan\Entities\Metadata_Section::$default_section_slug ] : [],
'before' => '<section class="tainacan-item-section tainacan-item-section--metadata">',
'after' => '</section>',
'before_name' => '<h2 class="tainacan-single-item-section" id="metadata-section-$slug">',
'after_name' => '</h2>',
'hide_name' => !$display_section_labels,
'before_metadata_list' => do_action( 'tainacan-blocksy-single-item-metadata-begin' ) . '<div class="tainacan-item-section__metadata ' . $metadata_list_structure_type . '">',
'after_metadata_list' => '</div>' . do_action( 'tainacan-blocksy-single-item-metadata-end' ),
'metadata_list_args' => $metadata_args
);
echo '<div class="tainacan-metadata-sections-container">';
tainacan_the_metadata_sections( $sections_args );
echo '</div>';
}
?> ?>