Portfolio: Title border fixes, responsiveness check

diff --git a/css/app.css b/css/app.css
index 7babfab..58e25ef 100644 (file)
--- a/css/app.css
+++ b/css/app.css
@@ -6728,6 +6728,39 @@ h2#block-title {
   height: auto;
   padding: 0 0.625rem 1.25rem; }
 
+#fancybox-title-inside {
+  background: white;
+  border-radius: 4px;
+  color: #f5822a;
+  font-family: times;
+  font-size: 16px; }
+  #fancybox-title-inside a {
+    text-decoration: underline;
+    color: #f5822a;
+    font-style: italic; }
+
+#fancybox-title {
+  position: absolute;
+  top: 0;
+  padding-top: 10px;
+  padding-bottom: 5px; }
+  #fancybox-title #fancybox-title-inside {
+    padding: 2px 0; }
+    #fancybox-title #fancybox-title-inside h1, #fancybox-title #fancybox-title-inside h2, #fancybox-title #fancybox-title-inside h3, #fancybox-title #fancybox-title-inside h4, #fancybox-title #fancybox-title-inside h5, #fancybox-title #fancybox-title-inside h6 {
+      color: #f5822a; }
+    #fancybox-title #fancybox-title-inside p {
+      color: black; }
+    #fancybox-title #fancybox-title-inside div {
+      color: black; }
+    #fancybox-title #fancybox-title-inside a {
+      text-decoration: none;
+      border-bottom: 1px solid rgba(5, 104, 179, 0.35); }
+      #fancybox-title #fancybox-title-inside a:hover {
+        border-color: #0568b3; }
+
+#fancybox-outer, #fancybox-left, #fancybox-right {
+  padding-top: 40px; }
+
 .gallery {
   margin: 0 auto; }
   .gallery .ngg-gallery-thumbnail, .gallery .ngg-gallery-thumbnail-box {
@@ -6791,16 +6824,6 @@ h2#block-title {
     /*        font-style: italic;*/ }
   .gallery .image_overlay img {
     width: 100%; }
-  .gallery #fancybox-title-inside {
-    background: #0568b3;
-    border-radius: 4px;
-    color: white;
-    font-family: times;
-    font-size: 16px; }
-    .gallery #fancybox-title-inside a {
-      text-decoration: underline;
-      color: white;
-      font-style: italic; }
   .gallery .ngg-fancybox {
     margin: 0 !important; }
   .gallery .ngg-fancybox img {
@@ -6810,15 +6833,6 @@ h2#block-title {
     border: 0; }
   .gallery .slideshowlink {
     display: none; }
-  .gallery #fancybox-title {
-    position: absolute;
-    top: 0;
-    padding-top: 10px;
-    padding-bottom: 5px; }
-    .gallery #fancybox-title #fancybox-title-inside {
-      padding: 2px 0; }
-  .gallery #fancybox-outer, .gallery #fancybox-left, .gallery #fancybox-right {
-    padding-top: 40px; }
 
 /* Styles for specific templates */
 #gallery-glmphotos-light-3 .special {
@@ -6891,7 +6905,6 @@ h2#block-title {
   border: none; }
 #gallery-glmphotos-light-3 .ngg-gallery-thumbnail {
   background: #fff none repeat scroll 0 0;
-  cursor: pointer;
   float: left;
   list-style-type: none;
   padding: 10px;
@@ -6968,7 +6981,7 @@ h2#block-title {
     transform: scale(0.2);
     border-top-left-radius: 4px;
     border-top-right-radius: 4px; }
-  #gallery-glmphotos-light-3 .ngg-gallery-thumbnail .ngg-fancybox:hover {
+  #gallery-glmphotos-light-3 .ngg-gallery-thumbnail > .ngg-fancybox:hover {
     box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.75) inset; }
   #gallery-glmphotos-light-3 .ngg-gallery-thumbnail .ngg-fancybox:hover .image_title {
     opacity: 1; }
@@ -6981,27 +6994,33 @@ h2#block-title {
 #gallery-glmphotos-light-3 .photoTitle {
   width: 90%;
   text-transform: capitalize;
-  padding: 10px 0;
-  margin: 8px auto 0; }
+  margin: 8px auto 0;
+  cursor: pointer; }
   #gallery-glmphotos-light-3 .photoTitle:hover a {
     color: #ec6c0b; }
+  #gallery-glmphotos-light-3 .photoTitle:hover a.ngg-fancybox:before, #gallery-glmphotos-light-3 .photoTitle:hover a.ngg-fancybox:after {
+    transform: scaleX(1);
+    border-color: #0568b3; }
   #gallery-glmphotos-light-3 .photoTitle a.ngg-fancybox {
     max-height: 40px;
     padding: 8px 0;
     text-align: center; }
+    #gallery-glmphotos-light-3 .photoTitle a.ngg-fancybox:after, #gallery-glmphotos-light-3 .photoTitle a.ngg-fancybox:before {
+      display: block;
+      content: '';
+      border-width: 1px;
+      border-color: rgba(5, 104, 179, 0.35);
+      border-style: solid;
+      width: 80%;
+      margin: 0 auto;
+      transform: scaleX(0.0001);
+      transition: transform 250ms ease-in-out; }
+    #gallery-glmphotos-light-3 .photoTitle a.ngg-fancybox:after {
+      margin-top: 5px; }
+    #gallery-glmphotos-light-3 .photoTitle a.ngg-fancybox:before {
+      margin-bottom: 5px; }
   #gallery-glmphotos-light-3 .photoTitle a:hover {
     text-decoration: none; }
