light-5 template better responsive on hover
authorLaury GvR <laury@gaslightmedia.com>
Fri, 8 Apr 2016 23:29:12 +0000 (19:29 -0400)
committerLaury GvR <laury@gaslightmedia.com>
Fri, 8 Apr 2016 23:29:12 +0000 (19:29 -0400)
css/app.css
scss/plugins/_nextgen.scss

index 9349802..0e47e38 100644 (file)
@@ -6929,6 +6929,9 @@ h2#block-title {
     -webkit-transition: border-radius 1s ease 0s;
     -moz-transition: border-radius 1s ease 0s;
     -o-transition: border-radius 1s ease 0s; }
+    @media only screen and (max-width: 40em) {
+      #gallery-glmphotos-light-3 .ngg-gallery-thumbnail .ngg-fancybox:hover img, #gallery-glmphotos-light-5 .ngg-gallery-thumbnail .ngg-fancybox:hover img {
+        border-radius: 15px; } }
   #gallery-glmphotos-light-3 .ngg-gallery-thumbnail .ngg-fancybox:hover .title, #gallery-glmphotos-light-5 .ngg-gallery-thumbnail .ngg-fancybox:hover .title {
     border-top-left-radius: 30px;
     border-top-right-radius: 30px;
@@ -6936,6 +6939,9 @@ h2#block-title {
     -webkit-transition: border-radius 1s ease 0s;
     -moz-transition: border-radius 1s ease 0s;
     -o-transition: border-radius 1s ease 0s; }
+    @media only screen and (max-width: 40em) {
+      #gallery-glmphotos-light-3 .ngg-gallery-thumbnail .ngg-fancybox:hover .title, #gallery-glmphotos-light-5 .ngg-gallery-thumbnail .ngg-fancybox:hover .title {
+        border-radius: 15px; } }
   #gallery-glmphotos-light-3 .ngg-gallery-thumbnail .ngg-fancybox .image_title, #gallery-glmphotos-light-5 .ngg-gallery-thumbnail .ngg-fancybox .image_title {
     display: table;
     height: auto;
@@ -6969,6 +6975,9 @@ h2#block-title {
     #gallery-glmphotos-light-3 .ngg-gallery-thumbnail .ngg-fancybox .image_title h5, #gallery-glmphotos-light-5 .ngg-gallery-thumbnail .ngg-fancybox .image_title h5 {
       height: 90px;
       width: 100%; }
+      @media only screen and (max-width: 40em) {
+        #gallery-glmphotos-light-3 .ngg-gallery-thumbnail .ngg-fancybox .image_title h5, #gallery-glmphotos-light-5 .ngg-gallery-thumbnail .ngg-fancybox .image_title h5 {
+          padding: 10px; } }
   #gallery-glmphotos-light-3 .ngg-gallery-thumbnail .ngg-fancybox .title, #gallery-glmphotos-light-5 .ngg-gallery-thumbnail .ngg-fancybox .title {
     color: #fff;
     background: rgba(0, 0, 0, 0.75);
@@ -6994,6 +7003,7 @@ h2#block-title {
 #gallery-glmphotos-light-3 ul li a, #gallery-glmphotos-light-5 ul li a {
   font-family: "Lato"; }
 #gallery-glmphotos-light-3 .photoTitle, #gallery-glmphotos-light-5 .photoTitle {
+  overflow: hidden;
   width: 90%;
   text-transform: capitalize;
   margin: 8px auto 0;
index 75ab29b..aa4c94a 100644 (file)
             img {
                 opacity: 0.75;
                 border-radius: 30px;
+                @media #{$small-only} {
+                    border-radius: 15px;    
+                }
                 transition: all 0.5s ease 0s;
                 transition: border-radius 1s ease 0s;
                 -webkit-transition: border-radius 1s ease 0s;
             .title   {
                 border-top-left-radius: 30px;
                 border-top-right-radius: 30px;
+                @media #{$small-only} {
+                    border-radius: 15px;
+                }
                 transition: border-radius 1s ease 0s;
                 -webkit-transition: border-radius 1s ease 0s;
                 -moz-transition: border-radius 1s ease 0s;
             h5 {
                 height:90px;
                 width:100%;
+                @media #{$small-only} {
+                    padding: 10px;
+                }
             }
         }
         .ngg-fancybox .title {
         font-family: "Lato";
     }
     .photoTitle {
+        overflow:hidden;
         width: 90%;
         text-transform: capitalize;
         margin: 8px auto 0;