diff options
| author | Jacob Thornton <[email protected]> | 2011-05-03 18:12:43 -0700 |
|---|---|---|
| committer | Jacob Thornton <[email protected]> | 2011-05-03 18:12:43 -0700 |
| commit | 96c3e709963516a06ad6e723a7bba3fbf5fc1ba2 (patch) | |
| tree | 4630ca93f148e406dc3c3391e5f790f630e53c97 /less/patterns.less | |
| parent | d447898bf251cfa4cc6b1c8f9cb4c238ad12ef52 (diff) | |
| download | bootstrap-96c3e709963516a06ad6e723a7bba3fbf5fc1ba2.tar.xz bootstrap-96c3e709963516a06ad6e723a7bba3fbf5fc1ba2.zip | |
cleanup old stuff
Diffstat (limited to 'less/patterns.less')
| -rw-r--r-- | less/patterns.less | 526 |
1 files changed, 0 insertions, 526 deletions
diff --git a/less/patterns.less b/less/patterns.less deleted file mode 100644 index 7c5a902fa..000000000 --- a/less/patterns.less +++ /dev/null @@ -1,526 +0,0 @@ -/* - Patterns.less - Repeatable UI elements outside the base styles provided from the scaffolding -*/ - - -/* Top bar --------------------------------------------------- */ - -/* -div.topbar { - #gradient > .vertical(#333, #222); - position: fixed; - top: 0; - left: 0; - right: 0; - z-index: 1000; - height: 40px; - .box-shadow(0 1px 3px rgba(0,0,0,.5)); - a { - color: #999; - &:hover { - color: @white; - text-decoration: none; - background-color: rgba(255,255,255,.05); - } - } - a.logo, - ul li a { - float: left; - padding: 0 10px; - line-height: 40px; - text-shadow: 0 -1px 0 rgba(0,0,0,.25); - } - // Logo - a.logo { - margin-left: -10px; - margin-right: 10px; - color: @gray-light; - font-size: 20px; - font-weight: 200; - img { - float: left; - margin-top: 9px; - margin-right: 6px; - } - &:hover { - color: @white; - } - } - // Nav items - ul { - float: left; - margin: 0; - li { - display: inline; - &.active a { - color: #fff; - background-color: rgba(0,0,0,.5); - } - } - } -} -*/ - -// Topbar for Branding and Nav -div.topbar { - #gradient > .vertical(#333, #222); - height: 40px; - position: fixed; - top: 0; - left: 0; - right: 0; - z-index: 100; - overflow: visible; - @shadow: 0 1px 3px rgba(0,0,0,.25), inset 0 -1px 0 rgba(0,0,0,.1); - .box-shadow(@shadow); - // Links get text shadow - a { - color: @gray-light; - text-shadow: 0 -1px 0 rgba(0,0,0,.25); - .transition(all linear .1s); - } - // Hover and active states for links - ul li a:hover, - ul li.active a, - a.logo:hover { - background-color: #333; - background-color: rgba(255,255,255,.15); - color: @white; - text-decoration: none; - } - // Logo - a.logo { - float: left; - display: block; - padding: 8px 20px 12px; - margin-left: -20px; - color: @white; - font-size: 20px; - font-weight: 200; - line-height: 1; - img { - display: inline; - float: left; - margin-right: 6px; - } - } - // Search Form - form { - float: left; - margin: 4px 0 0 0; - opacity: 1; - position: relative; - input { - background-color: @gray-light; - background-color: rgba(255,255,255,.3); - .sans-serif(13px, normal, 1); - width: 220px; - padding: 4px 9px; - color: #fff; - color: rgba(255,255,255,.75); - border: 1px solid #111; - .border-radius(4px); - @shadow: inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0px rgba(255,255,255,.25); - .box-shadow(@shadow); - .transition(none); - // Placeholder text gets special styles; can't be bundled together though for some reason - &:-moz-placeholder { - color: @gray-lighter; - } - &::-webkit-input-placeholder { - color: @gray-lighter; - } - &:hover { - background-color: #444; - background-color: rgba(255,255,255,.5); - color: #fff; - } - &:focus, - &.focused { - outline: none; - background-color: #fff; - color: @gray-dark; - text-shadow: 0 1px 0 #fff; - border: 0; - padding: 5px 10px; - .box-shadow(0 0 3px rgba(0,0,0,.15)); - } - } - } - // Navigation - ul { - display: block; - float: left; - margin: 0 10px 0 0; - &.secondary-nav { - float: right; - margin-left: 10px; - margin-right: 0; - } - li { - display: block; - float: left; - font-size: 13px; - a { - display: block; - float: none; - padding: 10px 10px 11px; - line-height: 19px; - text-decoration: none; - &:hover { - color: #fff; - text-decoration: none; - } - } - &.active a { - background-color: #222; - background-color: rgba(0,0,0,.5); - font-weight: bold; - } - // Vertical rule - &.vr { - border-left: 1px solid #008db8; - border-right: 1px solid #00a0d1; - height: 26px; - margin: 6px 3px 1px 3px; - } - } - // Dropdowns - &.primary-nav li ul { - left: 0; - } - &.secondary-nav li ul { - right: 0; - } - li.menu { - position: relative; - a.menu { - &:after { - width: 7px; - height: 7px; - display: inline-block; - background: transparent url(../img/dropdown-arrow.gif) no-repeat top center; - content: "↓"; - text-indent: -99999px; - vertical-align: top; - margin-top: 8px; - margin-left: 4px; - opacity: .5; - } - } - &.open { - a.menu, - a:hover { - background-color: lighten(#00a0d1,5); - background-color: rgba(255,255,255,.1); - color: #fff; - } - ul { - display: block; - li { - a { - background-color: transparent; - font-weight: normal; - &:hover { - background-color: rgba(255,255,255,.1); - color: #fff; - } - } - &.active a { - background-color: rgba(255,255,255,.1); - font-weight: bold; - } - } - } - } - } - li ul { - background-color: #333; - float: left; - display: none; - position: absolute; - top: 40px; - min-width: 160px; - max-width: 220px; - _width: 160px; - margin-left: 0; - margin-right: 0; - padding: 0; - text-align: left; - border: 0; - zoom: 1; - .border-radius(0 0 5px 5px); - .box-shadow(0 1px 2px rgba(0,0,0,0.6)); - li { - float: none; - clear: both; - display: block; - background: none; - font-size: 12px; - a { - display: block; - padding: 6px 15px; - clear: both; - font-weight: normal; - line-height: 19px; - color: #bbb; - &:hover { - background-color: #333; - background-color: rgba(255,255,255,.25); - color: #fff; - } - } - // Dividers (basically an hr) - &.divider { - height: 1px; - overflow: hidden; - background: rgba(0,0,0,.2); - border-bottom: 1px solid rgba(255,255,255,.1); - margin: 5px 0; - } - // Section separaters - span { - clear: both; - display: block; - background: rgba(0,0,0,.2); - padding: 6px 15px; - cursor: default; - color: #666; - border-top: 1px solid rgba(0,0,0,.2); - } - } - } - } -} - -/* Page Headers --------------------------------------------------- */ - -div.page-header { - margin-bottom: @baseline - 1; - border-bottom: 1px solid #ddd; - .border-radius(6px 6px 0 0); - .box-shadow(0 1px 0 rgba(255,255,255,.5)); - h1 { - margin-bottom: 0; - } -} - - -/* Error Styles --------------------------------------------------- */ - -// One-liner alert bars -div.alert-message { - #gradient > .vertical(transparent, rgba(0,0,0,0.15)); - background-color: @gray-lighter; - margin-bottom: @baseline; - padding: 10px 15px 9px; - .border-radius(6px); - color: #fff; - border-bottom: 1px solid rgba(0,0,0,.25); - text-shadow: 0 -1px 0 rgba(0,0,0,.25); - p { - color: #fff; - margin-bottom: 0; - + p { - margin-top: 5px; - } - } - &.error { - background-color: lighten(@red, 25%); - } - &.warning { - background-color: lighten(@yellow, 15%); - } - &.success { - background-color: lighten(@green, 15%); - } - &.info { - background-color: lighten(@blue, 15%); - } - a.close { - float: right; - margin-top: -2px; - opacity: .5; - color: #fff; - font-size: 20px; - font-weight: bold; - text-shadow: 0 1px 0 rgba(0,0,0,.5); - .border-radius(3px); - &:hover { - opacity: 1; - text-decoration: none; - } - } -} - -// Block-level Alerts -div.block-message { - margin-bottom: @baseline; - padding: 14px 19px; - color: #333; - color: rgba(0,0,0,.8); - text-shadow: 0 1px 0 rgba(255,255,255,.25); - .border-radius(6px); - p { - font-size: 13px; - line-height: 18px; - color: #333; - color: rgba(0,0,0,.8); - margin-right: 30px; - margin-bottom: 0; - } - ul { - margin-bottom: 0; - } - strong { - display: block; - } - a.close { - display: block; - color: #333; - color: rgba(0,0,0,.5); - text-shadow: 0 1px 1px rgba(255,255,255,.75); - } - &.error { - background: lighten(@red, 55%); - border: 1px solid lighten(@red, 50%); - } - &.warning { - background: lighten(@yellow, 35%); - border: 1px solid lighten(@yellow, 25%) - } - &.success { - background: lighten(@green, 45%); - border: 1px solid lighten(@green, 35%) - } - &.info { - background: lighten(@blue, 45%); - border: 1px solid lighten(@blue, 40%); - } -} - - -/* Navigation --------------------------------------------------- */ - -// Common tab and pill styles -ul.tabs, -ul.pills { - margin: 0 0 20px; - padding: 0; - .clearfix(); - li { - display: inline; - a { - display: inline; - float: left; - width: auto; - } - } -} -// Basic Tabs -ul.tabs { - width: 100%; - border-bottom: 1px solid #ccc; - li { - a { - margin-bottom: -1px; - margin-right: 2px; - padding: 0 15px; - line-height: (@baseline * 2) - 1; - .border-radius(3px 3px 0 0); - &:hover { - background: #f5f5f5; - border-bottom: 1px solid #ccc; - } - } - &.active a { - background: #fff; - padding: 0 14px; - border: 1px solid #ccc; - border-bottom: 0; - color: @gray; - } - } -} -// Basic pill nav -ul.pills { - li { - a { - margin: 5px 3px 5px 0; - padding: 0 15px; - text-shadow: 0 1px 1px #fff; - line-height: 30px; - .border-radius(15px); - &:hover { - background: @link-hover-color; - color: #fff; - text-decoration: none; - text-shadow: 0 1px 1px rgba(0,0,0,.25); - } - } - &.active a { - background: @link-color; - color: #fff; - text-shadow: 0 1px 1px rgba(0,0,0,.25); - } - } -} - - -/* Pagination --------------------------------------------------- */ - -div.pagination { - height: @baseline * 2; - margin: @baseline 0; - ul { - float: left; - margin: 0; - border: 1px solid rgba(0,0,0,.15); - .border-radius(3px); - .box-shadow(0 1px 2px rgba(0,0,0,.075); - li { - display: inline; - a { - display: inline; - float: left; - padding: 0 14px; - line-height: (@baseline * 2) - 2; - border-right: 1px solid rgba(0,0,0,.15); - text-decoration: none; - } - a:hover, - &.active a { - background-color: lighten(@blue, 45%); - } - &.disabled a, - &.disabled a:hover { - background-color: none; - color: @gray-light; - } - &.next a, - &:last-child a { - border: 0; - } - } - } -} - - -/* Wells --------------------------------------------------- */ - -div.well { - background: #f5f5f5; - margin-bottom: 20px; - padding: 19px; - min-height: 20px; - border: 1px solid #ddd; - .border-radius(4px); - .box-shadow(inset 0 1px 1px rgba(0,0,0,.075); -} |
