From: Ian Weller Date: Mon, 11 Apr 2016 15:00:51 +0000 (-0400) Subject: edited some styling for the blocks and also edited slideshow caption styles X-Git-Tag: v1.0.0^2~70 X-Git-Url: http://cvs2.gaslightmedia.com/gitweb/?a=commitdiff_plain;h=166491a94990b80f3153ef019f28690e82bb1d74;p=WP-Themes%2Fgaslightmedia.git edited some styling for the blocks and also edited slideshow caption styles --- diff --git a/css/app.css b/css/app.css index 49ec89c..d74d217 100644 --- a/css/app.css +++ b/css/app.css @@ -5109,7 +5109,7 @@ blockquote, blockquote p { position: absolute; top: 0; width: 2.8125rem; - border-right: solid 1px gray; + border-right: solid 1px #FFFFFF; left: 0; } .right-small { @@ -5117,7 +5117,7 @@ blockquote, blockquote p { position: absolute; top: 0; width: 2.8125rem; - border-left: solid 1px gray; + border-left: solid 1px #FFFFFF; right: 0; } .tab-bar-section { @@ -6600,6 +6600,10 @@ h2#block-title { float: none; left: 0; right: 0; } + @media only screen and (max-width: 40em) { + .blocks .block .block-text { + left: auto; + right: auto; } } .blocks .overlay:hover:before { position: absolute; content: ''; @@ -6698,12 +6702,9 @@ h2#block-title { @media screen and (max-width: 1130px) { #slideshow #cat-text p { margin-bottom: 15px; } } - @media screen and (min-width: 675px) { - #slideshow img { - min-height: 267px; } } #slideshow .nivo-caption { background: transparent; - width: 1200px; + max-width: 1200px; position: absolute; right: 0; left: 0; @@ -6713,28 +6714,21 @@ h2#block-title { #slideshow .nivo-caption h6 { width: 400px; font-weight: bold; - font-size: 28; } - @media screen and (max-width: 674px) { - #slideshow .nivo-caption h6 { - padding-bottom: 8px; } } + font-size: 28; + padding: 0 5px; } #slideshow .nivo-caption p { width: 400px; letter-spacing: 0.1em; font-size: 18px; - padding: 0; - margin-bottom: 30px; } - @media screen and (min-width: 795px) and (max-width: 849px) { - #slideshow .nivo-caption p { - width: 375px; } } - @media screen and (min-width: 728px) and (max-width: 794px) { - #slideshow .nivo-caption p { - width: 350px; } } - @media screen and (min-width: 641px) and (max-width: 727px) { - #slideshow .nivo-caption p { - width: 325px; } } - @media screen and (max-width: 674px) { + padding: 0; } + @media screen and (max-width: 849px) { #slideshow .nivo-caption p { - display: none; } } + width: auto; + position: absolute; + bottom: 0; + left: 0; + background: #000000; + padding: 0 15px; } } #slideshow .nivo-caption a.button { text-transform: uppercase; background: transparent; diff --git a/scss/_main.scss b/scss/_main.scss index bc18379..50ab949 100644 --- a/scss/_main.scss +++ b/scss/_main.scss @@ -113,6 +113,10 @@ h2#block-title { float: none; left: 0; right: 0; + @media #{$small-only}{ + left: auto; + right: auto; + } } } & .overlay { diff --git a/scss/_settings.scss b/scss/_settings.scss index cbf8641..be9e8cb 100644 --- a/scss/_settings.scss +++ b/scss/_settings.scss @@ -839,7 +839,7 @@ $small-font-color: scale-color($header-font-color, $lightness: 35%); // $tabbar-middle-padding: 0 rem-calc(10); // Off Canvas Divider Styles -// $tabbar-left-section-border: solid 1px scale-color($tabbar-bg, $lightness: -50%); + $tabbar-left-section-border: solid 1px $white; // $tabbar-right-section-border: $tabbar-left-section-border; diff --git a/scss/_slideshow.scss b/scss/_slideshow.scss index 23daa52..b169e57 100644 --- a/scss/_slideshow.scss +++ b/scss/_slideshow.scss @@ -41,14 +41,9 @@ } } } - img { - @media screen and (min-width: 675px) { - min-height: 267px; - } - } .nivo-caption { background: transparent; - width: 1200px; + max-width: 1200px; position: absolute; right: 0; left: 0; @@ -59,27 +54,20 @@ width: 400px; font-weight: bold; font-size: (28); - @media screen and (max-width: 674px){ - padding-bottom: 8px; - } + padding: 0 5px; } p { width: 400px; letter-spacing: 0.1em; font-size: 18px; padding: 0; - margin-bottom: 30px; - @media screen and (min-width: 795px) and (max-width: 849px) { - width: 375px; - } - @media screen and (min-width: 728px) and (max-width: 794px) { - width: 350px; - } - @media screen and (min-width: 641px) and (max-width: 727px) { - width: 325px; - } - @media screen and (max-width: 674px){ - display: none; + @media screen and (max-width: 849px) { + width: auto; + position: absolute; + bottom: 0; + left: 0; + background: $black; + padding: 0 15px; } } a.button {