diff options
Diffstat (limited to '2/flatly/bootswatch.less')
-rw-r--r-- | 2/flatly/bootswatch.less | 605 |
1 files changed, 605 insertions, 0 deletions
diff --git a/2/flatly/bootswatch.less b/2/flatly/bootswatch.less new file mode 100644 index 00000000..041c0836 --- /dev/null +++ b/2/flatly/bootswatch.less @@ -0,0 +1,605 @@ +// Flatness by Jenil (www.jgog.in) +// Bootswatch 2.3.2 +// ----------------------------------------------------- + + +// TYPOGRAPHY +// -------------------------------------------------- + +@import url("http://fonts.googleapis.com/css?family=Lato:400,700,900,400italic"); + +h1 { + font-size: 48px; + font-weight: 900; +} + +h2 { + font-size: 36px; + font-weight: 700; +} + +h3 { + font-size: 28px; + font-weight: 700; +} + +h4 { + font-size: 24px; + font-weight: 500; +} + +h5 { + font-size: 16px; + font-weight: 500; +} + +h6 { + font-size: 13px; + font-weight: 500; + text-transform: none; +} + +p { + margin-bottom: 1em; +} + +// SCAFFOLDING +// -------------------------------------------------- + +.page-header { + border-bottom: none; +} + + +// NAVBAR +// -------------------------------------------------- + +.navbar { + + .brand { + + text-shadow: none; + + &:hover { + color: @linkColorHover; + } + } + + .navbar-inner { + .box-shadow(none); + } + + .nav > li > a { + text-shadow: none; + } + + .nav > .active > a, + .nav > .active > a:hover, + .nav > .active > a:focus { + .box-shadow(none); + } + + .navbar-search .search-query { + border: none; + .box-shadow(none); + line-height: normal; + } + + .btn-navbar { + background-image: none; + .box-shadow(none); + } + + .btn, .btn-group { + margin-top: 6px; + } + + &-inverse { + + .brand:hover { + color: @blueDark; + } + + .navbar-search .search-query { + border-color: transparent; + .box-shadow(none); + line-height: normal; + color: @textColor; + + &:focus { + padding: 4px 14px; + color: @textColor; + } + } + } +} + +div.subnav { + + border-color: transparent; + background-image: none; + background-color: @grayLighter; + .box-shadow(none); + + &-fixed { + top: @navbarHeight; + } + + .nav > li > a { + border-color: transparent; + .box-shadow(none); + color: @textColor; + } + + .nav > .active > a, + .nav > .active > a:hover { + border-color: transparent; + background-color: darken(@grayLighter, 10%); + .box-shadow(none); + color: @textColor; + } +} + +// NAVIGATION +// -------------------------------------------------- + +.nav-list { + + & > li > a, + & > .active > a, + .nav-header { + text-shadow: none; + } + + .divider { + background: none; + border-bottom: 2px solid @dropdownDividerBottom; + } +} + +.nav-pills { + + .open .dropdown-toggle { + background-color: @blueDark; + } +} + +.pagination { + + ul { + + .box-shadow(none); + + & > li > a { + background-color: @green; + border-color: transparent; + color: @white; + + &:hover { + background-color: lighten(@green, 10%); + } + } + + & > .active > a, + & > .active > a:hover { + background-color: @paginationActiveBackground; + color: @textColor; + } + + & > .disabled > a, + & > .disabled > a:hover { + background-color: lighten(@green, 10%); + color: @white; + } + } +} + +.pager { + + li > a, + li > span { + background-color: @green; + border: none; + color: @white; + + &:hover { + background-color: lighten(@green, 10%); + } + } + + .disabled > a, + .disabled > span, + .disabled > a:hover, + .disabled > span:hover { + background-color: lighten(@green, 10%); + color: @white; + } +} + +.breadcrumb { + + & > li { + text-shadow: none; + } +} + +// BUTTONS +// -------------------------------------------------- + +.btn { + padding: 9px 20px; + border: none; + background-image: none; + color: @white; + text-decoration: none; + text-shadow: none; + .box-shadow(none); + -webkit-transition: 0.25s; + -moz-transition: 0.25s; + transition: 0.25s; + + &:hover, + &:focus { + color: white; + -webkit-transition: 0.25s; + -moz-transition: 0.25s; + transition: 0.25s; + } + + &:active, + &.active { + .box-shadow(none); + color: rgba(255, 255, 255, 0.75); + } + + &.disabled, + &[disabled] { + color: white; + } + + &-large { + padding: @paddingLarge; + } + + &-small { + padding: @paddingSmall; + } + + &-mini { + padding: @paddingMini; + } +} + +// TABLES +// ----------------------------------------------------- + +.table tbody tr { + &.success > td, + &.error > td, + &.warning > td, + &.info > td { + color: @white; + } +} + +// FORMS +// -------------------------------------------------- + +textarea, +input[type="text"], +input[type="password"], +input[type="datetime"], +input[type="datetime-local"], +input[type="date"], +input[type="month"], +input[type="time"], +input[type="week"], +input[type="number"], +input[type="email"], +input[type="url"], +input[type="search"], +input[type="tel"], +input[type="color"], +.uneditable-input { + padding: 7px 6px; + border: 2px solid #dce4ec; + text-indent: 1px; + .border-radius(@inputBorderRadius); + .box-shadow(none); + .placeholder(#acb6c0); + + &:focus { + border-color: #1abc9c; + .box-shadow(none); + + } +} + +.input-prepend { + + .add-on:first-child, + .btn:first-child { + .border-radius(@inputBorderRadius 0 0 @inputBorderRadius); + } +} + +.input-append { + + input, + select, + .uneditable-input { + + .border-radius(@inputBorderRadius 0 0 @inputBorderRadius); + + + .btn-group .btn:last-child { + .border-radius(0 @inputBorderRadius @inputBorderRadius 0); + } + } + + .add-on:last-child, + .btn:last-child, + .btn-group:last-child > .dropdown-toggle { + .border-radius(0 @inputBorderRadius @inputBorderRadius 0); + } +} + +.input-prepend, +.input-append { + + input, + select, + .uneditable-input { + .border-radius(0); + + .btn-group .btn { + .border-radius(0 @inputBorderRadius @inputBorderRadius 0); + } + } + + .add-on:first-child, + .btn:first-child { + .border-radius(@inputBorderRadius 0 0 @inputBorderRadius); + } + + .add-on:last-child, + .btn:last-child { + .border-radius(0 @inputBorderRadius @inputBorderRadius 0); + } +} + +.input-append, +.input-prepend { + + .add-on { + padding: 9px 5px; + text-shadow: none; + border: none; + } +} + +.control-group.error, +.control-group.error input:focus, +.control-group.error textarea:focus { + border-color: #e74c3c; + .box-shadow(none); +} + +.control-group.success, +.control-group.success input:focus, +.control-group.success textarea:focus { + border-color: #2ecc71; + .box-shadow(none); +} + +.control-group.warning, +.control-group.warning input:focus, +.control-group.warning textarea:focus { + border-color: #f1c40f; + .box-shadow(none); +} + +.control-group.info, +.control-group.info input:focus, +.control-group.info textarea:focus { + border-color: #3498db; + .box-shadow(none); +} + +input[disabled], +input[readonly], +textarea[disabled], +textarea[readonly] { + background-color: #eaeded; + border-color: transparent; + color: #cad2d3; + cursor: default; +} + +input[type="file"]{ + line-height: 16px; +} + +legend { + border-bottom: none; + color: @textColor; +} + +.form-actions { + border-top: none; + .border-radius(@baseBorderRadius); + background-color: darken(@grayLighter, 5%); +} + +// DROPDOWNS +// -------------------------------------------------- + + +// ALERTS, LABELS, BADGES +// -------------------------------------------------- + +.alert { + background-color: @orange; + color: @white; + text-shadow: none; + + h1, h2, h3, h4, h5, h6 { + color: @white; + } + + &-error { + background-color: @red; + } + + &-success { + background-color: @green; + } + + &-info { + background-color: @blue; + } +} + +.label { + padding: 6px 10px; + text-shadow: none; +} + +.badge { + padding: 6px 10px; + .border-radius(@borderRadiusLarge); + text-shadow: none; +} + + +// MISC +// -------------------------------------------------- + +.well { + border: none; + .box-shadow(none); + +} + +.progress { + + background: @grayLighter; + border-radius: 32px; + height: 12px; + .box-shadow(none); + + .bar { + background-color: @blueDark; + background-image: none; + .box-shadow(none); + } + + .bar + .bar { + .box-shadow(none); + } + + &-striped .bar { + #gradient > .striped(@blueDark); + } + + &-success .bar, + &-success.progress-striped .bar, + .bar-success { + background-color: @green; + } + + &-warning .bar, + &-warning.progress-striped .bar, + .bar-warning { + background-color: @yellow; + } + + &-danger .bar, + &-danger.progress-striped .bar, + .bar-danger { + background-color: @red; + } + + &-info .bar, + &-info.progress-striped .bar, + .bar-info { + background-color: @blue; + } +} + +.tooltip { + + &.in { + opacity: 1; + } +} + +.popover { + color: @white; + + &-title { + border-bottom: 2px solid @dropdownDividerBottom; + } +} + +.modal { + + &-header { + background-color: @navbarBackground; + border-bottom: none; + color: @white; + } + + &-footer { + background-color: @grayLighter; + border-top: none; + .box-shadow(none); + } +} + +.close { + text-shadow: none; +} + +// MEDIA QUERIES +// -------------------------------------------------- + +@media (max-width: 767px) { + + div.subnav { + + .nav > li:first-child > a, + .nav > li + li > a { + border-color: transparent; + + &:hover { + background-color: darken(@grayLighter, 10%); + } + } + + .nav > li:last-child > a { + border-radius: 0 0 4px 4px; + } + } + + .input-append, + .input-prepend { + + .add-on,.btn { + padding: 5px; + } + } +} + +@media (max-width: 979px) { + + .navbar { + + .nav-collapse .nav > li > a { + color: @white; + + &:hover { + background-color: @green; + } + } + + } +} |