// Desktop // global styles that apply to the Discourse application specifically // BEWARE: changing these styles implies they take effect anywhere they are seen // throughout the Discourse application // Base Elements body.widget-dragging { cursor: ns-resize; } header { margin-bottom: 15px; } // Common classes .boxed { height: 100%; } .topic-statuses { float: left; padding: 0; .topic-status { padding: 0 2px 0 0; margin: 0; line-height: $line-height-small; i { font-size: $font-down-1; } } .d-icon-envelope { color: $danger; } } .form-vertical { .control-group { margin-bottom: 24px; } } /***********************/ /* bootstrap carryover */ /***********************/ code, pre { font-family: Consolas, Menlo, Monaco, "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Courier New", monospace; } // this removes the unwanted top margin on a paragraph under a heading h1, h2, h3, h4, h5, h6 { + p { margin-top:0; } } form { margin: 0 0 18px; } label, input, button, select, textarea { font-size: $font-0; font-weight: normal; line-height: $line-height-medium; } select, textarea { display: inline-block; padding: 4px; margin-bottom: 9px; font-size: $font-0; line-height: $line-height-large; color: $primary; } input, textarea { width: 210px; } select, input[type="file"] { line-height: $line-height-large; } select { width: 220px; &[multiple], &[size] { height: auto; } } input, textarea { margin-left: 0; } input { &[type="radio"], &[type="checkbox"] { &[disabled], &[readonly] { background-color: transparent; } } } .input { &-xxlarge { width: 530px; } &-prepend, &-append { margin-bottom: 5px; input[class*="span"] { display: inline-block; } input, select { position: relative; margin-bottom: 0; vertical-align: middle; &:focus { z-index: z("base") + 1; } } .add-on { display: inline-block; width: auto; height: 18px; min-width: 16px; padding: 4px 5px; font-weight: normal; line-height: $line-height-medium; text-align: center; vertical-align: middle; background-color: $secondary; border: 1px solid $primary-low; } .add-on, .btn { margin-left: -1px; border-radius: 0; } .active { background-color: $danger-medium; border-color: $danger; } } &-prepend { .add-on, .btn { margin-right: -1px; &:first-child { border-radius: 3px 0 0 3px; } } } &-append { input, select { border-radius: 3px 0 0 3px; } .add-on, .btn { &:last-child { border-radius: 0 3px 3px 0; } } } } .input-prepend.input-append { input, select { border-radius: 0; background-color: $primary-low; border-color: $primary-low; } .add-on, .btn { &:first-child { margin-right: -1px; border-radius: 3px 0 0 3px; } } .add-on, .btn { &:last-child { margin-left: -1px; border-radius: 0 3px 3px 0; } } } .controls-dropdown { margin-bottom: 10px; } .control-group { margin-bottom: 9px; &.warning, &.error { > label { color: $danger; } .checkbox, .radio, input, select, textarea { color: $danger; border-color: $danger; &:focus { border-color: scale-color($danger, $lightness: -30%); box-shadow: shadow("focus-danger"); } } } &.warning { .input-prepend, .input-append { .add-on { color: $danger; background-color: $danger; border-color: $danger; } } } &.error { .input-prepend, .input-append { .add-on { color: $danger; background-color: $danger-medium; border-color: scale-color($danger, $lightness: -20%); } } } &.success { > label { color: $success; } .checkbox, .radio, input, select, textarea { color: $success; border-color: $success; &:focus { border-color: $success; box-shadow: shadow("focus"); } } .input-prepend, .input-append { .add-on { color: $success; background-color: $success-low; border-color: $success; } } } } .form-horizontal { .hide { display: none; } input, textarea, select, .input-prepend, .input-append { display: inline-block; margin-bottom: 0; } .control-group { @include clearfix; margin-bottom: 18px; } .control-indent { margin-left: 20px; margin-bottom: 10px; } .control-label { margin: 6.5px; float: left; width: 140px; text-align: right; font-weight: bold; } .controls { margin-left: 160px; } } .bootbox.modal { .modal-footer { a.btn-primary { color: $secondary; } } } /* bootstrap columns */ .row { @include clearfix; } .offset { &2 { margin-left: 116px; } &1 { margin-left: 64px; } } // Media Queries @media all and (max-width : 570px) { body { min-width: 0; } .wrap, .full-width { min-width: 0; } }