cleanup, disabled gallery content type, register view for folder, upd…

…ated bundle

src/operun/gallery/browser/configure.zcml

@@ -34,10 +34,10 @@
       />
 
   <browser:menuItem
-      for="Products.ATContentTypes.interface.IATFolder"
+      for="plone.app.contenttypes.interfaces.IFolder"
       menu="plone_displayviews"
       title="Gallery"
-      action="@@gallery_view"
+      action="gallery"
       description="Show folder contents as a gallery"
       />
 

src/operun/gallery/browser/static/gallery.js

@@ -16,14 +16,12 @@ require([
       opacity: 1
     }, 250);
   });
-  $(window).on("load resize", function() {
-    $(".gradient-overlay").css({
-      'height': ($(".gallery-image").height() + 'px')
-    });
-  });
+
   $('.gallery-image').hover(function() {
-      $(this).find('.title-container').fadeIn(100);
+      $(this).find('.gallery-image-title').fadeIn('fast');
     },
     function() {
-      $(".title-container").fadeOut(80);
-    });});
+      $(".gallery-image-title").fadeOut('fast');
+    });
+
+});

src/operun/gallery/browser/static/gallery.less

@@ -3,18 +3,20 @@
 
 /* Gallery variables */
 
-#gallery {
+#image-gallery {
   margin-bottom: 30px;
   padding: 0 15px 0 15px;
 }
 
+.gallery-image-wrapper {
+  padding: 15px;
+}
+
 .gallery-image {
   position: relative;
-  overflow: hidden;
   width: 100%;
   height: auto;
   opacity: 0;
-  border-radius: 2px;
 }
 
 .gallery-image img {
@@ -24,39 +26,18 @@
 
 /* Gradient variables */
 
-.title-container {
+.gallery-image-title {
+  width: 100%;
   position: absolute;
-  z-index: 1;
   bottom: 0;
   display: none;
-  width: 100%;
-  height: auto;
-}
-
-.image-title {
-  font-size: 1.2em;
-  font-weight: 300;
-  margin: 5px;
+  padding: 10px;
   color: #fff;
-}
-
-.gradient-overlay {
-  position: absolute;
-  z-index: -1;
-  bottom: 0;
-  width: 100%;
-  background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, .90) 100%);
-  background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, .90) 100%);
-  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, .90) 100%);
+  background-color: rgba(0, 0, 0, 0.5);
 }
 
 /* Overrides */
 
 .lightbox a:focus, .lightbox a:hover, .lightbox a:active {
   outline: none !important;
 }
-
-.noPadding {
-  margin: 0 !important;
-  padding: 2px !important; /* Change for larger tile gutter */
-}

src/operun/gallery/browser/templates/gallery.pt

@@ -14,16 +14,13 @@
                                       tal:content="structure python:context.text.output_relative_to(view.context)"
                                       tal:attributes="class python: toc and 'pat-autotoc' or ''" />
 
-      <div class="row" id="gallery" tal:define="images view/images" tal:condition="images">
-        <div class="col-xs-4 col-sm-3 noPadding" tal:repeat="image images">
+      <div class="row" id="image-gallery" tal:define="images view/images" tal:condition="images">
+        <div class="col-xs-4 col-sm-3 gallery-image-wrapper" tal:repeat="image images">
           <div class="gallery-image">
             <a href="" data-lightbox="" data-title="" tal:attributes="href image/url;
                                                                       data-lightbox context/id;
                                                                       data-title image/title">
-              <div class="title-container">
-                <div class="image-title" tal:content="image/title"></div>
-                <div class="gradient-overlay"></div>
-              </div>
+              <div class="gallery-image-title" tal:content="image/title"></div>
               <img tal:replace="structure image/image" />
             </a>
           </div>