diff options
Diffstat (limited to 'cupid/bootswatch.less')
-rw-r--r-- | cupid/bootswatch.less | 512 |
1 files changed, 512 insertions, 0 deletions
diff --git a/cupid/bootswatch.less b/cupid/bootswatch.less new file mode 100644 index 00000000..c4077c62 --- /dev/null +++ b/cupid/bootswatch.less @@ -0,0 +1,512 @@ +// Cupid 3.1.0 +// Bootswatch +// ----------------------------------------------------- + +@import url("//fonts.googleapis.com/css?family=Bitter:400,700"); +@import url("//fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic"); + +// Navbar ===================================================================== + +.navbar { + font-family: @font-family-serif; + + &-default { + + .dropdown-menu { + background-color: @navbar-default-bg; + + > li > a, + > li > a:focus { + color: @navbar-default-color; + } + + > li > a:hover, + > .active > a, + > .active > a:hover { + background-color: @navbar-default-link-hover-bg; + } + } + } + + &-inverse { + + .dropdown-menu { + background-color: @navbar-inverse-bg; + + > li > a, + > li > a:focus { + color: @navbar-inverse-color; + } + + > li > a:hover, + > .active > a, + > .active > a:hover { + background-color: @navbar-inverse-link-hover-bg; + } + } + } +} + +// Buttons ==================================================================== + +.btn { + font-family: @font-family-serif; +} + +.btn-group { + + .btn ~ .dropdown-toggle { + padding-left: 16px; + padding-right: 16px; + } + + .dropdown-menu { + border-top-width: 0; + } + + &.dropup .dropdown-menu { + border-top-width: 1px; + border-bottom-width: 0; + margin-bottom: 0; + } + + .dropdown-toggle { + + &.btn-default ~ .dropdown-menu { + background-color: @btn-default-bg; + border-color: @btn-default-border; + + > li > a { + color: @btn-default-color; + } + + > li > a:hover { + background-color: darken(@btn-default-bg, 8%); + } + } + + &.btn-primary ~ .dropdown-menu { + background-color: @btn-primary-bg; + border-color: @btn-primary-border; + + > li > a { + color: @btn-primary-color; + } + + > li > a:hover { + background-color: darken(@btn-primary-bg, 8%); + } + } + + &.btn-success ~ .dropdown-menu { + background-color: @btn-success-bg; + border-color: @btn-success-border; + + > li > a { + color: @btn-success-color; + } + + > li > a:hover { + background-color: darken(@btn-success-bg, 8%); + } + } + + &.btn-info ~ .dropdown-menu { + background-color: @btn-info-bg; + border-color: @btn-info-border; + + > li > a { + color: @btn-info-color; + } + + > li > a:hover { + background-color: darken(@btn-info-bg, 8%); + } + } + + &.btn-warning ~ .dropdown-menu { + background-color: @btn-warning-bg; + border-color: @btn-warning-border; + + > li > a { + color: @btn-warning-color; + } + + > li > a:hover { + background-color: darken(@btn-warning-bg, 8%); + } + } + + &.btn-danger ~ .dropdown-menu { + background-color: @btn-danger-bg; + border-color: @btn-danger-border; + + > li > a { + color: @btn-danger-color; + } + + > li > a:hover { + background-color: darken(@btn-danger-bg, 8%); + } + } + } +} + +// Typography ================================================================= + +h1, h2 { + position: relative; + padding: 0.2em 1.2em; + margin-left: 1em; + margin-right: 50px; + margin-bottom: 0.6em; + background-color: @gray-lighter; + color: #fff; + + &:before { + content: "♥"; + position: absolute; + left: -0.3em; + top: -0.42em; + color: @brand-primary; + font-family: @font-family-sans-serif; + font-size: 3.6em; + } + + &:after { + content:""; + position: absolute; + width: 0; + height: 0; + right: 0; + top: 0; + border-top: 0.75em solid transparent; + border-bottom: 0.75em solid transparent; + border-right: 0.75em solid @body-bg; + } +} + +.lead { + font-weight: normal; +} + +.text-primary, +.text-primary:hover { + color: @brand-primary; +} + +.text-success, +.text-success:hover { + color: @brand-success; +} + +.text-danger, +.text-danger:hover { + color: @brand-danger; +} + +.text-warning, +.text-warning:hover { + color: @brand-warning; +} + +.text-info, +.text-info:hover { + color: @brand-info; +} + +// Tables ===================================================================== + +table, +.table { + + > thead > tr > th, + > tbody > tr > th, + > tfoot > tr > th, + > thead > tr > td, + > tbody > tr > td, + > tfoot > tr > td { + border-color: transparent; + } +} + +// Forms ====================================================================== + +legend { + font-family: @font-family-serif; +} + +label { + font-weight: normal; +} + +.help-block { + color: @text-color; +} + +.form-control, +.form-control:focus { + .box-shadow(none); +} + +.has-warning { + .help-block, + .control-label { + color: @brand-warning; + } + + .form-control, + .form-control:focus { + border: 1px solid @brand-warning; + .box-shadow(none); + } +} + +.has-error { + .help-block, + .control-label { + color: @brand-danger; + } + + .form-control, + .form-control:focus { + border: 1px solid @brand-danger; + .box-shadow(none); + } +} + +.has-success { + .help-block, + .control-label { + color: @brand-success; + } + + .form-control, + .form-control:focus { + border: 1px solid @brand-success; + .box-shadow(none); + } +} + +// Navs ======================================================================= + +.dropdown-menu { + margin-top: 0; + border: none; + .box-shadow(none); +} + +.nav-tabs, +.nav-pills { + > li > a { + background-color: @gray-lighter; + color: #fff; + } + + > li > a:hover, + > li > a:focus { + color: #fff; + } + + > li.disabled > a, + > li.disabled > a:hover, + > li.disabled > a:focus { + background-color: @well-bg; + color: @gray-lighter; + } + + .open > a, + .open > a:hover, + .open > a:focus { + border-color: transparent; + } + + > .dropdown > .dropdown-menu { + background-color: @btn-primary-bg; + border-color: @btn-primary-border; + + > li > a { + color: @btn-primary-color; + } + + > li > a:hover { + background-color: darken(@btn-primary-bg, 8%); + } + } +} + +.nav-pills { + > li + li { + margin-left: 0; + } +} + +.nav-stacked { + > li + li { + margin-top: 0; + } +} + +.breadcrumb { + + a { + color: #fff; + } +} + +.pager { + li > a, + li > a:hover, + li > a:focus { + color: #fff; + } + + .disabled > a, + .disabled > a:hover, + .disabled > a:focus, + .disabled > span { + background-color: @pagination-disabled-bg; + } +} + +// Indicators ================================================================= + +.alert, +.panel { + h1, h2 { + background-color: transparent; + margin-right: 0; + padding: 0; + + &:before, + &:after { + content: none; + } + } +} + +// Progress bars ============================================================== + +.progress, +.progress-bar { + .box-shadow(none); +} + +// Containers ================================================================= + +.well, +.jumbotron, +.list-group, +.modal { + h1, h2 { + background-color: transparent; + margin-right: 0; + padding: 0; + + &:before, + &:after { + content: none; + } + } +} + +.well { + .box-shadow(none); +} + +a.list-group-item:hover, +a.list-group-item:focus, +a.list-group-item:hover .list-group-item-heading, +a.list-group-item:focus .list-group-item-heading { + color: #fff; +} + +.panel { + border: none; + .box-shadow(none); + color: #fff; + + &-heading, + &-footer { + position: relative; + text-align: center; + + &:before { + z-index: -100; + content: ""; + position: absolute; + left: 50%; + top: 0; + margin-left: -2em; + margin-top: -1em; + display: inline-block; + width: 4em; + height: 4em; + border-radius: 2em; + background-color: @gray-lighter; + } + } + + &-footer { + + &:before { + top: auto; + bottom: 0; + margin-top: 0; + margin-bottom: -1em; + } + } + + &-body { + color: @text-color; + } + + &-primary .panel-heading:before { + background-color: @brand-primary; + } + + &-success .panel-heading:before { + background-color: @brand-success; + } + + &-warning .panel-heading:before { + background-color: @brand-warning; + } + + &-danger .panel-heading:before { + background-color: @brand-danger; + } + + &-info .panel-heading:before { + background-color: @brand-info; + } + + > .list-group { + color: @text-color; + } +} + +.modal { + &-header { + background-color: @brand-primary; + color: #fff; + + h1, h2, h3, h4, h5, h6 { + color: #fff; + } + } +} + +.popover { + border: none; + border-radius: 0; + padding: 0; + + &-title { + border-radius: 0; + } + + h1, h2, h3, h4, h5, h6 { + color: #fff; + } +} |