// reset html { background-color: @body-bg; } body { font-family: @font-family-base; font-size: @font-size-base; color: @text-color; background-color: transparent; -webkit-font-smoothing: antialiased; line-height: @line-height-base; } *:focus { outline: 0 !important; } .h1, .h2, .h3, .h4, .h5, .h6{ margin: 0; } // Links // ------------------------- a { color: @link-color; text-decoration: none; cursor: pointer; } a:hover, a:focus { color: @link-hover-color; text-decoration: none; } label{font-weight: normal;} small, .small{font-size: @font-size-sm;} .badge, .label{font-weight: bold; text-shadow: 0 1px 0 rgba(0, 0, 0, .2)} .badge.bg-light, .label.bg-light{text-shadow:none;} .badge{ background-color: @badge-bg; &.up{ position: relative; top: -10px; padding:3px 6px; margin-left: -10px; } } .badge-sm{ font-size: 85%; padding: 2px 5px !important; } .label-sm{ padding-top: 0; padding-bottom: 1px; } .badge-white { background-color: transparent; border: 1px solid rgba(255,255,255,0.35); padding: 2px 6px; } .badge-empty { background-color: transparent; border: 1px solid rgba(0,0,0,0.15); color: inherit; } blockquote{ border-color: @border-color; } .caret-white{ border-top-color: #fff; border-top-color: rgba(255,255,255,.65); a:hover & { border-top-color: #fff; } } .thumbnail{ border-color: @border-color; } .progress{ background-color: @brand-light; } .progress-xxs{ height: 2px } .progress-xs{ height: 6px } .progress-sm{ height: 12px; .progress-bar{ font-size: 10px; line-height: 1em; } } .progress, .progress-bar{ .box-shadow(none); } .progress-bar-primary{ background-color: @brand-primary; } .progress-bar-info{ background-color: @brand-info; } .progress-bar-success{ background-color: @brand-success; } .progress-bar-warning{ background-color: @brand-warning; } .progress-bar-danger{ background-color: @brand-danger; } .progress-bar-black{ background-color: @brand-black; } .progress-bar-white{ background-color: #fff; } .accordion-group, .accordion-inner{ border-color: @border-color; border-radius: @border-radius-base; } .alert{ font-size: @font-size-sm; box-shadow: inset 0 1px 0 rgba(255,255,255,0.2); .close i{ font-size: 12px; font-weight: normal; display: block; } } .form-control{ border-color: @input-border; border-radius: @input-border-radius; &, &:focus { .box-shadow(none); } &:focus{ border-color: @input-border-focus; } } .form-horizontal{ .control-label.text-left{ text-align: left; } } .form-control-spin{ position: absolute; z-index: 2; right: 10px; top: 50%; margin-top: -7px; } .input-lg{ height: 45px; } .input-group-addon{ border-color: @input-border; background-color: @brand-light; } .list-group{ border-radius: @border-radius-base; &.no-radius { .list-group-item{ border-radius: 0 !important; } } &.no-borders { .list-group-item{ border: none; } } &.no-border{ .list-group-item{ border-width: 1px 0; } } &.no-bg{ .list-group-item{ background-color: transparent; } } } .list-group-item{ border-color: @list-group-item-border; padding-right: 15px; a&{ &:hover, &:focus, &.hover{ background-color: @list-group-item-hover; } } &.media { margin-top: 0; } &.active { color: #fff; border-color: @list-group-active-color !important; background-color: @list-group-active-color !important; .text-muted{ color: lighten(@list-group-active-color, 30%) !important; } a{ color: #fff; } } &.focus{ background-color: @list-group-item-focus !important; } &.select{ position: relative; z-index: 1; background-color: @list-group-select-color !important; border-color: darken( @list-group-select-color , 5%); } .list-group-alt & { &:nth-child(2n+2){ background-color: rgba(0,0,0,0.02) !important; } } .list-group-lg & { padding-top: 15px; padding-bottom: 15px; } .list-group-sm & { padding: 6px 10px; } .list-group-sp & { margin-bottom: 5px; border-radius: 3px; } > .badge{ margin-right: 0; } > .fa-chevron-right { float: right; margin-top: 4px; margin-right: -5px; & + .badge{ margin-right: 5px; } } } .nav-pills{ &.no-radius { > li{ > a { border-radius: 0; } } } > li{ &.active { > a{ color: #fff !important; background-color: @brand-info; &:hover, &:active{ background-color: darken(@brand-info, 5%); } } } } } .nav{ > li{ > a{ &:hover, &:focus{ background-color: @nav-bg; } } } &.nav-lg{ > li > a{ padding: 20px 20px; } } &.nav-md{ > li > a{ padding: 15px 15px; } } &.nav-sm{ > li > a{ padding: 6px 12px; } } &.nav-xs{ > li > a{ padding: 4px 10px; } } &.nav-xxs{ > li > a{ padding: 1px 10px; } } &.nav-rounded{ > li > a{ border-radius: 20px; } } .open{ > a{ &, &:hover, &:focus{ background-color: @nav-bg; } } } } .nav-tabs{ border-color: @border-color; > li{ > a{ border-radius: @panel-border-radius @panel-border-radius 0 0; border-bottom-color: @border-color; } &:hover > a, &.active > a, &.active > a:hover{ border-color: @border-color; } &.active > a{ border-bottom-color: #fff !important; } } .nav-tabs-alt & { &.nav-justified{ > li{ display: table-cell; width: 1%; } } > li{ > a { border-radius: 0; border-color: transparent !important; background: transparent !important; border-bottom-color: @border-color !important; } &.active{ > a { border-bottom-color: @brand-info !important; } } } } } .tab-container{ margin-bottom: 15px; .tab-content{ padding:15px; background-color: #fff; border: 1px solid @border-color; border-top-width: 0; border-radius: 0 0 @panel-border-radius @panel-border-radius; } } .pagination{ > li{ > a{ border-color: @border-color; &:hover, &:focus{ border-color: @border-color; background-color: @brand-light; } } } } .panel{ border-radius: @panel-border-radius; .accordion-toggle{ font-size: 14px; display: block; cursor: pointer; } .list-group-item{ border-color: @panel-list-group-border; } &.no-borders{ border-width: 0; .panel-heading, .panel-footer{ border-width: 0; } } } .panel-heading{ .panel-default &{ background-color: @panel-heading-bg; } border-radius: @panel-border-radius @panel-border-radius 0 0; &.no-border{ margin:-1px -1px 0 -1px; border: none; } .nav{ margin: -10px -15px; } .list-group{ background: transparent; } } .panel-footer{ border-color: @panel-heading-border; border-radius: 0 0 @panel-border-radius @panel-border-radius; background-color: @panel-footer-bg; } .panel-default{ border-color: @panel-border; > .panel-heading, > .panel-footer { border-color: @panel-heading-border; } } .panel-group .panel-heading + .panel-collapse .panel-body{ border-top: 1px solid #eaedef; } .table{ > tbody, > tfoot { > tr { > td { padding:8px 15px; border-top: 1px solid @table-border-color; } } } > thead > tr > th{ padding:8px 15px; border-bottom: 1px solid @table-border-color; } } .table-bordered{ border-color: @table-border-color; > tbody{ > tr{ > td{ border-color: @table-border-color; } } } > thead > tr > th{ border-color: @table-border-color; } } .table-striped{ > tbody { > tr{ &:nth-child(odd){ > td, > th{ background-color: @table-striped-color; } } } } > thead { > th{ background-color: @table-striped-color; border-right: 1px solid @table-border-color; &:last-child{ border-right: none } } } } .well, pre { background-color: @brand-light; border-color: @border-color; } .dropdown-menu{ border-radius: @border-radius-base; .box-shadow(0 2px 6px rgba(0, 0, 0, 0.1)); border: 1px solid @border-color; border: 1px solid rgba(0, 0, 0, 0.1); &.pull-left{ left:100%; } > .panel{ border: none; margin: -5px 0; } > li > a{ padding: 5px 15px; } > li > a:hover, > li > a:focus, > .active > a, > .active > a:hover, > .active > a:focus{ background-image: none; filter:none; background-color: @brand-light !important; color: @link-hover-color; } } .dropdown-header{ padding: 5px 15px; } .dropdown-submenu{ position: relative; &:hover, &:focus{ > a{ background-color: @brand-light !important; color: @text-color; } > .dropdown-menu { display: block; } } &.pull-left{ float: none !important; > .dropdown-menu{ left: -100%; margin-left: 10px; } } .dropdown-menu{ left:100%; top:0; margin-top: -6px; margin-left: -1px } .dropup & { > .dropdown-menu{ top: auto; bottom: 0; } } } .btn-group > .btn{ margin-left: -1px; } /*cols*/ .col-lg-2-4 { position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; } .col-0{clear:left;} .row.no-gutter{ margin-left: 0; margin-right: 0; } .no-gutter [class*="col"]{ padding: 0; } .row-sm{ margin-left: -10px; margin-right: -10px; > div{ padding-left: 10px; padding-right: 10px; } } .modal-backdrop{ background-color: @brand-dark; &.in{ opacity: 0.8; filter: alpha(opacity=80); } } .modal-over{ left: 0; right: 0; top: 0; bottom: 0; position: fixed; } .modal-center{ position: absolute; left:50%; top:50%; }