From 45b30043ea30b5d8ca08c7224593647ab6bb7549 Mon Sep 17 00:00:00 2001
From: Laury GvR <laury@gaslightmedia.com>
Date: Wed, 29 Oct 2014 16:55:47 -0400
Subject: [PATCH] Fancybox work, gallery colors and style

---
 css/app.css                     | 42 ++++++++++++++++++++++--------
 nggallery/gallery-glmphotos.php |  7 +++--
 scss/site/_structure.scss       | 45 +++++++++++++++++++++++++--------
 3 files changed, 71 insertions(+), 23 deletions(-)

diff --git a/css/app.css b/css/app.css
index 76db214..a43c3bc 100644
--- a/css/app.css
+++ b/css/app.css
@@ -6056,22 +6056,28 @@ article h2 {
 .homepage_testimonials_text p {
   font-size: 16px; }
 
-.homepage_testimonials_rarrow {
-  padding: 5px;
-  min-width: 31px;
-  height: 100%;
-  background-image: url("../assets/img/images/arrowWhiteRight.png");
-  background-repeat: no-repeat;
-  background-position: center;
+.ngg-gallery-thumbnail .ngg-fancybox .image_overlay {
+  cursor: pointer;
   -webkit-transition: background 0.3s linear;
   -moz-transition: background 0.3s linear;
   -ms-transition: background 0.3s linear;
   -o-transition: background 0.3s linear;
-  transition: background 0.3s linear; }
+  transition: background 0.3s linear;
+  background-image: url("../assets/img/portfolio/pf_Hover.png");
+  background-repeat: no-repeat;
+  background-position: center; }
 
-.homepage_testimonials_rarrow:hover {
-  cursor: pointer;
-  background-color: rgba(0, 0, 0, 0.2); }
+.ngg-gallery-thumbnail .ngg-fancybox:hover img {
+  opacity: 0.5; }
+
+.ngg-fancybox .photoTitle {
+  color: white;
+  font-weight: bold; }
+
+.ngg-fancybox .photoHead {
+  color: white;
+  font-style: normal;
+  text-decoration: none; }
 
 #homepage_problem_solvers {
   text-align: center; }
@@ -6135,6 +6141,20 @@ article h2 {
   .top-bar-menu > li.has-dropdown > ul li ul li:last-child a {
     border-bottom-right-radius: 15px; }
 
+.ngg-gallery-thumbnail img:hover {
+  color: white; }
+
+#fancybox-title {
+  position: absolute;
+  top: 0;
+  padding-top: 10px;
+  padding-bottom: 5px; }
+  #fancybox-title #fancybox-title-inside {
+    padding: 2px 0; }
+
+#fancybox-outer, #fancybox-left, #fancybox-right {
+  padding-top: 40px; }
+
 /**
      * 4.2 Posts
      * ------------------------------------
diff --git a/nggallery/gallery-glmphotos.php b/nggallery/gallery-glmphotos.php
index b4f922b..cbd12ff 100644
--- a/nggallery/gallery-glmphotos.php
+++ b/nggallery/gallery-glmphotos.php
@@ -51,11 +51,14 @@ Follow variables are useable :
                 data-front-description="<?php echo nggcf_get_field($image->pid, "Front Description"); ?>"
                 <?php echo $image->thumbcode ?> >
                             <?php if ( !$image->hidden ) { ?>
+                        
+                        <div class="image_overlay">
                             <img title="<?php echo esc_attr($image->alttext) ?>" alt="<?php echo esc_attr($image->alttext) ?>" src="<?php echo nextgen_esc_url($image->thumbnailURL) ?>" <?php echo $image->size ?> />
-                            <?php } ?>
-                    </a>
+                        </div>
                     <span class="photoTitle"><?php if (!$image->hidden) { echo esc_attr($image->alttext); }?></span>
                     <span class="photoHead"><?php if (!$image->hidden) { echo nggcf_get_field($image->pid, "Front Description"); } ?></span>
+                            <?php } ?>
+                    </a>
                 </div>
                 
             </div>
diff --git a/scss/site/_structure.scss b/scss/site/_structure.scss
index d4a4e22..7386c42 100644
--- a/scss/site/_structure.scss
+++ b/scss/site/_structure.scss
@@ -552,23 +552,30 @@ article h2 {
     .homepage_testimonials_text p {
         font-size: 16px;
     }
-    .homepage_testimonials_rarrow {
-        padding: 5px;
-        min-width: 31px;
-        height: 100%;
-        background-image: url("../assets/img/images/arrowWhiteRight.png");
-        background-repeat: no-repeat;
-        background-position: center;
+    .ngg-gallery-thumbnail .ngg-fancybox .image_overlay {
+        
+        cursor: pointer;
         -webkit-transition: background 0.3s linear;
         -moz-transition: background 0.3s linear;
         -ms-transition: background 0.3s linear;
         -o-transition: background 0.3s linear;
         transition: background 0.3s linear;
+        background-image: url("../assets/img/portfolio/pf_Hover.png");
         
+        background-repeat: no-repeat;
+        background-position: center;
     }
-    .homepage_testimonials_rarrow:hover {
-        cursor: pointer;
-        background-color: rgba(0,0,0,0.2);
+    .ngg-gallery-thumbnail .ngg-fancybox:hover img {
+        opacity: 0.5;
+    }
+    .ngg-fancybox .photoTitle {
+        color: white;
+        font-weight: bold;
+    }
+    .ngg-fancybox .photoHead {
+        color: white;
+        font-style: normal;
+        text-decoration: none;
     }
     #homepage_problem_solvers {
         text-align:center;
@@ -640,6 +647,24 @@ article h2 {
             border-bottom-right-radius: 15px;
         }
     }
+    .ngg-gallery-thumbnail img:hover {
+        color: white;
+    }
+    
+    #fancybox-title {
+        position: absolute;
+        top: 0;
+        padding-top: 10px;
+        padding-bottom: 5px;
+        #fancybox-title-inside {
+            padding: 2px 0;
+        }
+    }
+    #fancybox-outer,
+    #fancybox-left,
+    #fancybox-right {
+        padding-top:40px;
+    }
 
     /**
      * 4.2 Posts
-- 
2.17.1