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

Fixes usage of some wrong tags in react.

This commit is contained in:
mateuswetah 2024-04-02 16:31:07 -03:00
parent 98b9e0a862
commit 3e0d01033c
31 changed files with 228 additions and 224 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/views/gutenberg-blocks/blocks/carousel-collections-list/carousel-collections-modal.js
View File

@ -238,10 +238,10 @@ export default class CollectionsModal extends React.Component {
) )
} }
</ul> </ul>
{ this.state.isLoadingCollections ? <div class="spinner-container"><Spinner /></div> : null } { this.state.isLoadingCollections ? <div className="spinner-container"><Spinner /></div> : null }
</div> </div>
) )
: this.state.isLoadingCollections ? <div class="spinner-container"><Spinner /></div> : : this.state.isLoadingCollections ? <div className="spinner-container"><Spinner /></div> :
<div className="modal-loadmore-section"> <div className="modal-loadmore-section">
<p>{ __('Sorry, no collections found.', 'tainacan') }</p> <p>{ __('Sorry, no collections found.', 'tainacan') }</p>
</div> </div>
@ -269,7 +269,7 @@ export default class CollectionsModal extends React.Component {
</li> </li>
) )
} }
{ this.state.isLoadingCollections ? <div class="spinner-container"><Spinner /></div> : null } { this.state.isLoadingCollections ? <div className="spinner-container"><Spinner /></div> : null }
</ul> </ul>
<div className="modal-loadmore-section"> <div className="modal-loadmore-section">
<p>{ __('Showing', 'tainacan') + " " + this.state.modalCollections.length + " " + __('of', 'tainacan') + " " + this.state.totalModalCollections + " " + __('collections', 'tainacan') + "."}</p> <p>{ __('Showing', 'tainacan') + " " + this.state.modalCollections.length + " " + __('of', 'tainacan') + " " + this.state.totalModalCollections + " " + __('collections', 'tainacan') + "."}</p>

10
src/views/gutenberg-blocks/blocks/carousel-collections-list/edit.js
View File

