From 37231b0f2391205b8c949e88d493867acd777382 Mon Sep 17 00:00:00 2001 From: Laury GvR Date: Fri, 8 Apr 2016 19:29:12 -0400 Subject: [PATCH] light-5 template better responsive on hover --- css/app.css | 10 ++++++++++ scss/plugins/_nextgen.scss | 10 ++++++++++ 2 files changed, 20 insertions(+) diff --git a/css/app.css b/css/app.css index 9349802..0e47e38 100644 --- a/css/app.css +++ b/css/app.css @@ -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; diff --git a/scss/plugins/_nextgen.scss b/scss/plugins/_nextgen.scss index 75ab29b..aa4c94a 100644 --- a/scss/plugins/_nextgen.scss +++ b/scss/plugins/_nextgen.scss @@ -237,6 +237,9 @@ 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; @@ -246,6 +249,9 @@ .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; @@ -286,6 +292,9 @@ h5 { height:90px; width:100%; + @media #{$small-only} { + padding: 10px; + } } } .ngg-fancybox .title { @@ -320,6 +329,7 @@ font-family: "Lato"; } .photoTitle { + overflow:hidden; width: 90%; text-transform: capitalize; margin: 8px auto 0; -- 2.17.1