-  #gallery-glmphotos-light-3 .photoTitle:after, #gallery-glmphotos-light-3 .photoTitle:before {
-    display: block;
-    content: '';
-    border-width: 1px 0;
-    border-color: rgba(5, 104, 179, 0.35);
-    border-style: solid;
-    transform: scaleX(0.0001);
-    transition: transform 250ms ease-in-out; }
-  #gallery-glmphotos-light-3 .photoTitle:hover:before, #gallery-glmphotos-light-3 .photoTitle:hover:after {
-    transform: scaleX(1);
-    border-color: #0568b3; }
 
 /* End styles for specific templates*/
 .gform_wrapper ul li.gfield {

diff --git a/js/app.js b/js/app.js
index 9091171..9946610 100644 (file)
--- a/js/app.js
+++ b/js/app.js
@@ -46,4 +46,7 @@ $(document).ready(function () {
             $(this).text(statement).fadeIn(1000);
         });
     },3100);
+    
+    $(".photoTitle").each(function() {$(this).find(">:first-child").remove();});
+    
 });

diff --git a/js/custom/pageSetup.js b/js/custom/pageSetup.js
index 8f13597..5281e68 100644 (file)
--- a/js/custom/pageSetup.js
+++ b/js/custom/pageSetup.js
@@ -37,4 +37,7 @@ $(document).ready(function () {
             $(this).text(statement).fadeIn(1000);
         });
     },3100);
+    
+    $(".photoTitle").each(function() {$(this).find(">:first-child").remove();});
+    
 });

diff --git a/scss/plugins/_nextgen.scss b/scss/plugins/_nextgen.scss
index 860a46f..2f0df25 100644 (file)
--- a/scss/plugins/_nextgen.scss
+++ b/scss/plugins/_nextgen.scss
@@ -4,6 +4,51 @@
     height: auto;
     padding: 0 0.625rem 1.25rem;
 }
+#fancybox-title-inside {
+    background: white;
+    border-radius: 4px;
+    color: $orange;
+    font-family: times;
+    font-size: 16px;
+    a {
+        text-decoration: underline;
+        color: $orange;
+        font-style: italic;
+    }
+}
+
+#fancybox-title {
+    position: absolute;
+    top: 0;
+    padding-top: 10px;
+    padding-bottom: 5px;
+    #fancybox-title-inside {
+        padding: 2px 0;
+        h1,h2,h3,h4,h5,h6 {
+            color: $orange;
+        }
+        p {
+            color: black;
+        }
+        div {
+            color: black;
+        }
+        a {
+            text-decoration: none;
+            border-bottom: 1px solid rgba(5,104,179,.35);
+            &:hover {
+                border-color: rgba(5,104,179,1);
+                    
+            }
+        }
+        
+    }
+}
+#fancybox-outer,
+#fancybox-left,
+#fancybox-right {
+    padding-top:40px;
+}
 .gallery {
     margin: 0 auto;
     .ngg-gallery-thumbnail, 
@@ -86,18 +131,6 @@
     .image_overlay img {
         width: 100%;
     }
-    #fancybox-title-inside {
-        background:#0568b3;
-        border-radius: 4px;
-        color: white;
-        font-family: times;
-        font-size: 16px;
-        a {
-            text-decoration: underline;
-            color: white;
-            font-style: italic;
-        }
-    }
     .ngg-fancybox {
         margin: 0 !important;
     }
@@ -110,20 +143,6 @@
     .slideshowlink {
         display:none;
     }
-    #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;
-    }
 }
 
 /* Styles for specific templates */
@@ -194,7 +213,6 @@
     }
     .ngg-gallery-thumbnail {
         background: #fff none repeat scroll 0 0;
-        cursor: pointer;
         float: left;
         list-style-type: none;
         padding: 10px;
@@ -211,7 +229,6 @@
             -o-transition: border-radius 1s ease 0s;
         }
         .ngg-fancybox:hover {
-            
             img {
                 opacity: 0.75;
                 border-radius: 30px;
@@ -280,7 +297,7 @@
             border-top-left-radius: 4px;
             border-top-right-radius: 4px;
         }
-        .ngg-fancybox:hover {
+        > .ngg-fancybox:hover {
             box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.75) inset;
         }
         .ngg-fancybox:hover .image_title {
@@ -299,38 +316,47 @@
     .photoTitle {
         width: 90%;
         text-transform: capitalize;
-        padding: 10px 0;
         margin: 8px auto 0;
+        cursor: pointer;
         &:hover {
-            
             a {
                 color: #ec6c0b;
             }
+            
+            a.ngg-fancybox:before,
+            a.ngg-fancybox:after {
+                transform: scaleX(1);
+                border-color: rgba(5,104,179,1);
+            }
+            
+            
         }
         a.ngg-fancybox {
             max-height: 40px;
             padding: 8px 0;
             text-align: center;
+            &:after,
+            &:before {
+                display:block;
+                content: '';
+                border-width: 1px;
+                border-color: rgba(5,104,179,.35);
+                border-style: solid;
+                width: 80%;
+                margin: 0 auto;
+                transform: scaleX(0.0001);  
+                transition: transform 250ms ease-in-out;
+            }
+            &:after {
+                margin-top: 5px;
+            }
+            &:before {
+                margin-bottom: 5px;
+            }
         }
         a:hover {
             text-decoration: none;
         }
-        &:after,
-        &:before {
-            display:block;
-            content: '';
-            border-width: 1px 0;
-            border-color: rgba(5,104,179,.35);
-            border-style: solid;
-            
-            transform: scaleX(0.0001);  
-            transition: transform 250ms ease-in-out;
-        }
-        &:hover:before,
-        &:hover:after {
-            transform: scaleX(1);
-            border-color: rgba(5,104,179,1);
-        }
     }
     
 }