JSFiddle - React, Tailwind, and code Playground

by sambrace

HTML

<script type="text/javascript" src="https://product-gallery.cloudinary.com/product-gallery.js"></script>

<div id="wrap"></div>

<script>

      cloudinary.galleryWidget({
      container: '#wrap',
      cloudName: 'sambrace',
        mediaAssets: [{tag: "dress"}],
      //config  
      bgColor: '#EBEDEE',
      navigation: 'none',
      themeProps: {
        //shape: 'square',
        primary: '#000',
        onPrimary: '#FFF',
      },
      thumbnailProps: {
        width: 54,
        height: 54,
        spacing: 10,
        borderWidth: 1,
        selectedStyle: 'border',
        selectedBorderWidth: 2,
        selectedBorderPosition: 'bottom',
        mediaSymbolBgShape: 'none',
        mediaSymbolIconColor: '#FFF',
        mediaSymbolSize: 24,
        navigationShape: 'square',
        navigationSize: 24,
        navigationFloat: true,
      },
     
      ]
	}).render();
    
</script>