diff --git a/css/gallery-rtl.css b/css/gallery-rtl.css new file mode 100644 index 000000000..c621ca7be --- /dev/null +++ b/css/gallery-rtl.css @@ -0,0 +1 @@ +.radio-select{align-items:center;background:none;border:none;cursor:pointer;display:flex;margin:12px 0}.radio-select:focus{color:#007cba;outline:none}.radio-select--active{color:#007cba}.radio-select--active g{fill:#007cba!important}.radio-select__label{font-size:14px;margin-left:7px}.loading-spinner-container{align-items:center;background-color:hsla(0,0%,100%,.8);display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%}.components-placeholder__fieldset{justify-content:start}.colorpalette-color-label{align-items:center;display:flex;margin:8px 0}.wp-block-cloudinary-gallery .block-editor-media-placeholder .components-placeholder__label .dashicon{margin-right:8px}.wp-block-cloudinary-gallery .block-editor-media-placeholder.is-appender .components-placeholder__label{display:none}.wp-block-cloudinary-gallery .block-editor-media-placeholder.is-appender{margin-bottom:11px;margin-top:11px;min-height:auto;padding:11px}.wp-block-cloudinary-gallery .block-editor-media-placeholder.is-appender .components-button{margin-bottom:0} \ No newline at end of file diff --git a/css/gallery.css b/css/gallery.css new file mode 100644 index 000000000..c621ca7be --- /dev/null +++ b/css/gallery.css @@ -0,0 +1 @@ +.radio-select{align-items:center;background:none;border:none;cursor:pointer;display:flex;margin:12px 0}.radio-select:focus{color:#007cba;outline:none}.radio-select--active{color:#007cba}.radio-select--active g{fill:#007cba!important}.radio-select__label{font-size:14px;margin-left:7px}.loading-spinner-container{align-items:center;background-color:hsla(0,0%,100%,.8);display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%}.components-placeholder__fieldset{justify-content:start}.colorpalette-color-label{align-items:center;display:flex;margin:8px 0}.wp-block-cloudinary-gallery .block-editor-media-placeholder .components-placeholder__label .dashicon{margin-right:8px}.wp-block-cloudinary-gallery .block-editor-media-placeholder.is-appender .components-placeholder__label{display:none}.wp-block-cloudinary-gallery .block-editor-media-placeholder.is-appender{margin-bottom:11px;margin-top:11px;min-height:auto;padding:11px}.wp-block-cloudinary-gallery .block-editor-media-placeholder.is-appender .components-button{margin-bottom:0} \ No newline at end of file diff --git a/js/gallery-rtl.css b/js/gallery-rtl.css new file mode 100644 index 000000000..17a5f61ac --- /dev/null +++ b/js/gallery-rtl.css @@ -0,0 +1 @@ +.radio-select{align-items:center;background:none;border:none;cursor:pointer;display:flex;margin:12px 0}.radio-select:focus{color:#007cba;outline:none}.radio-select--active{color:#007cba}.radio-select--active g{fill:#007cba!important}.radio-select__label{font-size:14px;margin-right:7px}.loading-spinner-container{align-items:center;background-color:hsla(0,0%,100%,.8);display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:100%}.components-placeholder__fieldset{justify-content:start}.colorpalette-color-label{align-items:center;display:flex;margin:8px 0}.wp-block-cloudinary-gallery .block-editor-media-placeholder .components-placeholder__label .dashicon{margin-left:8px}.wp-block-cloudinary-gallery .block-editor-media-placeholder.is-appender .components-placeholder__label{display:none}.wp-block-cloudinary-gallery .block-editor-media-placeholder.is-appender{margin-bottom:11px;margin-top:11px;min-height:auto;padding:11px}.wp-block-cloudinary-gallery .block-editor-media-placeholder.is-appender .components-button{margin-bottom:0} \ No newline at end of file diff --git a/js/gallery.asset.php b/js/gallery.asset.php index 7a344f4b1..75e92a8bb 100644 --- a/js/gallery.asset.php +++ b/js/gallery.asset.php @@ -1 +1 @@ - array('wp-block-editor', 'wp-components', 'wp-components/build-style/style.css', 'wp-data', 'wp-element', 'wp-i18n'), 'version' => '92c1913a2ab581c0270f'); + array('wp-block-editor', 'wp-components', 'wp-components/build-style/style.css', 'wp-data', 'wp-element', 'wp-i18n'), 'version' => 'e09fae43ef7020fbad7b'); diff --git a/js/gallery.css b/js/gallery.css new file mode 100644 index 000000000..c621ca7be --- /dev/null +++ b/js/gallery.css @@ -0,0 +1 @@ +.radio-select{align-items:center;background:none;border:none;cursor:pointer;display:flex;margin:12px 0}.radio-select:focus{color:#007cba;outline:none}.radio-select--active{color:#007cba}.radio-select--active g{fill:#007cba!important}.radio-select__label{font-size:14px;margin-left:7px}.loading-spinner-container{align-items:center;background-color:hsla(0,0%,100%,.8);display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%}.components-placeholder__fieldset{justify-content:start}.colorpalette-color-label{align-items:center;display:flex;margin:8px 0}.wp-block-cloudinary-gallery .block-editor-media-placeholder .components-placeholder__label .dashicon{margin-right:8px}.wp-block-cloudinary-gallery .block-editor-media-placeholder.is-appender .components-placeholder__label{display:none}.wp-block-cloudinary-gallery .block-editor-media-placeholder.is-appender{margin-bottom:11px;margin-top:11px;min-height:auto;padding:11px}.wp-block-cloudinary-gallery .block-editor-media-placeholder.is-appender .components-button{margin-bottom:0} \ No newline at end of file diff --git a/php/media/class-gallery.php b/php/media/class-gallery.php index f16d9a024..a706b2b1d 100644 --- a/php/media/class-gallery.php +++ b/php/media/class-gallery.php @@ -220,6 +220,17 @@ public function enqueue_admin_scripts() { $this->plugin->version ); + // Styles for the shared gallery controls (e.g. the Layout radio group) + // used by the settings page preview app. These live in `gallery.scss`, + // which is bundled with the `gallery` (settings) entry but is not + // auto-enqueued, so load it explicitly here. + wp_enqueue_style( + 'cloudinary-gallery-controls-css', + $this->plugin->dir_url . 'css/gallery.css', + array(), + $this->plugin->version + ); + $script = array( 'slug' => 'gallery_config', 'src' => $this->plugin->dir_url . 'js/gallery.js', diff --git a/src/js/components/settings-gallery.js b/src/js/components/settings-gallery.js index e6cb35fe1..ee889878e 100644 --- a/src/js/components/settings-gallery.js +++ b/src/js/components/settings-gallery.js @@ -13,6 +13,7 @@ import { createRoot, render, useEffect, useState } from '@wordpress/element'; /** * Internal dependencies */ +import '../../css/gallery.scss'; import GalleryControls from '../gallery-block/controls'; import { convertColors,