diff options
Diffstat (limited to 'swatchmaker/test/bootswatch.css')
-rw-r--r-- | swatchmaker/test/bootswatch.css | 323 |
1 files changed, 59 insertions, 264 deletions
diff --git a/swatchmaker/test/bootswatch.css b/swatchmaker/test/bootswatch.css index e7aaca6f..2a69cbb7 100644 --- a/swatchmaker/test/bootswatch.css +++ b/swatchmaker/test/bootswatch.css @@ -1,20 +1,44 @@ -body { - padding-top: 80px; - padding-bottom: 20px; +section { + margin-top: 60px; + padding-top: 100px; } -.navbar a > i { - opacity: 0.5; +/* index */ + +.tooltip-inner { + max-width: 500px; } -.navbar a:hover > i { - opacity: 1; +.hero-unit h1, +.hero-unit p { + margin-bottom: 15px; } -section { - margin-top: 100px; +#footer { + margin-bottom: 20px; +} + +#footer .links a { + margin-right: 10px; +} + +@media (max-width: 767px) { + + + section { + padding-top: 20px; + } +} + +@media (max-width: 979px) and (min-width: 768px) { + + section { + padding-top: 20px; + } } +/* preview */ + .subhead { padding-bottom: 0; margin-bottom: 9px; @@ -24,6 +48,12 @@ section { font-size: 54px; } +.subhead > div:first-child { + min-height: 200px; +} + +/* subnav */ + .subnav { margin-bottom: 60px; width: 100%; @@ -42,11 +72,11 @@ section { -moz-border-radius: 4px; border-radius: 4px; } - + .subnav .nav { margin-bottom: 0; } - + .subnav .nav > li > a { margin: 0; padding-top: 11px; @@ -57,7 +87,7 @@ section { -moz-border-radius: 0; border-radius: 0; } - + .subnav .nav > .active > a, .subnav .nav > .active > a:hover { padding-left: 13px; @@ -69,12 +99,12 @@ section { -moz-box-shadow: inset 0 3px 5px rgba(0,0,0,.05); box-shadow: inset 0 3px 5px rgba(0,0,0,.05); } - + .subnav .nav > .active > a .caret, .subnav .nav > .active > a:hover .caret { border-top-color: #777; } - + .subnav .nav > li:first-child > a, .subnav .nav > li:first-child > a:hover { border-left: 0; @@ -83,227 +113,19 @@ section { -moz-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px; } - + .subnav .nav > li:last-child > a { border-right: 0; } - + .subnav .dropdown-menu { -webkit-border-radius: 0 0 4px 4px; -moz-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px; } - -.tooltip-inner { - max-width: 500px; -} - -.hero-unit { - margin-bottom: 10px; - text-align: center; -} - -.hero-unit h1, -.hero-unit p { - margin-bottom: 15px; -} - -#social { - display: inline-block; - margin-top: 45px; - text-align: center; -} - -#gh-star { - margin-right: 10px; -} - -.twitter-follow-button { - width: 60px !important; -} - -.twitter-share-button { - margin-right: 15px; -} - -.rss-button { - width: 40px; - height: 14px; - font-size: 11px; - line-height: 14px; - font-weight: bold; - margin: 0 0 10px; - padding: 2px 5px 2px 4px; -} - -.icon-rss { - background: url(../img/rss-icons.png) no-repeat 0 0; - opacity: .65; - width: 16px; -} - -#ticker { - margin-bottom: 40px; -} - -.about { - margin-top: 20px; -} - -.about > div { - margin-bottom: 20px; -} - -.about h3 { - margin: 0 0 5px 35px; -} - -.about img { - float: left; - margin-top: 5px; - opacity: 0.7; -} - -#gallery { - margin: 45px 0 30px 0; - padding-right: 20px; - text-align: center; -} - -.thumbnail { - margin-bottom: 20px; - background-color: rgba(0, 0, 0, 0.05); -} - -.thumbnail img { - width: 100%; - -webkit-border-radius: 7px; - -moz-border-radius: 7px; - border-radius: 7px; -} - -.thumbnail .caption { - color: inherit !important; -} - -.thumbnail h3 { - margin-bottom: 0; -} - -.thumbnail .btn-toolbar { - margin-top: 15px; - text-align: right; -} - -.links { - margin-bottom: 20px; -} - -.links > a { - margin-right: 10px; -} - -div.one .bsa_it_ad { - padding: 25px 25px 15px 25px; -} - -div.one .bsa_it_p { - display: none; -} - -.bsa { - float: right; - max-width: 400px; - padding: 0; -} - -body .one .bsa_it_ad { - margin-bottom: -10px; - background: none; - border: none; - font-family: inherit; - color: inherit; -} - -body .one .bsa_it_ad .bsa_it_t, -body .one .bsa_it_ad .bsa_it_d { - color: inherit; - font-size: inherit; -} - -body .one .bsa_it_p { - display: none; -} - -.links { - margin-bottom: 20px; -} - -.links > a { - margin-right: 10px; -} - -@media (max-width: 480px) { - - .hero-unit { - padding: 20px 20px 0; - margin: 0 0 20px; - } - - .hero-unit h1 { - font-size: 36px; - } - - .hero-unit iframe { - margin-right: 0 !important; - } - - #social { - margin-top: 0px; - margin-bottom: 20px; - } - - #social > span { - display: block; - } - - .about { - margin-top: 0; - } - - .about h3 { - margin-top: 20px; - } - - .about p { - margin-bottom: 0; - } - - .modal { - position: fixed !important; - top: 25% !important; - } -} - -/* Landscape phone to portrait tablet */ -@media (min-width: 481px) and (max-width: 767px) { - - .hero-unit { - margin-top: 0; - padding: 30px; - } - - .about { - margin-top: 0; - } -} - + @media (max-width: 767px) { - - body { - padding-top: 0; - } - + .subnav { position: static; top: auto; @@ -315,53 +137,32 @@ body .one .bsa_it_p { -moz-box-shadow: none; box-shadow: none; } - + .subnav .nav > li { float: none; } - + .subnav .nav > li > a { border: 0; } - + .subnav .nav > li + li > a { border-top: 1px solid #e5e5e5; } - + .subnav .nav > li:first-child > a, .subnav .nav > li:first-child > a:hover { -webkit-border-radius: 4px 4px 0 0; -moz-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; } - - .bsa { - float: none; - } } - -/* Portrait tablet to landscape and desktop */ -@media (min-width: 768px) and (max-width: 979px) { - - .hero-unit { - margin-top: 0; - } - - .thumbnail p { - font-size: 12px; - } - - .thumbnail .btn { - padding: 8px 12px; - font-size: 12px; - } -} - -/* Fixed subnav on scroll, but only for 980px and up (sorry IE!) */ + @media (min-width: 980px) { + .subnav-fixed { position: fixed; - top: 41px; + top: 40px; left: 0; right: 0; z-index: 1020; /* 10 less than .navbar-fixed to prevent any overlap */ @@ -375,11 +176,13 @@ body .one .bsa_it_p { box-shadow: inset 0 1px 0 #fff, 0 1px 5px rgba(0,0,0,.1); filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); /* IE6-9 */ } + .subnav-fixed .nav { width: 938px; margin: 0 auto; padding: 0 1px; } + .subnav .nav > li:first-child > a, .subnav .nav > li:first-child > a:hover { -webkit-border-radius: 0; @@ -387,17 +190,9 @@ body .one .bsa_it_p { border-radius: 0; } } - -@media (min-width: 768px) and (max-width: 979px) { - - /* Remove any padding from the body */ - body { - padding-top: 0; - } -} - + @media (min-width: 1210px) { - + .subnav-fixed .nav { width: 1168px; /* 2px less to account for left/right borders being removed when in fixed mode */ } |