// 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; } } } }