@ -88,7 +88,7 @@ export default function ({ attributes, setAttributes, isSelected, clientId }) {
id={ isNaN(collection.id) ? collection.id : 'collection-id-' + collection.id } id={ isNaN(collection.id) ? collection.id : 'collection-id-' + collection.id }
href={ collection.url }> href={ collection.url }>
{ ( !showCollectionThumbnail && Array.isArray(collectionItems) ) ? { ( !showCollectionThumbnail && Array.isArray(collectionItems) ) ?
<div class="collection-items-grid"> <div className="collection-items-grid">
<img <img
src={ collectionItems[0] ? thumbHelper.getSrc(collectionItems[0]['thumbnail'], imageSize, collectionItems[0]['document_mimetype']) :`${tainacan_blocks.base_url}/assets/images/placeholder_square.png` } src={ collectionItems[0] ? thumbHelper.getSrc(collectionItems[0]['thumbnail'], imageSize, collectionItems[0]['document_mimetype']) :`${tainacan_blocks.base_url}/assets/images/placeholder_square.png` }
srcSet={ collectionItems[0] ? thumbHelper.getSrcSet(collectionItems[0]['thumbnail'], imageSize, collectionItems[0]['document_mimetype']) :`${tainacan_blocks.base_url}/assets/images/placeholder_square.png` } srcSet={ collectionItems[0] ? thumbHelper.getSrcSet(collectionItems[0]['thumbnail'], imageSize, collectionItems[0]['document_mimetype']) :`${tainacan_blocks.base_url}/assets/images/placeholder_square.png` }
@ -424,12 +424,12 @@ export default function ({ attributes, setAttributes, isSelected, clientId }) {
} }
{ isLoading ? { isLoading ?
<div class="spinner-container"> <div className="spinner-container">
<Spinner /> <Spinner />
</div> : </div> :
<div> <div>
{ isSelected && collections.length ? { isSelected && collections.length ?
<div class="preview-warning">{__('Warning: this is just a demonstration. To see the carousel in action, either preview or publish your post.', 'tainacan')}</div> <div className="preview-warning">{__('Warning: this is just a demonstration. To see the carousel in action, either preview or publish your post.', 'tainacan')}</div>
: null : null
} }
{ collections.length ? ( { collections.length ? (
@ -445,7 +445,7 @@ export default function ({ attributes, setAttributes, isSelected, clientId }) {
</ul> </ul>
</div> </div>
<button <button
class="swiper-button-prev" className="swiper-button-prev"
slot="button-prev" slot="button-prev"
style={{ cursor: 'not-allowed' }}> style={{ cursor: 'not-allowed' }}>
<svg <svg
@ -464,7 +464,7 @@ export default function ({ attributes, setAttributes, isSelected, clientId }) {
</svg> </svg>
</button> </button>
<button <button
class="swiper-button-next" className="swiper-button-next"
slot="button-next" slot="button-next"
style={{ cursor: 'not-allowed' }}> style={{ cursor: 'not-allowed' }}>
<svg <svg

20
src/views/gutenberg-blocks/blocks/carousel-items-list/edit.js
View File

@ -103,7 +103,7 @@ export default function({ attributes, setAttributes, isSelected, clientId }){
<a <a
id={ isNaN(item.id) ? item.id : 'item-id-' + item.id } id={ isNaN(item.id) ? item.id : 'item-id-' + item.id }
href={ item.url }> href={ item.url }>
<div class="items-list-item--image-wrap"> <div className="items-list-item--image-wrap">
<img <img
src={ thumbHelper.getSrc(item['thumbnail'], imageSize, item['document_mimetype']) } src={ thumbHelper.getSrc(item['thumbnail'], imageSize, item['document_mimetype']) }
srcSet={ thumbHelper.getSrcSet(item['thumbnail'], imageSize, item['document_mimetype']) } srcSet={ thumbHelper.getSrcSet(item['thumbnail'], imageSize, item['document_mimetype']) }
@ -580,13 +580,13 @@ export default function({ attributes, setAttributes, isSelected, clientId }){
<div> { <div> {
isLoadingCollection ? isLoadingCollection ?
<div class="spinner-container"> <div className="spinner-container">
<Spinner /> <Spinner />
</div> </div>
: :
<a <a
href={ collection.url ? collection.url : '' } href={ collection.url ? collection.url : '' }
class="carousel-items-collection-header"> className="carousel-items-collection-header">
<div <div
style={{ style={{
backgroundColor: collectionBackgroundColor ? collectionBackgroundColor : '', backgroundColor: collectionBackgroundColor ? collectionBackgroundColor : '',
@ -599,21 +599,21 @@ export default function({ attributes, setAttributes, isSelected, clientId }){
((!collection || !collection.thumbnail || (!collection.thumbnail['tainacan-medium'] && !collection.thumbnail['medium'])) && (!collection || !collection.header_image) ? 'only-collection-name' : '') ((!collection || !collection.thumbnail || (!collection.thumbnail['tainacan-medium'] && !collection.thumbnail['medium'])) && (!collection || !collection.header_image) ? 'only-collection-name' : '')
}> }>
<h3 style={{ color: collectionTextColor ? collectionTextColor : '' }}> <h3 style={{ color: collectionTextColor ? collectionTextColor : '' }}>
{ showCollectionLabel ? <span class="label">{ __('Collection', 'tainacan') }<br/></span> : null } { showCollectionLabel ? <span className="label">{ __('Collection', 'tainacan') }<br/></span> : null }
{ collection && collection.name ? collection.name : '' } { collection && collection.name ? collection.name : '' }
</h3> </h3>
</div> </div>
{ {
collection && collection.thumbnail && (collection.thumbnail['tainacan-medium'] || collection.thumbnail['medium']) ? collection && collection.thumbnail && (collection.thumbnail['tainacan-medium'] || collection.thumbnail['medium']) ?
<div <div
class="collection-thumbnail" className="collection-thumbnail"
style={{ style={{
backgroundImage: 'url(' + (collection.thumbnail['tainacan-medium'] != undefined ? (collection.thumbnail['tainacan-medium'][0]) : (collection.thumbnail['medium'][0])) + ')', backgroundImage: 'url(' + (collection.thumbnail['tainacan-medium'] != undefined ? (collection.thumbnail['tainacan-medium'][0]) : (collection.thumbnail['medium'][0])) + ')',
}}/> }}/>
: null : null
} }
<div <div
class="collection-header-image" className="collection-header-image"
style={{ style={{
backgroundImage: collection.header_image ? 'url(' + collection.header_image + ')' : '', backgroundImage: collection.header_image ? 'url(' + collection.header_image + ')' : '',
minHeight: collection && collection.header_image ? '' : '80px', minHeight: collection && collection.header_image ? '' : '80px',
@ -667,12 +667,12 @@ export default function({ attributes, setAttributes, isSelected, clientId }){
} }
{ isLoading ? { isLoading ?
<div class="spinner-container"> <div className="spinner-container">
<Spinner /> <Spinner />
</div> : </div> :
<div> <div>
{ isSelected && items.length ? { isSelected && items.length ?
<div class="preview-warning">{__('Warning: this is just a demonstration. To see the carousel in action, either preview or publish your post.', 'tainacan')}</div> <div className="preview-warning">{__('Warning: this is just a demonstration. To see the carousel in action, either preview or publish your post.', 'tainacan')}</div>
: null : null
} }
{ items.length ? ( { items.length ? (
@ -692,7 +692,7 @@ export default function({ attributes, setAttributes, isSelected, clientId }){
</ul> </ul>
</div> </div>
<button <button
class="swiper-button-prev" className="swiper-button-prev"
slot="button-prev" slot="button-prev"
style={{ cursor: 'not-allowed' }}> style={{ cursor: 'not-allowed' }}>
<svg <svg
@ -711,7 +711,7 @@ export default function({ attributes, setAttributes, isSelected, clientId }){
</svg> </svg>
</button> </button>
<button <button
class="swiper-button-next" className="swiper-button-next"
slot="button-next" slot="button-next"
style={{ cursor: 'not-allowed' }}> style={{ cursor: 'not-allowed' }}>
<svg <svg

10
src/views/gutenberg-blocks/blocks/carousel-terms-list/edit.js
View File

@ -89,7 +89,7 @@ export default function({ attributes, setAttributes, isSelected, clientId }){
id={ isNaN(term.id) ? term.id : 'term-id-' + term.id } id={ isNaN(term.id) ? term.id : 'term-id-' + term.id }
href={ term.url }> href={ term.url }>
{ ( !showTermThumbnail && Array.isArray(termItems) ) ? { ( !showTermThumbnail && Array.isArray(termItems) ) ?
<div class="term-items-grid"> <div className="term-items-grid">
<img <img
src={ termItems[0] ? thumbHelper.getSrc(termItems[0]['thumbnail'], 'tainacan-medium', termItems[0]['document_mimetype']) :`${tainacan_blocks.base_url}/assets/images/placeholder_square.png` } src={ termItems[0] ? thumbHelper.getSrc(termItems[0]['thumbnail'], 'tainacan-medium', termItems[0]['document_mimetype']) :`${tainacan_blocks.base_url}/assets/images/placeholder_square.png` }
srcSet={ termItems[0] ? thumbHelper.getSrcSet(termItems[0]['thumbnail'], 'tainacan-medium', termItems[0]['document_mimetype']) :`${tainacan_blocks.base_url}/assets/images/placeholder_square.png` } srcSet={ termItems[0] ? thumbHelper.getSrcSet(termItems[0]['thumbnail'], 'tainacan-medium', termItems[0]['document_mimetype']) :`${tainacan_blocks.base_url}/assets/images/placeholder_square.png` }
@ -433,12 +433,12 @@ export default function({ attributes, setAttributes, isSelected, clientId }){
} }
{ isLoading ? { isLoading ?
<div class="spinner-container"> <div className="spinner-container">
<Spinner /> <Spinner />
</div> : </div> :
<div> <div>
{ isSelected && terms.length ? { isSelected && terms.length ?
<div class="preview-warning">{__('Warning: this is just a demonstration. To see the carousel in action, either preview or publish your post.', 'tainacan')}</div> <div className="preview-warning">{__('Warning: this is just a demonstration. To see the carousel in action, either preview or publish your post.', 'tainacan')}</div>
: null : null
} }
{ terms.length ? ( { terms.length ? (
@ -454,7 +454,7 @@ export default function({ attributes, setAttributes, isSelected, clientId }){
</ul> </ul>
</div> </div>
<button <button
class="swiper-button-prev" className="swiper-button-prev"
slot="button-prev" slot="button-prev"
style={{ cursor: 'not-allowed' }}> style={{ cursor: 'not-allowed' }}>
<svg <svg
@ -473,7 +473,7 @@ export default function({ attributes, setAttributes, isSelected, clientId }){
</svg> </svg>
</button> </button>
<button <button
class="swiper-button-next" className="swiper-button-next"
slot="button-next" slot="button-next"
style={{ cursor: 'not-allowed' }}> style={{ cursor: 'not-allowed' }}>
<svg <svg

6
src/views/gutenberg-blocks/blocks/collections-list/collections-modal.js
View File

@ -240,10 +240,10 @@ export default class CollectionsModal extends React.Component {
) )
} }
</ul> </ul>
{ this.state.isLoadingCollections ? <div class="spinner-container"><Spinner /></div> : null } { this.state.isLoadingCollections ? <div className="spinner-container"><Spinner /></div> : null }
</div> </div>
) )
: this.state.isLoadingCollections ? <div class="spinner-container"><Spinner /></div> : : this.state.isLoadingCollections ? <div className="spinner-container"><Spinner /></div> :
<div className="modal-loadmore-section"> <div className="modal-loadmore-section">
<p>{ __('Sorry, no collections found.', 'tainacan') }</p> <p>{ __('Sorry, no collections found.', 'tainacan') }</p>
</div> </div>
@ -271,7 +271,7 @@ export default class CollectionsModal extends React.Component {
</li> </li>
) )
} }
{ this.state.isLoadingCollections ? <div class="spinner-container"><Spinner /></div> : null } { this.state.isLoadingCollections ? <div className="spinner-container"><Spinner /></div> : null }
</ul> </ul>
<div className="modal-loadmore-section"> <div className="modal-loadmore-section">
<p>{ __('Showing', 'tainacan') + " " + this.state.modalCollections.length + " " + __('of', 'tainacan') + " " + this.state.totalModalCollections + " " + __('collections', 'tainacan') + "."}</p> <p>{ __('Showing', 'tainacan') + " " + this.state.modalCollections.length + " " + __('of', 'tainacan') + " " + this.state.totalModalCollections + " " + __('collections', 'tainacan') + "."}</p>

4
src/views/gutenberg-blocks/blocks/collections-list/edit.js
View File

@ -32,9 +32,9 @@ export default function({ attributes, setAttributes, isSelected }) {
<button <button
onClick={ () => removeCollectionOfId(collection.id) } onClick={ () => removeCollectionOfId(collection.id) }
type="button" type="button"
class="components-button has-icon" className="components-button has-icon"
aria-label={__('Remove', 'tainacan')}> aria-label={__('Remove', 'tainacan')}>
<span class="dashicon dashicons dashicons-no-alt" /> <span className="dashicon dashicons dashicons-no-alt" />
</button> </button>
<a <a
id={ isNaN(collection.id) ? collection.id : 'collection-id-' + collection.id } id={ isNaN(collection.id) ? collection.id : 'collection-id-' + collection.id }

30
src/views/gutenberg-blocks/blocks/dynamic-items-list/edit.js
View File

@ -886,13 +886,13 @@ export default function({ attributes, setAttributes, isSelected, clientId }) {
<div> { <div> {
isLoadingCollection ? isLoadingCollection ?
<div class="spinner-container"> <div className="spinner-container">
<Spinner /> <Spinner />
</div> </div>
: :
<a <a
href={ collection.url ? collection.url : '' } href={ collection.url ? collection.url : '' }
class="dynamic-items-collection-header"> className="dynamic-items-collection-header">
<div <div
style={{ style={{
backgroundColor: collectionBackgroundColor ? collectionBackgroundColor : '', backgroundColor: collectionBackgroundColor ? collectionBackgroundColor : '',
@ -905,21 +905,21 @@ export default function({ attributes, setAttributes, isSelected, clientId }) {
((!collection || !collection.thumbnail || (!collection.thumbnail['tainacan-medium'] && !collection.thumbnail['medium'])) && (!collection || !collection.header_image) ? 'only-collection-name' : '') ((!collection || !collection.thumbnail || (!collection.thumbnail['tainacan-medium'] && !collection.thumbnail['medium'])) && (!collection || !collection.header_image) ? 'only-collection-name' : '')
}> }>
<h3 style={{ color: collectionTextColor ? collectionTextColor : '' }}> <h3 style={{ color: collectionTextColor ? collectionTextColor : '' }}>
{ showCollectionLabel ? <span class="label">{ __('Collection', 'tainacan') }<br/></span> : null } { showCollectionLabel ? <span className="label">{ __('Collection', 'tainacan') }<br/></span> : null }
{ collection && collection.name ? collection.name : '' } { collection && collection.name ? collection.name : '' }
</h3> </h3>
</div> </div>
{ {
collection && collection.thumbnail && (collection.thumbnail['tainacan-medium'] || collection.thumbnail['medium']) ? collection && collection.thumbnail && (collection.thumbnail['tainacan-medium'] || collection.thumbnail['medium']) ?
<div <div
class="collection-thumbnail" className="collection-thumbnail"
style={{ style={{
backgroundImage: 'url(' + (collection.thumbnail['tainacan-medium'] != undefined ? (collection.thumbnail['tainacan-medium'][0]) : (collection.thumbnail['medium'][0])) + ')', backgroundImage: 'url(' + (collection.thumbnail['tainacan-medium'] != undefined ? (collection.thumbnail['tainacan-medium'][0]) : (collection.thumbnail['medium'][0])) + ')',
}}/> }}/>
: null : null
} }
<div <div
class="collection-header-image" className="collection-header-image"
style={{ style={{
backgroundImage: collection.header_image ? 'url(' + collection.header_image + ')' : '', backgroundImage: collection.header_image ? 'url(' + collection.header_image + ')' : '',
minHeight: collection && collection.header_image ? '' : '80px', minHeight: collection && collection.header_image ? '' : '80px',
@ -933,12 +933,12 @@ export default function({ attributes, setAttributes, isSelected, clientId }) {
{ {
showSearchBar ? showSearchBar ?
<div class="dynamic-items-search-bar"> <div className="dynamic-items-search-bar">
<Button <Button
onClick={ () => { order = 'asc'; setAttributes({ order: order }); setContent(); }} onClick={ () => { order = 'asc'; setAttributes({ order: order }); setContent(); }}
className={order == 'asc' ? 'sorting-button-selected' : ''} className={order == 'asc' ? 'sorting-button-selected' : ''}
label={__('Sort ascending', 'tainacan')}> label={__('Sort ascending', 'tainacan')}>
<span class="icon"> <span className="icon">
<i> <i>
<svg width="24" height="24" viewBox="-2 -4 20 20"> <svg width="24" height="24" viewBox="-2 -4 20 20">
<path d="M6.7,10.8l-3.3,3.3L0,10.8h2.5V0h1.7v10.8H6.7z M11.7,0.8H8.3v1.7h3.3V0.8z M14.2,5.8H8.3v1.7h5.8V5.8z M16.7,10.8H8.3v1.7 h8.3V10.8z"/> <path d="M6.7,10.8l-3.3,3.3L0,10.8h2.5V0h1.7v10.8H6.7z M11.7,0.8H8.3v1.7h3.3V0.8z M14.2,5.8H8.3v1.7h5.8V5.8z M16.7,10.8H8.3v1.7 h8.3V10.8z"/>
@ -950,7 +950,7 @@ export default function({ attributes, setAttributes, isSelected, clientId }) {
onClick={ () => { order = 'desc'; setAttributes({ order: order }); setContent(); }} onClick={ () => { order = 'desc'; setAttributes({ order: order }); setContent(); }}
className={order == 'desc' ? 'sorting-button-selected' : ''} className={order == 'desc' ? 'sorting-button-selected' : ''}
label={__('Sort descending', 'tainacan')}> label={__('Sort descending', 'tainacan')}>
<span class="icon"> <span className="icon">
<i> <i>
<svg width="24" height="24" viewBox="-2 -4 20 20"> <svg width="24" height="24" viewBox="-2 -4 20 20">
<path d="M6.7,3.3H4.2v10.8H2.5V3.3H0L3.3,0L6.7,3.3z M11.6,2.5H8.3v1.7h3.3V2.5z M14.1,7.5H8.3v1.7h5.8V7.5z M16.6,12.5H8.3v1.7 h8.3V12.5z"/> <path d="M6.7,3.3H4.2v10.8H2.5V3.3H0L3.3,0L6.7,3.3z M11.6,2.5H8.3v1.7h3.3V2.5z M14.1,7.5H8.3v1.7h5.8V7.5z M16.6,12.5H8.3v1.7 h8.3V12.5z"/>
@ -961,10 +961,10 @@ export default function({ attributes, setAttributes, isSelected, clientId }) {
<Button <Button
onClick={ () => { setContent(); }} onClick={ () => { setContent(); }}
label={__('Search', 'tainacan')}> label={__('Search', 'tainacan')}>
<span class="icon"> <span className="icon">
<i> <i>
<svg width="24" height="24" viewBox="-2 -4 20 20"> <svg width="24" height="24" viewBox="-2 -4 20 20">
<path class="st0" d="M0,5.8C0,5,0.2,4.2,0.5,3.5s0.7-1.3,1.2-1.8s1.1-0.9,1.8-1.2C4.2,0.1,5,0,5.8,0S7.3,0.1,8,0.5 <path className="st0" d="M0,5.8C0,5,0.2,4.2,0.5,3.5s0.7-1.3,1.2-1.8s1.1-0.9,1.8-1.2C4.2,0.1,5,0,5.8,0S7.3,0.1,8,0.5
c0.7,0.3,1.3,0.7,1.8,1.2s0.9,1.1,1.2,1.8c0.5,1.2,0.5,2.5,0.2,3.7c0,0.2-0.1,0.4-0.2,0.6c0,0.1-0.2,0.6-0.2,0.6 c0.7,0.3,1.3,0.7,1.8,1.2s0.9,1.1,1.2,1.8c0.5,1.2,0.5,2.5,0.2,3.7c0,0.2-0.1,0.4-0.2,0.6c0,0.1-0.2,0.6-0.2,0.6
c0.6,0.6,1.3,1.3,1.9,1.9c0.7,0.7,1.3,1.3,2,2c0,0,0.3,0.2,0.3,0.3c0,0.3-0.1,0.7-0.3,1c-0.2,0.6-0.8,1-1.4,1.2 c0.6,0.6,1.3,1.3,1.9,1.9c0.7,0.7,1.3,1.3,2,2c0,0,0.3,0.2,0.3,0.3c0,0.3-0.1,0.7-0.3,1c-0.2,0.6-0.8,1-1.4,1.2
c-0.1,0-0.6,0.2-0.6,0.1c0,0-4.2-4.2-4.2-4.2c0,0-0.8,0.3-0.8,0.4c-1.3,0.4-2.8,0.5-4.1-0.1c-0.7-0.3-1.3-0.7-1.8-1.2 c-0.1,0-0.6,0.2-0.6,0.1c0,0-4.2-4.2-4.2-4.2c0,0-0.8,0.3-0.8,0.4c-1.3,0.4-2.8,0.5-4.1-0.1c-0.7-0.3-1.3-0.7-1.8-1.2
@ -980,10 +980,10 @@ export default function({ attributes, setAttributes, isSelected, clientId }) {
onChange={ (value) => { _.debounce(applySearchString(value), 300); } } onChange={ (value) => { _.debounce(applySearchString(value), 300); } }
type="text"/> type="text"/>
<Button <Button
class="previous-button" className="previous-button"
disabled disabled
label={__('Previous page', 'tainacan')}> label={__('Previous page', 'tainacan')}>
<span class="icon"> <span className="icon">
<i> <i>
<svg <svg
width="30" width="30"
@ -998,10 +998,10 @@ export default function({ attributes, setAttributes, isSelected, clientId }) {
</span> </span>
</Button> </Button>
<Button <Button
class="next-button" className="next-button"
disabled disabled
label={__('Next page', 'tainacan')}> label={__('Next page', 'tainacan')}>
<span class="icon"> <span className="icon">
<i> <i>
<svg <svg
width="30" width="30"
@ -1062,7 +1062,7 @@ export default function({ attributes, setAttributes, isSelected, clientId }) {
} }
{ isLoading ? { isLoading ?
<div class="spinner-container"> <div className="spinner-container">
<Spinner /> <Spinner />
</div> : </div> :
<div> <div>

2
src/views/gutenberg-blocks/blocks/faceted-search/collection-modal.js
View File

@ -353,7 +353,7 @@ export default class CollectionModal extends React.Component {
} }
</div> </div>
</div> </div>
) : this.state.isLoadingCollections ? <div class="spinner-container"><Spinner /></div> : ) : this.state.isLoadingCollections ? <div className="spinner-container"><Spinner /></div> :
<div className="modal-loadmore-section"> <div className="modal-loadmore-section">
<p>{ __('Sorry, no collection found.', 'tainacan') }</p> <p>{ __('Sorry, no collection found.', 'tainacan') }</p>
</div> </div>

120
src/views/gutenberg-blocks/blocks/faceted-search/edit.js
View File

@ -227,7 +227,7 @@ export default function({ attributes, setAttributes, isSelected, clientId }) {
onClick={ onToggle } onClick={ onToggle }
aria-expanded={ isOpen }> aria-expanded={ isOpen }>
{ __('Items list source', 'tainacan') } { __('Items list source', 'tainacan') }
<span class="components-dropdown-menu__indicator"></span> <span className="components-dropdown-menu__indicator"></span>
</ToolbarButton> </ToolbarButton>
) } ) }
renderContent={ ( { onToggle } ) => ( renderContent={ ( { onToggle } ) => (
@ -808,7 +808,7 @@ export default function({ attributes, setAttributes, isSelected, clientId }) {
) : ) :
( (
<div style={{ fontSize: (baseFontSize - 2) + 'px' }}> <div style={{ fontSize: (baseFontSize - 2) + 'px' }}>
<div class="preview-warning"> <div className="preview-warning">
{ __('Warning: this is just a demonstration. To see the items list, either preview or publish your post.', 'tainacan') } { __('Warning: this is just a demonstration. To see the items list, either preview or publish your post.', 'tainacan') }
</div> </div>
<div <div
@ -828,139 +828,139 @@ export default function({ attributes, setAttributes, isSelected, clientId }) {
'--tainacan-primary': primaryColor, '--tainacan-primary': primaryColor,
'--tainacan-secondary': secondaryColor '--tainacan-secondary': secondaryColor
}} }}
class="items-list-placeholder"> className="items-list-placeholder">
<div class="search-control"> <div className="search-control">
{ {
!hideSearch ? !hideSearch ?
<span class="fake-searchbar"> <span className="fake-searchbar">
{ !hideAdvancedSearch ? <span class="fake-advanced-searchbar"></span> : null } { !hideAdvancedSearch ? <span className="fake-advanced-searchbar"></span> : null }
</span> </span>
: null : null
} }
{ {
showFiltersButtonInsideSearchControl && !hideHideFiltersButton ? <span class="fake-button"><div class="fake-icon"></div><div class="fake-text"></div></span> : null showFiltersButtonInsideSearchControl && !hideHideFiltersButton ? <span className="fake-button"><div className="fake-icon"></div><div className="fake-text"></div></span> : null
} }
{ {
!hideDisplayedMetadataButton ? !hideDisplayedMetadataButton ?
<span class="fake-button"><div class="fake-text"></div></span> <span className="fake-button"><div className="fake-text"></div></span>
:null :null
} }
{ {
!hideSortingArea ? !hideSortingArea ?
<span class="fake-button"> { !hideSortByButton ? <div class="fake-text"></div> : null }<div class="fake-icon"></div><div class="fake-text"></div></span> <span className="fake-button"> { !hideSortByButton ? <div className="fake-text"></div> : null }<div className="fake-icon"></div><div className="fake-text"></div></span>
:null :null
} }
{ {
!showInlineViewModeOptions ? !showInlineViewModeOptions ?
<span class="fake-button"><div class="fake-icon"></div><div class="fake-text"></div></span> <span className="fake-button"><div className="fake-icon"></div><div className="fake-text"></div></span>
: :
<div class="fake-buttons-group"> <div className="fake-buttons-group">
{ Array(3).fill().map( () => <div class="fake-button"><div class="fake-icon"></div></div> )} { Array(3).fill().map( () => <div className="fake-button"><div className="fake-icon"></div></div> )}
{ showFullscreenWithViewModes ? <span class="fake-button"><div class="fake-icon"></div></span> : null } { showFullscreenWithViewModes ? <span className="fake-button"><div className="fake-icon"></div></span> : null }
</div> </div>
} }
{ {
!showFullscreenWithViewModes ? <span class="fake-button"><div class="fake-icon"></div><div class="fake-text"></div></span> : null !showFullscreenWithViewModes ? <span className="fake-button"><div className="fake-icon"></div><div className="fake-text"></div></span> : null
} }
{ {
!hideExposersButton ? <span class="fake-button"><div class="fake-icon"></div><div class="fake-text"></div></span> : null !hideExposersButton ? <span className="fake-button"><div className="fake-icon"></div><div className="fake-text"></div></span> : null
} }
</div> </div>
<div class="below-search-control"> <div className="below-search-control">
{ !showFiltersButtonInsideSearchControl & !hideHideFiltersButton && !hideFilters ? <span class="fake-hide-button"><div class="fake-icon"></div></span> : null } { !showFiltersButtonInsideSearchControl & !hideHideFiltersButton && !hideFilters ? <span className="fake-hide-button"><div className="fake-icon"></div></span> : null }
{ {
!hideFilters && !filtersAsModal && !startWithFiltersHidden ? !hideFilters && !filtersAsModal && !startWithFiltersHidden ?
<div <div
style={{ style={{
flexBasis: filtersAreaWidth + '%' flexBasis: filtersAreaWidth + '%'
}} }}
class="filters"> className="filters">
<div class="fake-filters-heading"></div> <div className="fake-filters-heading"></div>
{ Array(2).fill().map( () => { { Array(2).fill().map( () => {
return <div class="fake-filter"> return <div className="fake-filter">
<span class="fake-text"></span> <span className="fake-text"></span>
<span class="fake-searchbar"></span> <span className="fake-searchbar"></span>
</div> </div>
} )} } )}
<div class="fake-filter"> <div className="fake-filter">
<span class="fake-text"></span> <span className="fake-text"></span>
<div class="fake-checkbox-list"> <div className="fake-checkbox-list">
{ Array(4).fill().map( () => { { Array(4).fill().map( () => {
return <div> return <div>
<span class="fake-checkbox"></span> <span className="fake-checkbox"></span>
<span class="fake-text"></span> <span className="fake-text"></span>
</div> </div>
} ) } } ) }
<div class="fake-link"></div> <div className="fake-link"></div>
</div> </div>
</div> </div>
<div class="fake-filter"> <div className="fake-filter">
<span class="fake-text"></span> <span className="fake-text"></span>
<span class="fake-searchbar"></span> <span className="fake-searchbar"></span>
</div> </div>
<div class="fake-filter"> <div className="fake-filter">
<span class="fake-text"></span> <span className="fake-text"></span>
<div class="fake-checkbox-list"> <div className="fake-checkbox-list">
{ Array(2).fill().map( () => { { Array(2).fill().map( () => {
return <div> return <div>
<span class="fake-checkbox"></span> <span className="fake-checkbox"></span>
<span class="fake-text"></span> <span className="fake-text"></span>
</div> </div>
} ) } } ) }
<div class="fake-link"></div> <div className="fake-link"></div>
</div> </div>
</div> </div>
</div> </div>
: null : null
} }
<div class="aside-filters"> <div className="aside-filters">
<div className={ 'items' + (hideItemsThumbnail ? ' items-without-thumbnail' : '') }> <div className={ 'items' + (hideItemsThumbnail ? ' items-without-thumbnail' : '') }>
{ Array(5).fill().map( () => { { Array(5).fill().map( () => {
return <div class="fake-item"> return <div className="fake-item">
<div class="fake-item-header"> <div className="fake-item-header">
<div class="fake-text"></div> <div className="fake-text"></div>
</div> </div>
<div <div
style={{ style={{
backgroundImage: tainacan_plugin ? 'url("' + tainacan_plugin.base_url + '/assets/images/placeholder_square.png")' : '' backgroundImage: tainacan_plugin ? 'url("' + tainacan_plugin.base_url + '/assets/images/placeholder_square.png")' : ''
}} }}
class="fake-item-thumb"></div> className="fake-item-thumb"></div>
{ Array(3).fill().map( () => <div class="fake-item-description"></div> ) } { Array(3).fill().map( () => <div className="fake-item-description"></div> ) }
</div> </div>
} ) } } ) }
<div class="fake-item fake-item-hovered"> <div className="fake-item fake-item-hovered">
<div class="fake-item-header"> <div className="fake-item-header">
<div class="fake-tooltip"><div class="fake-link"></div></div> <div className="fake-tooltip"><div className="fake-link"></div></div>
<div class="fake-text"></div> <div className="fake-text"></div>
</div> </div>
<div <div
style={{ style={{
backgroundImage: tainacan_plugin ? 'url("' + tainacan_plugin.base_url + '/assets/images/placeholder_square.png")' : '' backgroundImage: tainacan_plugin ? 'url("' + tainacan_plugin.base_url + '/assets/images/placeholder_square.png")' : ''
}} }}
class="fake-item-thumb"></div> className="fake-item-thumb"></div>
{ Array(3).fill().map( () => <div class="fake-item-description"></div> ) } { Array(3).fill().map( () => <div className="fake-item-description"></div> ) }
</div> </div>
{ Array(2).fill().map( () => { { Array(2).fill().map( () => {
return <div class="fake-item"> return <div className="fake-item">
<div class="fake-item-header"> <div className="fake-item-header">
<div class="fake-text"></div> <div className="fake-text"></div>
</div> </div>
<div <div
style={{ style={{
backgroundImage: tainacan_plugin ? 'url("' + tainacan_plugin.base_url + '/assets/images/placeholder_square.png")' : '' backgroundImage: tainacan_plugin ? 'url("' + tainacan_plugin.base_url + '/assets/images/placeholder_square.png")' : ''
}} }}
class="fake-item-thumb"></div> className="fake-item-thumb"></div>
{ Array(3).fill().map( () => <div class="fake-item-description"></div> ) } { Array(3).fill().map( () => <div className="fake-item-description"></div> ) }
</div> </div>
} ) } } ) }
</div> </div>
{ !hidePaginationArea ? { !hidePaginationArea ?
<div class="pagination"> <div className="pagination">
<span class="fake-text"></span> <span className="fake-text"></span>
{ !hideItemsPerPageButton ? <span class="fake-button"><div class="fake-text"></div></span> : null } { !hideItemsPerPageButton ? <span className="fake-button"><div className="fake-text"></div></span> : null }
{ !hideGoToPageButton ? <span class="fake-button"><div class="fake-text"></div></span> : null } { !hideGoToPageButton ? <span className="fake-button"><div className="fake-text"></div></span> : null }
<div class="fake-buttons-group"> <div className="fake-buttons-group">
{ Array(6).fill().map( () => <div class="fake-link"></div> ) } { Array(6).fill().map( () => <div className="fake-link"></div> ) }
</div> </div>
</div> </div>
: null } : null }

12
src/views/gutenberg-blocks/blocks/faceted-search/term-modal.js
View File

@ -325,10 +325,10 @@ export default class TermModal extends React.Component {
} } /> } } />
} }
</ul> </ul>
{ this.state.isLoadingTerms ? <div class="spinner-container"><Spinner /></div> : null } { this.state.isLoadingTerms ? <div className="spinner-container"><Spinner /></div> : null }
</div> </div>
) )
: this.state.isLoadingTerms ? <div class="spinner-container"><Spinner /></div> : : this.state.isLoadingTerms ? <div className="spinner-container"><Spinner /></div> :
<div className="modal-loadmore-section"> <div className="modal-loadmore-section">
<p>{ __('Sorry, no terms found.', 'tainacan') }</p> <p>{ __('Sorry, no terms found.', 'tainacan') }</p>
</div> </div>
@ -350,7 +350,7 @@ export default class TermModal extends React.Component {
} } /> } } />
} }
</ul> </ul>
{ this.state.isLoadingTerms ? <div class="spinner-container"><Spinner /></div> : null } { this.state.isLoadingTerms ? <div className="spinner-container"><Spinner /></div> : null }
<div className="modal-loadmore-section"> <div className="modal-loadmore-section">
<p>{ __('Showing', 'tainacan') + " " + this.state.modalTerms.length + " " + __('of', 'tainacan') + " " + this.state.totalModalTerms + " " + __('terms', 'tainacan') + "."}</p> <p>{ __('Showing', 'tainacan') + " " + this.state.modalTerms.length + " " + __('of', 'tainacan') + " " + this.state.totalModalTerms + " " + __('terms', 'tainacan') + "."}</p>
{ {
@ -365,7 +365,7 @@ export default class TermModal extends React.Component {
} }
</div> </div>
</div> </div>
) : this.state.isLoadingTerms ? <div class="spinner-container"><Spinner /></div> : ) : this.state.isLoadingTerms ? <div className="spinner-container"><Spinner /></div> :
<div className="modal-loadmore-section"> <div className="modal-loadmore-section">
<p>{ __('Sorry, no terms found.', 'tainacan') }</p> <p>{ __('Sorry, no terms found.', 'tainacan') }</p>
</div> </div>
@ -448,7 +448,7 @@ export default class TermModal extends React.Component {
</div> </div>
) : ) :
this.state.isLoadingTaxonomies ? ( this.state.isLoadingTaxonomies ? (
<div class="spinner-container"><Spinner /></div> <div className="spinner-container"><Spinner /></div>
) : ) :
<div className="modal-loadmore-section"> <div className="modal-loadmore-section">
<p>{ __('Sorry, no taxonomy found.', 'tainacan') }</p> <p>{ __('Sorry, no taxonomy found.', 'tainacan') }</p>
@ -485,7 +485,7 @@ export default class TermModal extends React.Component {
} }
</div> </div>
</div> </div>
) : this.state.isLoadingTaxonomies ? <div class="spinner-container"><Spinner /></div> : ) : this.state.isLoadingTaxonomies ? <div className="spinner-container"><Spinner /></div> :
<div className="modal-loadmore-section"> <div className="modal-loadmore-section">
<p>{ __('Sorry, no taxonomy found.', 'tainacan') }</p> <p>{ __('Sorry, no taxonomy found.', 'tainacan') }</p>
</div> </div>

20
src/views/gutenberg-blocks/blocks/facets-list/edit.js
View File

@ -147,7 +147,7 @@ export default function({ attributes, setAttributes, isSelected, clientId }) {
<span>{ facet.label ? facet.label : '' }</span> <span>{ facet.label ? facet.label : '' }</span>
{ {
facet.total_items ? facet.total_items ?
<span class="facet-item-count" style={{ display: !showItemsCount ? 'none' : '' }}> <span className="facet-item-count" style={{ display: !showItemsCount ? 'none' : '' }}>
{ itemsCountStyle === 'below' ? { itemsCountStyle === 'below' ?
( facet.total_items != 1 ? (facet.total_items + ' ' + __('items', 'tainacan' )) : (facet.total_items + ' ' + __('item', 'tainacan' )) ) ( facet.total_items != 1 ? (facet.total_items + ' ' + __('items', 'tainacan' )) : (facet.total_items + ' ' + __('item', 'tainacan' )) )
: :
@ -182,19 +182,19 @@ export default function({ attributes, setAttributes, isSelected, clientId }) {
</a> </a>
{ appendChildTerms && facet.total_children > 0 ? { appendChildTerms && facet.total_children > 0 ?
isLoadingChildTerms == facetId ? isLoadingChildTerms == facetId ?
<div class="spinner-container"> <div className="spinner-container">
<Spinner /> <Spinner />
</div> </div>
: :
( childFacetsObject[facetId] && childFacetsObject[facetId].visible ? ( childFacetsObject[facetId] && childFacetsObject[facetId].visible ?
<ul class="child-term-facets"> <ul className="child-term-facets">
{ {
childFacetsObject[facetId].facets.length ? childFacetsObject[facetId].facets.length ?
childFacetsObject[facetId].facets.map((aChildTermFacet) => { childFacetsObject[facetId].facets.map((aChildTermFacet) => {
return prepareFacet(aChildTermFacet); return prepareFacet(aChildTermFacet);
}) })
: :
<p class="no-child-facet-found">{ __( 'The child terms of this facet do not contain items.', 'tainacan' )}</p> <p className="no-child-facet-found">{ __( 'The child terms of this facet do not contain items.', 'tainacan' )}</p>
} }
</ul> </ul>
: null ) : null )
@ -790,14 +790,14 @@ export default function({ attributes, setAttributes, isSelected, clientId }) {
{ {
showSearchBar ? showSearchBar ?
<div class="facets-search-bar"> <div className="facets-search-bar">
<Button <Button
onClick={ () => { setContent(); }} onClick={ () => { setContent(); }}
label={__('Search', 'tainacan')}> label={__('Search', 'tainacan')}>
<span class="icon"> <span className="icon">
<i> <i>
<svg width="24" height="24" viewBox="-2 -4 20 20"> <svg width="24" height="24" viewBox="-2 -4 20 20">
<path class="st0" d="M0,5.8C0,5,0.2,4.2,0.5,3.5s0.7-1.3,1.2-1.8s1.1-0.9,1.8-1.2C4.2,0.1,5,0,5.8,0S7.3,0.1,8,0.5 <path className="st0" d="M0,5.8C0,5,0.2,4.2,0.5,3.5s0.7-1.3,1.2-1.8s1.1-0.9,1.8-1.2C4.2,0.1,5,0,5.8,0S7.3,0.1,8,0.5
c0.7,0.3,1.3,0.7,1.8,1.2s0.9,1.1,1.2,1.8c0.5,1.2,0.5,2.5,0.2,3.7c0,0.2-0.1,0.4-0.2,0.6c0,0.1-0.2,0.6-0.2,0.6 c0.7,0.3,1.3,0.7,1.8,1.2s0.9,1.1,1.2,1.8c0.5,1.2,0.5,2.5,0.2,3.7c0,0.2-0.1,0.4-0.2,0.6c0,0.1-0.2,0.6-0.2,0.6
c0.6,0.6,1.3,1.3,1.9,1.9c0.7,0.7,1.3,1.3,2,2c0,0,0.3,0.2,0.3,0.3c0,0.3-0.1,0.7-0.3,1c-0.2,0.6-0.8,1-1.4,1.2 c0.6,0.6,1.3,1.3,1.9,1.9c0.7,0.7,1.3,1.3,2,2c0,0,0.3,0.2,0.3,0.3c0,0.3-0.1,0.7-0.3,1c-0.2,0.6-0.8,1-1.4,1.2
c-0.1,0-0.6,0.2-0.6,0.1c0,0-4.2-4.2-4.2-4.2c0,0-0.8,0.3-0.8,0.4c-1.3,0.4-2.8,0.5-4.1-0.1c-0.7-0.3-1.3-0.7-1.8-1.2 c-0.1,0-0.6,0.2-0.6,0.1c0,0-4.2-4.2-4.2-4.2c0,0-0.8,0.3-0.8,0.4c-1.3,0.4-2.8,0.5-4.1-0.1c-0.7-0.3-1.3-0.7-1.8-1.2
@ -866,7 +866,7 @@ export default function({ attributes, setAttributes, isSelected, clientId }) {
} }
{ isLoading ? { isLoading ?
<div class="spinner-container"> <div className="spinner-container">
<Spinner /> <Spinner />
</div> : </div> :
<div> <div>
@ -901,10 +901,10 @@ export default function({ attributes, setAttributes, isSelected, clientId }) {
{ showLoadMore && facets.length > 0 && !isLoading ? { showLoadMore && facets.length > 0 && !isLoading ?
<button <button
class="show-more-button" className="show-more-button"
disabled disabled
label={__('Show more', 'tainacan')}> label={__('Show more', 'tainacan')}>
<span class="icon"> <span className="icon">
<i> <i>
<svg <svg
width="24" width="24"

4
src/views/gutenberg-blocks/blocks/facets-list/metadata-modal.js
View File

@ -364,7 +364,7 @@ export default class MetadataModal extends React.Component {
<div> <div>
<div className="modal-radio-list"> <div className="modal-radio-list">
<p class="modal-radio-area-label">{__('Repository', 'tainacan')}</p> <p className="modal-radio-area-label">{__('Repository', 'tainacan')}</p>
<RadioControl <RadioControl
className={'repository-radio-option'} className={'repository-radio-option'}
selected={ this.state.temporaryCollectionId } selected={ this.state.temporaryCollectionId }
@ -373,7 +373,7 @@ export default class MetadataModal extends React.Component {
this.setState({ temporaryCollectionId: aCollectionId }); this.setState({ temporaryCollectionId: aCollectionId });
} } /> } } />
<hr/> <hr/>
<p class="modal-radio-area-label">{__('Collections', 'tainacan')}</p> <p className="modal-radio-area-label">{__('Collections', 'tainacan')}</p>
<RadioControl <RadioControl
selected={ this.state.temporaryCollectionId } selected={ this.state.temporaryCollectionId }
options={ options={

4
src/views/gutenberg-blocks/blocks/facets-list/parent-term-modal.js
View File

@ -215,7 +215,7 @@ export default class ParentTermModal extends React.Component {
<div> <div>
<div className="modal-radio-list"> <div className="modal-radio-list">
<p class="modal-radio-area-label">{__('Non specific term', 'tainacan')}</p> <p className="modal-radio-area-label">{__('Non specific term', 'tainacan')}</p>
<RadioControl <RadioControl
className={'repository-radio-option'} className={'repository-radio-option'}
selected={ this.state.temporaryFacetId != null ? this.state.temporaryFacetId : ''} selected={ this.state.temporaryFacetId != null ? this.state.temporaryFacetId : ''}
@ -227,7 +227,7 @@ export default class ParentTermModal extends React.Component {
this.setState({ temporaryFacetId: aFacetId}); this.setState({ temporaryFacetId: aFacetId});
} } /> } } />
<hr/> <hr/>
<p class="modal-radio-area-label">{__('Terms', 'tainacan')}</p> <p className="modal-radio-area-label">{__('Terms', 'tainacan')}</p>
<RadioControl <RadioControl
selected={ this.state.temporaryFacetId } selected={ this.state.temporaryFacetId }
options={ options={

2
src/views/gutenberg-blocks/blocks/item-gallery/edit.js
View File

@ -383,7 +383,7 @@ export default function ({ attributes, setAttributes, isSelected, clientId }) {
{ itemId || templateMode ? ( { itemId || templateMode ? (
<div className={ 'item-gallery-edit-container' }> <div className={ 'item-gallery-edit-container' }>
<div class="preview-warning">{__('Warning: this is just a demonstration. To see the gallery in action, either preview or publish your post.', 'tainacan') }</div> <div className="preview-warning">{__('Warning: this is just a demonstration. To see the gallery in action, either preview or publish your post.', 'tainacan') }</div>
<ServerSideRender <ServerSideRender
block="tainacan/item-gallery" block="tainacan/item-gallery"
attributes={ attributes } attributes={ attributes }

6
src/views/gutenberg-blocks/blocks/item-gallery/theme.js
View File

@ -282,13 +282,13 @@ tainacan_plugin.classes.TainacanMediaGallery = class TainacanMediaGallery {
(item.title.description && !self.options.hide_media_description) (item.title.description && !self.options.hide_media_description)
) )
) { ) {
innerHTML += '<div class="pswp__caption-inner">'; innerHTML += '<div className="pswp__caption-inner">';
if (item.title.caption && !self.options.hide_media_caption) if (item.title.caption && !self.options.hide_media_caption)
innerHTML += '<span class="pswp__figure_caption">' + item.title.caption.innerHTML + '</span>'; innerHTML += '<span className="pswp__figure_caption">' + item.title.caption.innerHTML + '</span>';
if (item.title.description && !self.options.hide_media_description) if (item.title.description && !self.options.hide_media_description)
innerHTML += '<span class="pswp__description">' + item.title.description.innerHTML + '</span>'; innerHTML += '<span className="pswp__description">' + item.title.description.innerHTML + '</span>';
innerHTML += '</div>'; innerHTML += '</div>';
} }

2
src/views/gutenberg-blocks/blocks/item-metadata-section/edit.js
View File

@ -263,7 +263,7 @@ export default function ({ attributes, setAttributes, isSelected }) {
} }
{ isLoading ? { isLoading ?
<div class="spinner-container"> <div className="spinner-container">
<Spinner /> <Spinner />
</div> : </div> :
<div className={ 'item-metadata-sections-edit-container' }> <div className={ 'item-metadata-sections-edit-container' }>

6
src/views/gutenberg-blocks/blocks/item-metadata-section/icon.js
View File

@ -6,9 +6,9 @@
viewBox="0 0 6 6" viewBox="0 0 6 6"
height="24px" height="24px"
width="24px"> width="24px">
<Path d="m1.2849 0.84891c-0.085556 0-0.15764 0.029712-0.21631 0.088379-0.058667 0.058667-0.087891 0.13075-0.087891 0.21631v0.76611c0 0.083111 0.030686 0.1552 0.091797 0.21631l1.0669 1.0669c0.026889 0.026889 0.058548 0.049295 0.095215 0.066406 0.039111 0.017111 0.079538 0.025391 0.12109 0.025391 0.041556 0 0.080521-0.00828 0.11719-0.025391 0.039111-0.017111 0.072232-0.039518 0.099121-0.066406l0.7627-0.7627c0.058667-0.058667 0.087891-0.13075 0.087891-0.21631 0-0.085556-0.029224-0.15764-0.087891-0.21631l-1.0708-1.0703c-0.058667-0.058667-0.12929-0.088379-0.2124-0.088379zm0.21924 0.30469c0.00391-1.815e-4 0.00775 0 0.011719 0 0.063556 0 0.11762 0.022891 0.16162 0.069336 0.044 0.044 0.065918 0.098066 0.065918 0.16162 0 0.063556-0.021918 0.11713-0.065918 0.16113s-0.098066 0.065918-0.16162 0.065918c-0.063555 0-0.11859-0.021918-0.16504-0.065918-0.044-0.044-0.065918-0.097577-0.065918-0.16113 0-0.063556 0.021918-0.11762 0.065918-0.16162 0.043542-0.043542 0.09474-0.066615 0.15332-0.069336z" stroke-width=".25"/> <Path d="m1.2849 0.84891c-0.085556 0-0.15764 0.029712-0.21631 0.088379-0.058667 0.058667-0.087891 0.13075-0.087891 0.21631v0.76611c0 0.083111 0.030686 0.1552 0.091797 0.21631l1.0669 1.0669c0.026889 0.026889 0.058548 0.049295 0.095215 0.066406 0.039111 0.017111 0.079538 0.025391 0.12109 0.025391 0.041556 0 0.080521-0.00828 0.11719-0.025391 0.039111-0.017111 0.072232-0.039518 0.099121-0.066406l0.7627-0.7627c0.058667-0.058667 0.087891-0.13075 0.087891-0.21631 0-0.085556-0.029224-0.15764-0.087891-0.21631l-1.0708-1.0703c-0.058667-0.058667-0.12929-0.088379-0.2124-0.088379zm0.21924 0.30469c0.00391-1.815e-4 0.00775 0 0.011719 0 0.063556 0 0.11762 0.022891 0.16162 0.069336 0.044 0.044 0.065918 0.098066 0.065918 0.16162 0 0.063556-0.021918 0.11713-0.065918 0.16113s-0.098066 0.065918-0.16162 0.065918c-0.063555 0-0.11859-0.021918-0.16504-0.065918-0.044-0.044-0.065918-0.097577-0.065918-0.16113 0-0.063556 0.021918-0.11762 0.065918-0.16162 0.043542-0.043542 0.09474-0.066615 0.15332-0.069336z" strokeWidth=".25"/>
<Path d="m0.98355 3.7638v0.37834h4.0357v-0.37834z" stroke-width=".25223"/> <Path d="m0.98355 3.7638v0.37834h4.0357v-0.37834z" strokeWidth=".25223"/>
<Path d="m0.98355 5.1511h2.2701v-0.37836h-2.2701z" stroke-width=".25223"/> <Path d="m0.98355 5.1511h2.2701v-0.37836h-2.2701z" strokeWidth=".25223"/>
</SVG> </SVG>
); );

2
src/views/gutenberg-blocks/blocks/item-metadata-sections/edit.js
View File

@ -218,7 +218,7 @@ export default function ({ attributes, setAttributes, isSelected }) {
} }
{ isLoading ? { isLoading ?
<div class="spinner-container"> <div className="spinner-container">
<Spinner /> <Spinner />
</div> : </div> :
<div className={ 'item-metadata-sections-edit-container' }> <div className={ 'item-metadata-sections-edit-container' }>

8
src/views/gutenberg-blocks/blocks/item-metadata-sections/icon.js
View File

@ -6,10 +6,10 @@
viewBox="0 0 6 6" viewBox="0 0 6 6"
height="24px" height="24px"
width="24px"> width="24px">
<Path d="m1.2849 0.84891c-0.085556 0-0.15764 0.029712-0.21631 0.088379-0.058667 0.058667-0.087891 0.13075-0.087891 0.21631v0.76611c0 0.083111 0.030686 0.1552 0.091797 0.21631l1.0669 1.0669c0.026889 0.026889 0.058548 0.049295 0.095215 0.066406 0.039111 0.017111 0.079538 0.025391 0.12109 0.025391 0.041556 0 0.080521-0.00828 0.11719-0.025391 0.039111-0.017111 0.072232-0.039518 0.099121-0.066406l0.7627-0.7627c0.058667-0.058667 0.087891-0.13075 0.087891-0.21631 0-0.085556-0.029224-0.15764-0.087891-0.21631l-1.0708-1.0703c-0.058667-0.058667-0.12929-0.088379-0.2124-0.088379zm0.21924 0.30469c0.00391-1.815e-4 0.00775 0 0.011719 0 0.063556 0 0.11762 0.022891 0.16162 0.069336 0.044 0.044 0.065918 0.098066 0.065918 0.16162 0 0.063556-0.021918 0.11713-0.065918 0.16113s-0.098066 0.065918-0.16162 0.065918c-0.063555 0-0.11859-0.021918-0.16504-0.065918-0.044-0.044-0.065918-0.097577-0.065918-0.16113 0-0.063556 0.021918-0.11762 0.065918-0.16162 0.043542-0.043542 0.09474-0.066615 0.15332-0.069336z" stroke-width=".25"/> <Path d="m1.2849 0.84891c-0.085556 0-0.15764 0.029712-0.21631 0.088379-0.058667 0.058667-0.087891 0.13075-0.087891 0.21631v0.76611c0 0.083111 0.030686 0.1552 0.091797 0.21631l1.0669 1.0669c0.026889 0.026889 0.058548 0.049295 0.095215 0.066406 0.039111 0.017111 0.079538 0.025391 0.12109 0.025391 0.041556 0 0.080521-0.00828 0.11719-0.025391 0.039111-0.017111 0.072232-0.039518 0.099121-0.066406l0.7627-0.7627c0.058667-0.058667 0.087891-0.13075 0.087891-0.21631 0-0.085556-0.029224-0.15764-0.087891-0.21631l-1.0708-1.0703c-0.058667-0.058667-0.12929-0.088379-0.2124-0.088379zm0.21924 0.30469c0.00391-1.815e-4 0.00775 0 0.011719 0 0.063556 0 0.11762 0.022891 0.16162 0.069336 0.044 0.044 0.065918 0.098066 0.065918 0.16162 0 0.063556-0.021918 0.11713-0.065918 0.16113s-0.098066 0.065918-0.16162 0.065918c-0.063555 0-0.11859-0.021918-0.16504-0.065918-0.044-0.044-0.065918-0.097577-0.065918-0.16113 0-0.063556 0.021918-0.11762 0.065918-0.16162 0.043542-0.043542 0.09474-0.066615 0.15332-0.069336z" strokeWidth=".25"/>
<Path d="m2.7444 1.1095 0.17272-0.099996s0.031904-0.0143 0.085176-0.010025c0.046428 0.003726 0.072053 0.029979 0.072053 0.029979l0.97841 0.97841c0.061111 0.061111 0.091667 0.13322 0.091667 0.21633 0 0.085553-0.029333 0.15766-0.088 0.21633l-0.73575 0.73575s-0.033678 0.042018-0.088029 0.047173c-0.063189 0.00599-0.098573-0.020678-0.098573-0.020678l-0.16231-0.094919 0.87267-0.88367z" stroke-width=".25"/> <Path d="m2.7444 1.1095 0.17272-0.099996s0.031904-0.0143 0.085176-0.010025c0.046428 0.003726 0.072053 0.029979 0.072053 0.029979l0.97841 0.97841c0.061111 0.061111 0.091667 0.13322 0.091667 0.21633 0 0.085553-0.029333 0.15766-0.088 0.21633l-0.73575 0.73575s-0.033678 0.042018-0.088029 0.047173c-0.063189 0.00599-0.098573-0.020678-0.098573-0.020678l-0.16231-0.094919 0.87267-0.88367z" strokeWidth=".25"/>
<Path d="m0.98355 3.7638v0.37834h4.0357v-0.37834z" stroke-width=".25223"/> <Path d="m0.98355 3.7638v0.37834h4.0357v-0.37834z" strokeWidth=".25223"/>
<Path d="m0.98355 5.1511h2.2701v-0.37836h-2.2701z" stroke-width=".25223"/> <Path d="m0.98355 5.1511h2.2701v-0.37836h-2.2701z" strokeWidth=".25223"/>
</SVG> </SVG>
); );

2
src/views/gutenberg-blocks/blocks/item-metadata/edit.js
View File

@ -293,7 +293,7 @@ export default function ({ attributes, setAttributes, isSelected }) {
} }
{ isLoading ? { isLoading ?
<div class="spinner-container"> <div className="spinner-container">
<Spinner /> <Spinner />
</div> : </div> :
<div className={ 'item-metadata-edit-container' }> <div className={ 'item-metadata-edit-container' }>

86
src/views/gutenberg-blocks/blocks/item-submission-form/edit.js
View File

@ -589,7 +589,7 @@ export default function ({ attributes, setAttributes }) {
) : ( ) : (
<div style={{ fontSize: (baseFontSize - 2) + 'px' }}> <div style={{ fontSize: (baseFontSize - 2) + 'px' }}>
<div class="preview-warning"> <div className="preview-warning">
{ __('Warning: this is just a demonstration. To see the submission form, either preview or publish your post.', 'tainacan') } { __('Warning: this is just a demonstration. To see the submission form, either preview or publish your post.', 'tainacan') }
</div> </div>
<div <div
@ -603,7 +603,7 @@ export default function ({ attributes, setAttributes }) {
'--tainacan-primary': primaryColor, '--tainacan-primary': primaryColor,
'--tainacan-secondary': secondaryColor '--tainacan-secondary': secondaryColor
}} }}
class="item-submission-form-placeholder"> className="item-submission-form-placeholder">
<div> <div>
{ {
@ -612,25 +612,25 @@ export default function ({ attributes, setAttributes }) {
<div> <div>
{ documentSectionLabel ? { documentSectionLabel ?
<span> <span>
<span style={{ display: 'flex', alignItems: 'baseline', marginBottom: '5px' }}><span class="fake-text section-label"></span>{ !hideHelpButtons && !helpInfoBellowLabel ? <span class="fake-text fake-help-button"></span> : null }</span> <span style={{ display: 'flex', alignItems: 'baseline', marginBottom: '5px' }}><span className="fake-text section-label"></span>{ !hideHelpButtons && !helpInfoBellowLabel ? <span className="fake-text fake-help-button"></span> : null }</span>
{ (!hideHelpButtons && helpInfoBellowLabel) ? <div><span class="fake-text fake-text-help-description"></span></div> : null } { (!hideHelpButtons && helpInfoBellowLabel) ? <div><span className="fake-text fake-text-help-description"></span></div> : null }
</span> </span>
: null } : null }
{ [ hideFileModalButton, hideTextModalButton, hideLinkModalButton ].filter((option) => { return option == false }).length > 1 ? { [ hideFileModalButton, hideTextModalButton, hideLinkModalButton ].filter((option) => { return option == false }).length > 1 ?
<div class="documents-section"> <div className="documents-section">
{ hideFileModalButton ? null : <span class="fake-circle"><span class="fake-icon"></span></span> } { hideFileModalButton ? null : <span className="fake-circle"><span className="fake-icon"></span></span> }
{ hideTextModalButton ? null : <span class="fake-circle"><span class="fake-icon"></span></span> } { hideTextModalButton ? null : <span className="fake-circle"><span className="fake-icon"></span></span> }
{ hideLinkModalButton ? null : <span class="fake-circle"><span class="fake-icon"></span></span> } { hideLinkModalButton ? null : <span className="fake-circle"><span className="fake-icon"></span></span> }
</div> </div>
: ( : (
(!hideFileModalButton && hideTextModalButton && hideLinkModalButton) ? (!hideFileModalButton && hideTextModalButton && hideLinkModalButton) ?
<div class="fake-image-uploader"></div> <div className="fake-image-uploader"></div>
: ( : (
(hideFileModalButton && !hideTextModalButton && hideLinkModalButton) ? (hideFileModalButton && !hideTextModalButton && hideLinkModalButton) ?
<span class="fake-textarea"></span> <span className="fake-textarea"></span>
: ( : (
(hideFileModalButton && hideTextModalButton && !hideLinkModalButton) ? (hideFileModalButton && hideTextModalButton && !hideLinkModalButton) ?
<span class="fake-input" style={{ width: '100%' }}></span> <span className="fake-input" style={{ width: '100%' }}></span>
: null : null
) )
) )
@ -643,11 +643,11 @@ export default function ({ attributes, setAttributes }) {
<div style={{ display: 'flex', flexDirection: 'column' }}> <div style={{ display: 'flex', flexDirection: 'column' }}>
{ !thumbnailSectionLabel ? { !thumbnailSectionLabel ?
<span> <span>
<span style={{ display: 'flex', alignItems: 'baseline' }}><span class="fake-text section-label"></span>{ !hideHelpButtons && !helpInfoBellowLabel ? <span class="fake-text fake-help-button"></span> : null }</span> <span style={{ display: 'flex', alignItems: 'baseline' }}><span className="fake-text section-label"></span>{ !hideHelpButtons && !helpInfoBellowLabel ? <span className="fake-text fake-help-button"></span> : null }</span>
{ (!hideHelpButtons && helpInfoBellowLabel) ? <div><span class="fake-text fake-text-help-description"></span></div> : null } { (!hideHelpButtons && helpInfoBellowLabel) ? <div><span className="fake-text fake-text-help-description"></span></div> : null }
</span> </span>
: null } : null }
<div class="fake-switch"><span class="fake-icon"></span><span class="fake-text"></span></div> <div className="fake-switch"><span className="fake-icon"></span><span className="fake-text"></span></div>
</div> </div>
) : null ) : null
} }
@ -657,12 +657,12 @@ export default function ({ attributes, setAttributes }) {
{ !attachmentsSectionLabel ? { !attachmentsSectionLabel ?
<span <span
style={{ position: 'relative' }} style={{ position: 'relative' }}
class="fake-text section-label"> className="fake-text section-label">
<div class="fake-tooltip"><div class="fake-link"></div></div> <div className="fake-tooltip"><div className="fake-link"></div></div>
</span> </span>
: null } : null }
<div class="attachments-section"> <div className="attachments-section">
<div class="fake-image-uploader"></div> <div className="fake-image-uploader"></div>
</div> </div>
</div> </div>
) : null ) : null
@ -671,45 +671,45 @@ export default function ({ attributes, setAttributes }) {
showAllowCommentsSection ? showAllowCommentsSection ?
( (
<div> <div>
<span style={{ display: 'flex', alignItems: 'baseline' }}><span class="fake-text section-label"></span>{ !hideHelpButtons && !helpInfoBellowLabel ? <span class="fake-text fake-help-button"></span> : null }</span> <span style={{ display: 'flex', alignItems: 'baseline' }}><span className="fake-text section-label"></span>{ !hideHelpButtons && !helpInfoBellowLabel ? <span className="fake-text fake-help-button"></span> : null }</span>
{ (!hideHelpButtons && helpInfoBellowLabel) ? <div><span class="fake-text fake-text-help-description"></span></div> : null } { (!hideHelpButtons && helpInfoBellowLabel) ? <div><span className="fake-text fake-text-help-description"></span></div> : null }
<div class="fake-switch"><span class="fake-icon"></span><span class="fake-text"></span></div> <div className="fake-switch"><span className="fake-icon"></span><span className="fake-text"></span></div>
</div> </div>
) : null } ) : null }
</div> </div>
<div style={{ flexGrow: '1' }}> <div style={{ flexGrow: '1' }}>
{ metadataSectionLabel ? { metadataSectionLabel ?
<div class="fake-text section-label"></div> <div className="fake-text section-label"></div>
: null } : null }
{ !hideCollapses && !isLayoutSteps ? { !hideCollapses && !isLayoutSteps ?
<div class="fake-link"></div> <div className="fake-link"></div>
: null } : null }
{ isLayoutSteps ? { isLayoutSteps ?
<div class="fake-steps"> <div className="fake-steps">
<div class="fake-step"/> <div className="fake-step"/>
<div class="fake-step"/> <div className="fake-step"/>
<div class="fake-step"/> <div className="fake-step"/>
</div> </div>
: null } : null }
<div class="metadata-section"> <div className="metadata-section">
{ enabledMetadata.length ? { enabledMetadata.length ?
enabledMetadata.map( (isEnabled) => { enabledMetadata.map( (isEnabled) => {
return isEnabled ? return isEnabled ?
<div class={ 'fake-metadata' + (!hideCollapses ? ' has-collapse' : '') }> <div className={ 'fake-metadata' + (!hideCollapses ? ' has-collapse' : '') }>
{ !hideCollapses ? <span class="fake-collapse-arrow"></span> : null } { !hideCollapses ? <span className="fake-collapse-arrow"></span> : null }
<span style={{ lineHeight: '0em' }}> <span style={{ lineHeight: '0em' }}>
<span class="fake-text"></span>{ !hideMetadataTypes ? <span class="fake-text fake-text-info"></span> : null }{ !hideHelpButtons && !helpInfoBellowLabel ? <span class="fake-text fake-help-button"></span> : null } <span className="fake-text"></span>{ !hideMetadataTypes ? <span className="fake-text fake-text-info"></span> : null }{ !hideHelpButtons && !helpInfoBellowLabel ? <span className="fake-text fake-help-button"></span> : null }
{ (!hideHelpButtons && helpInfoBellowLabel) ? <div><span class="fake-text fake-text-help-description"></span></div> : null } { (!hideHelpButtons && helpInfoBellowLabel) ? <div><span className="fake-text fake-text-help-description"></span></div> : null }
</span> </span>
<span class="fake-input"></span> <span className="fake-input"></span>
</div> </div>
: null : null
}) : }) :
Array(12).fill().map( () => { Array(12).fill().map( () => {
return <div class={ 'fake-metadata' + (!hideCollapses ? ' has-collapse' : '') }> return <div className={ 'fake-metadata' + (!hideCollapses ? ' has-collapse' : '') }>
{ !hideCollapses ? <span class="fake-collapse-arrow"></span> : null } { !hideCollapses ? <span className="fake-collapse-arrow"></span> : null }
<span class="fake-text"></span> <span className="fake-text"></span>
<span class="fake-input"></span> <span className="fake-input"></span>
</div> </div>
}) })
} }
@ -717,8 +717,8 @@ export default function ({ attributes, setAttributes }) {
</div> </div>
{ showTermsAgreementCheckbox ? { showTermsAgreementCheckbox ?
<div class="fake-checkbox-confirmation"> <div className="fake-checkbox-confirmation">
<span class="fake-checkbox"></span> <span className="fake-checkbox"></span>
<RichText <RichText
{ ...blockProps } { ...blockProps }
tagName="p" tagName="p"
@ -730,10 +730,10 @@ export default function ({ attributes, setAttributes }) {
: null : null
} }
<div class="form-footer"> <div className="form-footer">
<span class="fake-button outline"><span class="fake-text"></span></span> <span className="fake-button outline"><span className="fake-text"></span></span>
<span class="fake-text"></span> <span className="fake-text"></span>
<span class="fake-button"><span class="fake-text"></span></span> <span className="fake-button"><span className="fake-text"></span></span>
</div> </div>
</div> </div>
</div> </div>

2
src/views/gutenberg-blocks/blocks/items-list/items-modal.js
View File

@ -362,7 +362,7 @@ export default class ItemsModal extends React.Component {
} }
</div> </div>
</div> </div>
) : this.state.isLoadingCollections ? <div class="spinner-container"><Spinner /></div> : ) : this.state.isLoadingCollections ? <div className="spinner-container"><Spinner /></div> :
<div className="modal-loadmore-section"> <div className="modal-loadmore-section">
<p>{ __('Sorry, no collection found.', 'tainacan') }</p> <p>{ __('Sorry, no collection found.', 'tainacan') }</p>
</div> </div>

4
src/views/gutenberg-blocks/blocks/metadata-section-description/edit.js
View File

@ -1,5 +1,5 @@
const { __ } = wp.i18n; const { __ } = wp.i18n;
const { useEffect } = wp.element;
const { useBlockProps, BlockControls, AlignmentControl } = wp.blockEditor; const { useBlockProps, BlockControls, AlignmentControl } = wp.blockEditor;
export default function ({ attributes, setAttributes, context }) { export default function ({ attributes, setAttributes, context }) {
@ -24,8 +24,10 @@ export default function ({ attributes, setAttributes, context }) {
if (context['tainacan/metadataSectionDescription']) if (context['tainacan/metadataSectionDescription'])
sectionDescription = context['tainacan/metadataSectionDescription']; sectionDescription = context['tainacan/metadataSectionDescription'];
useEffect(() => {
if ( context['tainacan/metadataSectionId'] || context['tainacan/metadataSectionDescription'] ) if ( context['tainacan/metadataSectionId'] || context['tainacan/metadataSectionDescription'] )
setAttributes({ sectionId, sectionDescription }); setAttributes({ sectionId, sectionDescription });
}, [ context ]);
return <> return <>
<BlockControls group="block"> <BlockControls group="block">

2
src/views/gutenberg-blocks/blocks/metadata-section-description/icon.js
View File

@ -8,7 +8,7 @@
width="24px"> width="24px">
<Path d="m0.9834 3.7637v0.37842h1.8848v-0.37842h-1.8848zm2.1602 0v0.37842h1.8755v-0.37842h-1.8755z"/> <Path d="m0.9834 3.7637v0.37842h1.8848v-0.37842h-1.8848zm2.1602 0v0.37842h1.8755v-0.37842h-1.8755z"/>
<Path d="m0.9834 4.7729v0.37793h1.0845v-0.37793h-1.0845zm1.3599 0v0.37793h0.91016v-0.37793h-0.91016z"/> <Path d="m0.9834 4.7729v0.37793h1.0845v-0.37793h-1.0845zm1.3599 0v0.37793h0.91016v-0.37793h-0.91016z"/>
<G stroke-width=".25"> <G strokeWidth=".25">
<Path d="m2.3397 2.6393q0-0.13997-0.094401-0.22624-0.092773-0.086263-0.43131-0.19043-0.33691-0.10579-0.5485-0.26855-0.20996-0.16439-0.20996-0.44922 0-0.28646 0.23112-0.47038 0.23275-0.18555 0.60872-0.18555 0.40202 0 0.62825 0.21484 0.22624 0.21322 0.22624 0.50944h-0.41016q0-0.17415-0.10905-0.28483-0.10905-0.1123-0.34017-0.1123-0.21647 0-0.32064 0.094401-0.10254 0.092773-0.10254 0.23275 0 0.13346 0.1237 0.22135 0.1237 0.086263 0.37272 0.1595 0.40202 0.11719 0.59407 0.29297 0.19368 0.17578 0.19368 0.45898 0 0.29948-0.22949 0.47363-0.22786 0.17415-0.61361 0.17415-0.22786 0-0.44108-0.083008-0.21159-0.083008-0.34993-0.24902-0.13672-0.16602-0.13672-0.41667h0.41178q0 0.22461 0.14811 0.32389 0.14974 0.099284 0.36784 0.099284 0.21484 0 0.32227-0.087891 0.10905-0.08789 0.10905-0.23112z"/> <Path d="m2.3397 2.6393q0-0.13997-0.094401-0.22624-0.092773-0.086263-0.43131-0.19043-0.33691-0.10579-0.5485-0.26855-0.20996-0.16439-0.20996-0.44922 0-0.28646 0.23112-0.47038 0.23275-0.18555 0.60872-0.18555 0.40202 0 0.62825 0.21484 0.22624 0.21322 0.22624 0.50944h-0.41016q0-0.17415-0.10905-0.28483-0.10905-0.1123-0.34017-0.1123-0.21647 0-0.32064 0.094401-0.10254 0.092773-0.10254 0.23275 0 0.13346 0.1237 0.22135 0.1237 0.086263 0.37272 0.1595 0.40202 0.11719 0.59407 0.29297 0.19368 0.17578 0.19368 0.45898 0 0.29948-0.22949 0.47363-0.22786 0.17415-0.61361 0.17415-0.22786 0-0.44108-0.083008-0.21159-0.083008-0.34993-0.24902-0.13672-0.16602-0.13672-0.41667h0.41178q0 0.22461 0.14811 0.32389 0.14974 0.099284 0.36784 0.099284 0.21484 0 0.32227-0.087891 0.10905-0.08789 0.10905-0.23112z"/>
</G> </G>
</SVG> </SVG>

4
src/views/gutenberg-blocks/blocks/metadata-section-name/edit.js
View File

@ -1,6 +1,6 @@
const { __ } = wp.i18n; const { __ } = wp.i18n;
const { ToolbarDropdownMenu, SVG, Path, __experimentalHeading: Heading } = wp.components; const { ToolbarDropdownMenu, SVG, Path, __experimentalHeading: Heading } = wp.components;
const { useEffect } = wp.element;
const { useBlockProps, BlockControls, AlignmentControl } = wp.blockEditor; const { useBlockProps, BlockControls, AlignmentControl } = wp.blockEditor;
const levelToPath = { const levelToPath = {
@ -35,8 +35,10 @@ export default function ({ attributes, setAttributes, context }) {
if (context['tainacan/metadataSectionName']) if (context['tainacan/metadataSectionName'])
sectionName = context['tainacan/metadataSectionName']; sectionName = context['tainacan/metadataSectionName'];
useEffect(() => {
if ( context['tainacan/metadataSectionId'] || context['tainacan/metadataSectionName'] ) if ( context['tainacan/metadataSectionId'] || context['tainacan/metadataSectionName'] )
setAttributes({ sectionId, sectionName }); setAttributes({ sectionId, sectionName });
}, [ context ]);
return <> return <>

6
src/views/gutenberg-blocks/blocks/metadata-section-name/icon.js
View File

@ -6,9 +6,9 @@
viewBox="0 0 6 6" viewBox="0 0 6 6"
height="24px" height="24px"
width="24px"> width="24px">
<Path d="m0.98355 3.7638v0.37834h4.0357v-0.37834z" stroke-width=".25223"/> <Path d="m0.98355 3.7638v0.37834h4.0357v-0.37834z" strokeWidth=".25223"/>
<Path d="m0.98355 5.1511h2.2701v-0.37836h-2.2701z" stroke-width=".25223"/> <Path d="m0.98355 5.1511h2.2701v-0.37836h-2.2701z" strokeWidth=".25223"/>
<G stroke-width=".25"> <G strokeWidth=".25">
<Path d="m2.3397 2.6393q0-0.13997-0.094401-0.22624-0.092773-0.086263-0.43131-0.19043-0.33691-0.10579-0.5485-0.26855-0.20996-0.16439-0.20996-0.44922 0-0.28646 0.23112-0.47038 0.23275-0.18555 0.60872-0.18555 0.40202 0 0.62825 0.21484 0.22624 0.21322 0.22624 0.50944h-0.41016q0-0.17415-0.10905-0.28483-0.10905-0.1123-0.34017-0.1123-0.21647 0-0.32064 0.094401-0.10254 0.092773-0.10254 0.23275 0 0.13346 0.1237 0.22135 0.1237 0.086263 0.37272 0.1595 0.40202 0.11719 0.59407 0.29297 0.19368 0.17578 0.19368 0.45898 0 0.29948-0.22949 0.47363-0.22786 0.17415-0.61361 0.17415-0.22786 0-0.44108-0.083008-0.21159-0.083008-0.34993-0.24902-0.13672-0.16602-0.13672-0.41667h0.41178q0 0.22461 0.14811 0.32389 0.14974 0.099284 0.36784 0.099284 0.21484 0 0.32227-0.087891 0.10905-0.08789 0.10905-0.23112z"/> <Path d="m2.3397 2.6393q0-0.13997-0.094401-0.22624-0.092773-0.086263-0.43131-0.19043-0.33691-0.10579-0.5485-0.26855-0.20996-0.16439-0.20996-0.44922 0-0.28646 0.23112-0.47038 0.23275-0.18555 0.60872-0.18555 0.40202 0 0.62825 0.21484 0.22624 0.21322 0.22624 0.50944h-0.41016q0-0.17415-0.10905-0.28483-0.10905-0.1123-0.34017-0.1123-0.21647 0-0.32064 0.094401-0.10254 0.092773-0.10254 0.23275 0 0.13346 0.1237 0.22135 0.1237 0.086263 0.37272 0.1595 0.40202 0.11719 0.59407 0.29297 0.19368 0.17578 0.19368 0.45898 0 0.29948-0.22949 0.47363-0.22786 0.17415-0.61361 0.17415-0.22786 0-0.44108-0.083008-0.21159-0.083008-0.34993-0.24902-0.13672-0.16602-0.13672-0.41667h0.41178q0 0.22461 0.14811 0.32389 0.14974 0.099284 0.36784 0.099284 0.21484 0 0.32227-0.087891 0.10905-0.08789 0.10905-0.23112z"/>
</G> </G>
</SVG> </SVG>

2
src/views/gutenberg-blocks/blocks/related-items-list/edit.js
View File

@ -216,7 +216,7 @@ export default function ({ attributes, setAttributes, isSelected }) {
} }
{ isLoading ? { isLoading ?
<div class="spinner-container"> <div className="spinner-container">
<Spinner /> <Spinner />
</div> : </div> :
<div> <div>

36
src/views/gutenberg-blocks/blocks/search-bar/edit.js
View File

@ -57,16 +57,16 @@ export default function({ attributes, setAttributes, isSelected }) {
}}> }}>
<div <div
style={{ color: collectionTextColor ? collectionTextColor : '' }} style={{ color: collectionTextColor ? collectionTextColor : '' }}
class="search-bar-collection-header-title"> className="search-bar-collection-header-title">
{ showCollectionLabel ? <span class="label">{ __('Collection', 'tainacan') }</span> : null } { showCollectionLabel ? <span className="label">{ __('Collection', 'tainacan') }</span> : null }
<h3 <h3
class="has-text-color" className="has-text-color"
style={{ fontSize: collectionTextSize ? collectionTextSize + 'rem' : '2rem' }}> style={{ fontSize: collectionTextSize ? collectionTextSize + 'rem' : '2rem' }}>
{ collectionName ? collectionName : '' } { collectionName ? collectionName : '' }
</h3> </h3>
</div> </div>
{ collectionId && collectionSlug ? { collectionId && collectionSlug ?
<div class="tainacan-search-container"> <div className="tainacan-search-container">
<form <form
style={{ maxWidth: maxWidth ? maxWidth + '%' : '80%' }} style={{ maxWidth: maxWidth ? maxWidth + '%' : '80%' }}
className={ className={
@ -84,9 +84,9 @@ export default function({ attributes, setAttributes, isSelected }) {
placeholder={ placeholderText } placeholder={ placeholderText }
/> />
<button <button
class="button" className="button"
type="submit"> type="submit">
<span class="icon"> <span className="icon">
<i> <i>
<svg <svg
style={{ fill: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }} style={{ fill: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }}
@ -130,9 +130,9 @@ export default function({ attributes, setAttributes, isSelected }) {
placeholder={ placeholderText } placeholder={ placeholderText }
/> />
<button <button
class="button" className="button"
type="submit"> type="submit">
<span class="icon"> <span className="icon">
<i> <i>
<svg <svg
style={{ fill: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }} style={{ fill: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }}
@ -398,7 +398,7 @@ export default function({ attributes, setAttributes, isSelected }) {
alt="Tainacan Logo"/> alt="Tainacan Logo"/>
)}> )}>
<p> <p>
<span class="icon"> <span className="icon">
<i> <i>
<svg width="24" height="24" viewBox="-2 -2 20 20"> <svg width="24" height="24" viewBox="-2 -2 20 20">
<path d="M0,5.8C0,5,0.2,4.2,0.5,3.5s0.7-1.3,1.2-1.8s1.1-0.9,1.8-1.2C4.2,0.1,5,0,5.8,0S7.3,0.1,8,0.5 <path d="M0,5.8C0,5,0.2,4.2,0.5,3.5s0.7-1.3,1.2-1.8s1.1-0.9,1.8-1.2C4.2,0.1,5,0,5.8,0S7.3,0.1,8,0.5
@ -446,16 +446,16 @@ export default function({ attributes, setAttributes, isSelected }) {
}}> }}>
<div <div
style={{ color: collectionTextColor ? collectionTextColor : '' }} style={{ color: collectionTextColor ? collectionTextColor : '' }}
class="search-bar-collection-header-title"> className="search-bar-collection-header-title">
{ showCollectionLabel ? <span class="label">{ __('Collection', 'tainacan') }</span> : null } { showCollectionLabel ? <span className="label">{ __('Collection', 'tainacan') }</span> : null }
<h3 <h3
class="has-text-color" className="has-text-color"
style={{ fontSize: collectionTextSize ? collectionTextSize + 'rem' : '2rem' }}> style={{ fontSize: collectionTextSize ? collectionTextSize + 'rem' : '2rem' }}>
{ collectionName ? collectionName : '' } { collectionName ? collectionName : '' }
</h3> </h3>
</div> </div>
{ collectionId && collectionSlug ? { collectionId && collectionSlug ?
<div class="tainacan-search-container"> <div className="tainacan-search-container">
<div <div
style={{ maxWidth: maxWidth ? maxWidth + '%' : '80%' }} style={{ maxWidth: maxWidth ? maxWidth + '%' : '80%' }}
className={ className={
@ -471,9 +471,9 @@ export default function({ attributes, setAttributes, isSelected }) {
placeholder={ placeholderText } placeholder={ placeholderText }
/> />
<button <button
class="button" className="button"
onClick={(event) => { event.preventDefault(); return false; }}> onClick={(event) => { event.preventDefault(); return false; }}>
<span class="icon"> <span className="icon">
<i> <i>
<svg <svg
style={{ fill: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }} style={{ fill: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }}
@ -501,7 +501,7 @@ export default function({ attributes, setAttributes, isSelected }) {
} }
{ collectionId && collectionSlug && !showCollectionHeader ? { collectionId && collectionSlug && !showCollectionHeader ?
<div class="tainacan-search-container"> <div className="tainacan-search-container">
<div <div
style={{ maxWidth: maxWidth ? maxWidth + '%' : '80%' }} style={{ maxWidth: maxWidth ? maxWidth + '%' : '80%' }}
className={ className={
@ -517,8 +517,8 @@ export default function({ attributes, setAttributes, isSelected }) {
placeholder={ placeholderText } placeholder={ placeholderText }
/> />
<button <button
class="button"> className="button">
<span class="icon"> <span className="icon">
<i> <i>
<svg <svg
style={{ fill: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }} style={{ fill: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }}

4
src/views/gutenberg-blocks/blocks/search-bar/search-bar-modal.js
View File

@ -266,7 +266,7 @@ export default class SearchBarModal extends React.Component {
<div> <div>
<div className="modal-radio-list"> <div className="modal-radio-list">
<p class="modal-radio-area-label">{__('Repository', 'tainacan')}</p> <p className="modal-radio-area-label">{__('Repository', 'tainacan')}</p>
<RadioControl <RadioControl
className={'repository-radio-option'} className={'repository-radio-option'}
selected={ this.state.temporaryCollectionId } selected={ this.state.temporaryCollectionId }
@ -275,7 +275,7 @@ export default class SearchBarModal extends React.Component {
this.setState({ temporaryCollectionId: aCollectionId }); this.setState({ temporaryCollectionId: aCollectionId });
} } /> } } />
<hr/> <hr/>
<p class="modal-radio-area-label">{__('Collections', 'tainacan')}</p> <p className="modal-radio-area-label">{__('Collections', 'tainacan')}</p>
<RadioControl <RadioControl
selected={ this.state.temporaryCollectionId } selected={ this.state.temporaryCollectionId }
options={ options={

4
src/views/gutenberg-blocks/blocks/terms-list/edit.js
View File

@ -31,9 +31,9 @@ export default function({ attributes, setAttributes, isSelected }){
<button <button
onClick={ () => removeTermOfId(term.id) } onClick={ () => removeTermOfId(term.id) }
type="button" type="button"
class="components-button has-icon" className="components-button has-icon"
aria-label={__('Remove', 'tainacan')}> aria-label={__('Remove', 'tainacan')}>
<span class="dashicon dashicons dashicons-no-alt" /> <span className="dashicon dashicons dashicons-no-alt" />
</button> </button>
<a <a
id={ isNaN(term.id) ? term.id : 'term-id-' + term.id } id={ isNaN(term.id) ? term.id : 'term-id-' + term.id }

12
src/views/gutenberg-blocks/blocks/terms-list/terms-modal.js
View File

@ -377,10 +377,10 @@ export default class TermsModal extends React.Component {
) )
} }
</ul> </ul>
{ this.state.isLoadingTerms ? <div class="spinner-container"><Spinner /></div> : null } { this.state.isLoadingTerms ? <div className="spinner-container"><Spinner /></div> : null }
</div> </div>
) )
: this.state.isLoadingTerms ? <div class="spinner-container"><Spinner /></div> : : this.state.isLoadingTerms ? <div className="spinner-container"><Spinner /></div> :
<div className="modal-loadmore-section"> <div className="modal-loadmore-section">
<p>{ __('Sorry, no terms found.', 'tainacan') }</p> <p>{ __('Sorry, no terms found.', 'tainacan') }</p>
</div> </div>
@ -409,7 +409,7 @@ export default class TermsModal extends React.Component {
) )
} }
</ul> </ul>
{ this.state.isLoadingTerms ? <div class="spinner-container"><Spinner /></div> : null } { this.state.isLoadingTerms ? <div className="spinner-container"><Spinner /></div> : null }
<div className="modal-loadmore-section"> <div className="modal-loadmore-section">
<p>{ __('Showing', 'tainacan') + " " + this.state.modalTerms.length + " " + __('of', 'tainacan') + " " + this.state.totalModalTerms + " " + __('terms', 'tainacan') + "."}</p> <p>{ __('Showing', 'tainacan') + " " + this.state.modalTerms.length + " " + __('of', 'tainacan') + " " + this.state.totalModalTerms + " " + __('terms', 'tainacan') + "."}</p>
{ {
@ -424,7 +424,7 @@ export default class TermsModal extends React.Component {
} }
</div> </div>
</div> </div>
) : this.state.isLoadingTerms ? <div class="spinner-container"><Spinner /></div> : ) : this.state.isLoadingTerms ? <div className="spinner-container"><Spinner /></div> :
<div className="modal-loadmore-section"> <div className="modal-loadmore-section">
<p>{ __('Sorry, no terms found.', 'tainacan') }</p> <p>{ __('Sorry, no terms found.', 'tainacan') }</p>
</div> </div>
@ -507,7 +507,7 @@ export default class TermsModal extends React.Component {
</div> </div>
) : ) :
this.state.isLoadingTaxonomies ? ( this.state.isLoadingTaxonomies ? (
<div class="spinner-container"><Spinner /></div> <div className="spinner-container"><Spinner /></div>
) : ) :
<div className="modal-loadmore-section"> <div className="modal-loadmore-section">
<p>{ __('Sorry, no taxonomy found.', 'tainacan') }</p> <p>{ __('Sorry, no taxonomy found.', 'tainacan') }</p>
@ -544,7 +544,7 @@ export default class TermsModal extends React.Component {
} }
</div> </div>
</div> </div>
) : this.state.isLoadingTaxonomies ? <div class="spinner-container"><Spinner /></div> : ) : this.state.isLoadingTaxonomies ? <div className="spinner-container"><Spinner /></div> :
<div className="modal-loadmore-section"> <div className="modal-loadmore-section">
<p>{ __('Sorry, no taxonomy found.', 'tainacan') }</p> <p>{ __('Sorry, no taxonomy found.', 'tainacan') }</p>
</div> </div>