Merge branch 'feature/184' of github.com:tainacan/tainacan into feature/184

This commit is contained in:
vnmedeiros 2022-03-31 16:16:26 -03:00
commit d30982f4b2
5 changed files with 59 additions and 139 deletions

View File

@ -514,6 +514,18 @@
:alt="$i18n.get('label_thumbnail')"
:src="$thumbHelper.getEmptyThumbnailPlaceholder(item.document_mimetype)">
</figure>
<b-field
:addons="false"
:label="$i18n.get('label_thumbnail_alt')">
<help-button
:title="$i18n.get('label_thumbnail_alt')"
:message="$i18n.get('info_thumbnail_alt')"/>
<textarea
id="tainacan-text-description"
class="textarea"
rows="4"
v-model="form.thumbnail_alt" />
</b-field>
<div class="thumbnail-buttons-row">
<a
class="button is-rounded is-secondary"
@ -531,23 +543,6 @@
<i class="tainacan-icon tainacan-icon-edit"/>
</span>
</a>
<a
v-if="item.thumbnail && item.thumbnail.thumbnail != undefined && item.thumbnail.thumbnail != false"
id="button-alt-text-thumbnail"
class="button is-rounded is-secondary"
:aria-label="$i18n.get('label_button_delete_thumb')"
@click="openThumbnailModalAltText">
<span
v-tooltip="{
content: $i18n.get('label_thumbnail_alt'),
autoHide: true,
placement: 'bottom',
popperClass: ['tainacan-tooltip', 'tooltip']
}"
class="icon">
<i class="tainacan-icon tainacan-icon-text"/>
</span>
</a>
<a
v-if="item.thumbnail && item.thumbnail.thumbnail != undefined && item.thumbnail.thumbnail != false"
id="button-delete-thumbnail"
@ -894,7 +889,6 @@ import ItemMetadatumErrorsTooltip from '../other/item-metadatum-errors-tooltip.v
import { directive } from 'vue-awesome-swiper';
import ItemDocumentTextModal from '../modals/item-document-text-modal.vue';
import ItemDocumentURLModal from '../modals/item-document-url-modal.vue';
import ItemThumbnailAltTextModal from '../modals/item-thumbnail-alt-text-modal.vue';
export default {
name: 'ItemEditionForm',
@ -1552,27 +1546,6 @@ export default {
this.formErrorMessage = errors.error_message;
});
},
openThumbnailModalAltText() {
this.$buefy.modal.open({
parent: this,
component: ItemThumbnailAltTextModal,
canCancel: false,
width: 640,
scroll: 'keep',
trapFocus: true,
autoFocus: false,
ariaModal: true,
ariaRole: 'dialog',
customClass: 'tainacan-modal',
closeButtonAriaLabel: this.$i18n.get('close'),
props: {
altText: this.form.thumbnail_alt ? this.form.thumbnail_alt : ''
},
events: {
onUpdateThumbnailAlt: (altText) => this.form.thumbnail_alt = altText
}
});
},
deleteThumbnail() {
this.updateThumbnail({ itemId: this.itemId, thumbnailId: 0 })
.then(() => {
@ -2362,7 +2335,12 @@ export default {
}
.thumbnail-field {
display: flex;
.field {
margin-left: 12px;
width: 100%;
}
.content {
padding: 10px;
font-size: 0.8em;
@ -2399,7 +2377,9 @@ export default {
padding-left: 0;
padding-right: 0;
}
.section-thumbnaill {
padding-right: 0;
}
.related-items-list-heading {
display: flex;
align-items: center;

View File

@ -1,57 +0,0 @@
<template>
<form class="tainacan-modal-content tainacan-form">
<div class="tainacan-modal-title">
<h2 id="item-thumbnail-alt-text-modal-title">{{ $i18n.get('label_thumbnail_alt') }}</h2>
<hr>
</div>
<b-input
type="textarea"
ref="item-thumbnail-alt-text-input"
:autofocus="true"
lazy
:placeholder="$i18n.get('instruction_thumbnail_alt')"
:value="localAltText"
@input="(newValue) => $emit('onUpdateThumbnailAlt', newValue)" />
<p>{{ $i18n.get('info_thumbnail_alt') }}</p>
<div class="field is-grouped form-submit">
<div
style="margin-left: auto;"
class="control">
<button
id="button-submit-text-content-writing"
type="submit"
@click.prevent="$parent.close()"
class="button is-success">
{{ $i18n.get('finish') }}</button>
</div>
</div>
</form>
</template>
<script>
export default {
props: {
altText: ''
},
data(){
return {
localAltText: ''
}
},
mounted() {
this.localAltText = this.altText;
if (
this.$refs &&
this.$refs['item-thumbnail-alt-text-input'] &&
this.$refs['item-thumbnail-alt-text-input']['$el'] &&
this.$refs['item-thumbnail-alt-text-input']['$el'].children &&
this.$refs['item-thumbnail-alt-text-input']['$el'].children[0]
) {
this.$refs['item-thumbnail-alt-text-input']['$el'].children[0].focus();
this.$refs['item-thumbnail-alt-text-input']['$el'].children[0].click();
}
}
}
</script>

View File

@ -247,6 +247,43 @@
a {
text-decoration: none !important;
}
.tainacan-compound-group {
display: inline-block;
font-size: 1.125em;
margin-top: -0.25em;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
max-width: 100%;
& * {
display: inline;
}
.label {
font-size: 1em;
color: var(--tainacan-info-color);
&:not(:first-child)::before {
content: ', ';
font-size: 1em;
font-weight: normal;
color: var(--tainacan-info-color);
display: inline-block;
margin-right: 0.35em;
margin-left: -0.15em;
}
&::after {
content: ': ';
font-size: 1em;
color: var(--tainacan-info-color);
display: inline-block;
margin-right: 0.15em;
}
}
p {
font-size: 1em !important;
line-height: 1.25em !important;
}
}
}
img.table-thumb,
.table-thumb>div {

View File

@ -158,46 +158,6 @@ a:hover {
color: var(--tainacan-gray3);
}
.column-large-width {
.tainacan-compound-group {
display: inline-block;
font-size: 1.125em;
margin-top: -0.25em;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
max-width: 100%;
& * {
display: inline-block;
}
.label {
font-size: 1em;
color: var(--tainacan-info-color);
&:not(:first-child)::before {
content: ', ';
font-size: 1em;
font-weight: normal;
color: var(--tainacan-info-color);
display: inline-block;
margin-right: 0.35em;
margin-left: -0.15em;
}
&::after {
content: ': ';
font-size: 1em;
color: var(--tainacan-info-color);
display: inline-block;
margin-right: 0.15em;
}
}
p {
font-size: 1em !important;
line-height: 1.25em !important;
}
}
}
// Inside one of the view modes
.metadata-value {
.tainacan-compound-group {

View File

@ -176,7 +176,7 @@ return apply_filters( 'tainacan-i18n', [
'label_slug' => __( 'Slug', 'tainacan' ),
'label_image' => __( 'Image', 'tainacan' ),
'label_thumbnail' => __( 'Thumbnail', 'tainacan' ),
'label_thumbnail_alt' => __( 'Thumbnail alternative text', 'tainacan' ),
'label_thumbnail_alt' => __( 'Alternative text', 'tainacan' ),
'label_empty_thumbnail' => __( 'Empty thumbnail', 'tainacan' ),
'label_empty_term_image' => __( 'Empty term image', 'tainacan' ),
'label_parent_collection' => __( 'Parent collection', 'tainacan' ),