From: Thomas Park Date: Tue, 7 Aug 2012 21:13:27 +0000 (-0400) Subject: themes: reduced demo css X-Git-Tag: v2.0.4~16 X-Git-Url: http://git.roojs.org/?a=commitdiff_plain;h=e799f84f00eecb9383043fbfcae89a82076fbc75;p=bootswatch themes: reduced demo css --- diff --git a/css/docs.css b/css/docs.css index 5132bb7..8c303ce 100755 --- a/css/docs.css +++ b/css/docs.css @@ -17,44 +17,6 @@ body { background-position: 0 40px; } - -/* Tweak navbar brand link to be super sleek --------------------------------------------------- */ -/*.navbar-fixed-top .brand { - padding-right: 0; - padding-left: 0; - margin-left: 20px; - float: right; - font-weight: bold; - color: #000; - text-shadow: 0 1px 0 rgba(255,255,255,.1), 0 0 30px rgba(255,255,255,.125); - -webkit-transition: all .2s linear; - -moz-transition: all .2s linear; - transition: all .2s linear; -} -.navbar-fixed-top .brand:hover { - text-decoration: none; -}*/ - - -/* Space out sub-sections more --------------------------------------------------- */ -section { - padding-top: 60px; -} - -/* Faded out hr */ -hr.soften { - height: 1px; - margin: 54px 0; - background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0)); - background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0)); - background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0)); - background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0)); - border: 0; -} - - /* Jumbotrons -------------------------------------------------- */ .jumbotron { @@ -84,25 +46,6 @@ hr.soften { font-size: 14px; } -/* Masthead (docs home) */ -.masthead { - padding-top: 36px; - margin-bottom: 72px; -} -.masthead h1, -.masthead p { - text-align: center; -} -.masthead h1 { - margin-bottom: 18px; -} -.masthead p { - margin-left: 5%; - margin-right: 5%; - font-size: 30px; - line-height: 36px; -} - /* Specific jumbotrons ------------------------- */ @@ -210,427 +153,6 @@ hr.soften { } -/* Quick links --------------------------------------------------- */ -.bs-links { - margin: 36px 0; -} -.quick-links { - min-height: 30px; - margin: 0; - padding: 5px 20px; - list-style: none; - text-align: center; - overflow: hidden; -} -.quick-links:first-child { - min-height: 0; -} -.quick-links li { - display: inline; - margin: 0 5px; - color: #999; -} -.quick-links .github-btn, -.quick-links .tweet-btn, -.quick-links .follow-btn { - position: relative; - top: 5px; -} - - -/* Marketing section of Overview --------------------------------------------------- */ -.marketing .row { - margin-bottom: 9px; -} -.marketing h1 { - margin: 36px 0 27px; - font-size: 40px; - font-weight: 300; - text-align: center; -} -.marketing h2, -.marketing h3 { - font-weight: 300; -} -.marketing h2 { - font-size: 22px; -} -.marketing p { - margin-right: 10px; -} -.marketing .bs-icon { - float: left; - margin: 7px 10px 0 0; - opacity: .8; -} -.marketing .small-bs-icon { - float: left; - margin: 4px 5px 0 0; -} - - - -/* Footer --------------------------------------------------- */ -.footer { - margin-top: 45px; - padding: 35px 0 36px; - border-top: 1px solid #e5e5e5; -} -.footer p { - margin-bottom: 0; - color: #555; -} - - - -/* Special grid styles --------------------------------------------------- */ -.show-grid { - margin-top: 10px; - margin-bottom: 20px; -} -.show-grid [class*="span"] { - background-color: #eee; - text-align: center; - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; - min-height: 30px; - line-height: 30px; -} -.show-grid:hover [class*="span"] { - background: #ddd; -} -.show-grid .show-grid { - margin-top: 0; - margin-bottom: 0; -} -.show-grid .show-grid [class*="span"] { - background-color: #ccc; -} - - -/* Render mini layout previews --------------------------------------------------- */ -.mini-layout { - border: 1px solid #ddd; - -webkit-border-radius: 6px; - -moz-border-radius: 6px; - border-radius: 6px; - -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.075); - -moz-box-shadow: 0 1px 2px rgba(0,0,0,.075); - box-shadow: 0 1px 2px rgba(0,0,0,.075); -} -.mini-layout { - height: 240px; - margin-bottom: 20px; - padding: 9px; -} -.mini-layout div { - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; -} -.mini-layout .mini-layout-body { - background-color: #dceaf4; - margin: 0 auto; - width: 70%; - height: 240px; -} -.mini-layout.fluid .mini-layout-sidebar, -.mini-layout.fluid .mini-layout-header, -.mini-layout.fluid .mini-layout-body { - float: left; -} -.mini-layout.fluid .mini-layout-sidebar { - background-color: #bbd8e9; - width: 20%; - height: 240px; -} -.mini-layout.fluid .mini-layout-body { - width: 77.5%; - margin-left: 2.5%; -} - - -/* Popover docs --------------------------------------------------- */ -.popover-well { - min-height: 160px; -} -.popover-well .popover { - display: block; -} -.popover-well .popover-wrapper { - width: 50%; - height: 160px; - float: left; - margin-left: 55px; - position: relative; -} -.popover-well .popover-menu-wrapper { - height: 80px; -} -.large-bird { - margin: 5px 0 0 310px; - opacity: .1; -} - - -/* Download page --------------------------------------------------- */ -.download .page-header { - margin-top: 36px; -} -.page-header .toggle-all { - margin-top: 5px; -} - -/* Space out h3s when following a section */ -.download h3 { - margin-bottom: 5px; -} -.download-builder input + h3, -.download-builder .checkbox + h3 { - margin-top: 9px; -} - -/* Fields for variables */ -.download-builder input[type=text] { - margin-bottom: 9px; - font-family: Menlo, Monaco, "Courier New", monospace; - font-size: 12px; - color: #d14; -} -.download-builder input[type=text]:focus { - background-color: #fff; -} - -/* Custom, larger checkbox labels */ -.download .checkbox { - padding: 6px 10px 6px 25px; - color: #555; - background-color: #f9f9f9; - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; - cursor: pointer; -} -.download .checkbox:hover { - color: #333; - background-color: #f5f5f5; -} -.download .checkbox small { - font-size: 12px; - color: #777; -} - -/* Variables section */ -#variables label { - margin-bottom: 0; -} - -/* Giant download button */ -.download-btn { - margin: 36px 0 108px; -} -#download p, -#download h4 { - max-width: 50%; - margin: 0 auto; - color: #999; - text-align: center; -} -#download h4 { - margin-bottom: 0; -} -#download p { - margin-bottom: 18px; -} -.download-btn .btn { - display: block; - width: auto; - padding: 19px 24px; - margin-bottom: 27px; - font-size: 30px; - line-height: 1; - text-align: center; - -webkit-border-radius: 6px; - -moz-border-radius: 6px; - border-radius: 6px; -} - - - -/* Color swatches on LESS docs page --------------------------------------------------- */ -/* Sets the width of the td */ -.swatch-col { - width: 30px; -} -/* Le swatch */ -.swatch { - display: inline-block; - width: 30px; - height: 20px; - margin: -6px 0; - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; -} -/* For white swatches, give a border */ -.swatch-bordered { - width: 28px; - height: 18px; - border: 1px solid #eee; -} - - -/* Misc --------------------------------------------------- */ - -img { - max-width: 100%; -} - -/* Make tables spaced out a bit more */ -h2 + table, -h3 + table, -h4 + table, -h2 + .row { - margin-top: 5px; -} - -/* Example sites showcase */ -.example-sites img { - max-width: 100%; - margin: 0 auto; -} -.marketing-byline { - margin: -18px 0 27px; - font-size: 18px; - font-weight: 300; - line-height: 24px; - color: #999; - text-align: center; -} - -.scrollspy-example { - height: 200px; - overflow: auto; - position: relative; -} - -/* Remove bottom margin on example forms in wells */ -form.well { - padding: 14px; -} - -/* Tighten up spacing */ -.well hr { - margin: 18px 0; -} - -/* Fake the :focus state to demo it */ -.focused { - border-color: rgba(82,168,236,.8); - -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6); - -moz-box-shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6); - box-shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6); - outline: 0; -} - -/* For input sizes, make them display block */ -.docs-input-sizes select, -.docs-input-sizes input[type=text] { - display: block; - margin-bottom: 9px; -} - -/* Icons -------------------------- */ -.the-icons { - margin-left: 0; - list-style: none; -} -.the-icons i:hover { - background-color: rgba(255,0,0,.25); -} - -/* Eaxmples page -------------------------- */ -.bootstrap-examples .thumbnail { - margin-bottom: 9px; - background-color: #fff; -} - -/* Responsive table -------------------------- */ -.responsive-utilities th small { - display: block; - font-weight: normal; - color: #999; -} -.responsive-utilities tbody th { - font-weight: normal; -} -.responsive-utilities td { - text-align: center; -} -.responsive-utilities td.is-visible { - color: #468847; - background-color: #dff0d8 !important; -} -.responsive-utilities td.is-hidden { - color: #ccc; - background-color: #f9f9f9 !important; -} - -/* Responsive tests -------------------------- */ -.responsive-utilities-test { - margin-top: 5px; - margin-left: 0; - list-style: none; - overflow: hidden; /* clear floats */ -} -.responsive-utilities-test li { - position: relative; - float: left; - width: 25%; - height: 43px; - font-size: 14px; - font-weight: bold; - line-height: 43px; - color: #999; - text-align: center; - border: 1px solid #ddd; - -webkit-border-radius: 4px; - -moz-border-radius: 4px; - border-radius: 4px; -} -.responsive-utilities-test li + li { - margin-left: 10px; -} -.responsive-utilities-test span { - position: absolute; - top: -1px; - left: -1px; - right: -1px; - bottom: -1px; - -webkit-border-radius: 4px; - -moz-border-radius: 4px; - border-radius: 4px; -} -.responsive-utilities-test span { - color: #468847; - background-color: #dff0d8; - border: 1px solid #d6e9c6; -} - /* Responsive Docs -------------------------------------------------- */ @@ -641,18 +163,6 @@ form.well { padding-top: 70px; } - /* Change up some type stuff */ - h2 { - margin-top: 27px; - } - h2 small { - display: block; - line-height: 18px; - } - h3 { - margin-top: 18px; - } - /* Adjust the jumbotron */ .jumbotron h1, .jumbotron p { @@ -675,49 +185,6 @@ form.well { padding: 10px 14px; margin: 0 auto 10px; } - /* Masthead (home page jumbotron) */ - .masthead { - padding-top: 0; - } - - /* Don't space out quick links so much */ - .quick-links { - margin: 40px 0 0; - } - /* hide the bullets on mobile since our horizontal space is limited */ - .quick-links .divider { - display: none; - } - - /* center example sites */ - .example-sites { - margin-left: 0; - } - .example-sites > li { - float: none; - display: block; - max-width: 280px; - margin: 0 auto 18px; - text-align: center; - } - .example-sites .thumbnail > img { - max-width: 270px; - } - - table code { - white-space: normal; - word-wrap: break-word; - word-break: break-all; - } - - /* Modal example */ - .modal-example .modal { - position: relative; - top: auto; - right: auto; - bottom: auto; - left: auto; - } } @@ -761,28 +228,6 @@ form.well { -moz-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; } - - /* Popovers */ - .large-bird { - display: none; - } - .popover-well .popover-wrapper { - margin-left: 0; - } - - /* Space out the show-grid examples */ - .show-grid [class*="span"] { - margin-bottom: 5px; - } - - /* Unfloat the back to top link in footer */ - .footer .pull-right { - float: none; - } - .footer p { - margin-bottom: 9px; - } - } @@ -796,7 +241,6 @@ form.well { margin-right: 0; margin-left: 0; } - } @@ -811,7 +255,6 @@ form.well { .jumbotron h1 { font-size: 72px; } - } @@ -824,13 +267,6 @@ form.well { padding-left: 10px; padding-right: 10px; } - - /* Inline-block quick links for more spacing */ - .quick-links li { - display: inline-block; - margin: 5px; - } - } @@ -841,5 +277,4 @@ form.well { .subnav-fixed .nav { width: 1168px; /* 2px less to account for left/right borders being removed when in fixed mode */ } - }