[FIX] website: fix an issue when changing width option in the gallery

As the container class now changes with the width option. We cannot use
this class in the js or css files anymore.

task-2162952

closes odoo/odoo#48377

X-original-commit: 1cf2ee35c2d85d87b27d5bd72c414e12fcbaf123
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>

2 files changed, 4 insertions, 4 deletions

diff --git a/addons/website/static/src/snippets/s_image_gallery/000.scss b/addons/website/static/src/snippets/s_image_gallery/000.scss
index dce08072f5d..90a0e3d99b6 100644
--- a/addons/website/static/src/snippets/s_image_gallery/000.scss
+++ b/addons/website/static/src/snippets/s_image_gallery/000.scss
@@ -92,7 +92,7 @@
         .carousel ul.carousel-indicators li {
             border: 1px solid #aaa;
         }
-        > .container {
+        > div:first-child {
             height: 100%;
         }
     }
diff --git a/addons/website/static/src/snippets/s_image_gallery/options.js b/addons/website/static/src/snippets/s_image_gallery/options.js
index ba46b697891..52fedd2c3a6 100644
--- a/addons/website/static/src/snippets/s_image_gallery/options.js
+++ b/addons/website/static/src/snippets/s_image_gallery/options.js
@@ -46,7 +46,7 @@ options.registry.gallery = options.Class.extend({
             }
         });
 
-        if (this.$('.container:first > *:not(div)').length) {
+        if (this.$('> div:first-child > *:not(div)').length) {
             self.mode(null, self.getMode());
         }
 
@@ -83,7 +83,7 @@ options.registry.gallery = options.Class.extend({
      * @see this.selectClass for parameters
      */
     addImages: function (previewMode) {
-        var $container = this.$('.container:first');
+        var $container = this.$('> div:first-child');
         var dialog = new weWidgets.MediaDialog(this, {multiImages: true, onlyImages: true, mediaWidth: 1920});
         var lastImage = _.last(this._getImages());
         var index = lastImage ? this._getIndex(lastImage) : -1;
@@ -429,7 +429,7 @@ options.registry.gallery = options.Class.extend({
      * @returns {jQuery} the main container of the snippet
      */
     _replaceContent: function ($content) {
-        var $container = this.$('.container:first');
+        var $container = this.$('> div:first-child');
         $container.empty().append($content);
         return $container;
     },