/* * General: Miscellaneous * ---------------------- */ // 10px padding and margins .pad { padding: 10px; } .margin { margin: 10px; } .margin-bottom { margin-bottom: 20px; } // Display inline .inline { display: inline; width: auto; } // Description Blocks .description-block { display: block; margin: 10px 0; text-align: center; &.margin-bottom { margin-bottom: 25px; } > .description-header { margin: 0; padding: 0; font-weight: 600; font-size: 16px; } > .description-text { text-transform: uppercase; } } // Background colors .bg-red, .bg-yellow, .bg-aqua, .bg-blue, .bg-light-blue, .bg-green, .bg-navy, .bg-teal, .bg-olive, .bg-lime, .bg-orange , .bg-fuchsia, .bg-purple, .bg-maroon, .bg-black, .bg-red-active, .bg-yellow-active, .bg-aqua-active, .bg-blue-active, .bg-light-blue-active, .bg-green-active, .bg-navy-active, .bg-teal-active, .bg-olive-active, .bg-lime-active, .bg-orange-active, .bg-fuchsia-active, .bg-purple-active, .bg-maroon-active, .bg-black-active { color: #fff !important; } .bg-gray { color: #000; background-color: $gray !important; } .bg-black { background-color: $black !important; } .bg-red { background-color: $red !important; } .bg-yellow { background-color: $yellow !important; } .bg-aqua { background-color: $aqua !important; } .bg-blue { background-color: $blue !important; } .bg-light-blue { background-color: $light-blue !important; } .bg-green { background-color: $green !important; } .bg-navy { background-color: $navy !important; } .bg-teal { background-color: $teal !important; } .bg-olive { background-color: $olive !important; } .bg-lime { background-color: $lime !important; } .bg-orange { background-color: $orange !important; } .bg-fuchsia { background-color: $fuchsia !important; } .bg-purple { background-color: $purple !important; } .bg-maroon { background-color: $maroon !important; } //Set of Active Background Colors .bg-gray-active { color: #000; background-color: darken($gray,10%)!important; } .bg-black-active { background-color: darken($black, 10%)!important; } .bg-red-active { background-color: darken($red , 6%)!important; } .bg-yellow-active { background-color: darken($yellow , 6%)!important; } .bg-aqua-active { background-color: darken($aqua , 6%)!important; } .bg-blue-active { background-color: darken($blue , 10%)!important; } .bg-light-blue-active { background-color: darken($light-blue , 6%)!important; } .bg-green-active { background-color: darken($green , 5%)!important; } .bg-navy-active { background-color: darken($navy , 2%)!important; } .bg-teal-active { background-color: darken($teal , 5%)!important; } .bg-olive-active { background-color: darken($olive , 5%)!important; } .bg-lime-active { background-color: darken($lime , 5%)!important; } .bg-orange-active { background-color: darken($orange , 5%)!important; } .bg-fuchsia-active { background-color: darken($fuchsia , 5%)!important; } .bg-purple-active { background-color: darken($purple , 5%)!important; } .bg-maroon-active { background-color: darken($maroon , 3%)!important; } //Disabled! [class^="bg-"].disabled { @include opacity(.65); } // Text colors .text-red { color: $red !important; } .text-yellow { color: $yellow !important; } .text-aqua { color: $aqua !important; } .text-blue { color: $blue !important; } .text-black { color: $black!important; } .text-light-blue { color: $light-blue !important; } .text-green { color: $green !important; } .text-gray { color: $gray !important; } .text-navy { color: $navy !important; } .text-teal { color: $teal !important; } .text-olive { color: $olive !important; } .text-lime { color: $lime !important; } .text-orange { color: $orange !important; } .text-fuchsia { color: $fuchsia !important; } .text-purple { color: $purple !important; } .text-maroon { color: $maroon !important; } // Hide elements by display none only .hide { display: none !important; } // Remove borders .no-border { border: 0px !important; } // Remove padding .no-padding { padding: 0px !important; } // Remove margins .no-margin { margin: 0px !important; } // Remove box shadow .no-shadow { box-shadow: none!important; } // Unstyled List .list-unstyled { list-style: none; margin: 0; padding: 0; } // Remove border radius .flat { @include border-radius-same(0 !important); } .text-bold { &, &.table td, &.table th { font-weight: 700; } } // _fix for sparkline tooltip .jqstooltip{ padding: 5px!important; width:auto!important; height:auto!important; } // Gradient Background colors .bg-teal-gradient { @include gradient($teal, $teal, lighten($teal, 16%)); color: #fff; } .bg-light-blue-gradient { @include gradient($light-blue, $light-blue, lighten($light-blue, 12%)); color: #fff; } .bg-blue-gradient { @include gradient($blue, $blue, lighten($blue, 7%)); color: #fff; } .bg-aqua-gradient { @include gradient($aqua, $aqua, lighten($aqua, 7%)); color: #fff; } .bg-yellow-gradient { @include gradient($yellow, $yellow, lighten($yellow, 16%)); color: #fff; } .bg-purple-gradient { @include gradient($purple, $purple, lighten($purple, 16%)); color: #fff; } .bg-green-gradient { @include gradient($green, $green, lighten($green, 7%)); color: #fff; } .bg-red-gradient { @include gradient($red, $red, lighten($red, 10%)); color: #fff; } .bg-black-gradient { @include gradient($black, $black, lighten($black, 10%)); color: #fff; } .bg-maroon-gradient { @include gradient($maroon, $maroon, lighten($maroon, 10%)); color: #fff; } .connectedSortable { min-height: 100px; } .ui-helper-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .sort-highlight { background: #f4f4f4; border: 1px dashed #ddd; margin-bottom: 10px; } .full-opacity-hover { @include opacity(.65); &:hover { @include opacity(1); } } // Charts .chart { position: relative; overflow: hidden; width: 100%; svg, canvas { width: 100%!important; } }