.suggest-colors { margin-top: 5px; a { border-radius: 4px; width: 30px; height: 30px; display: inline-block; margin-right: 10px; margin-bottom: 10px; text-decoration: none; } &.suggest-colors-dropdown { margin-top: 10px; margin-bottom: 10px; border-radius: $border-radius-base; overflow: hidden; a { border-radius: 0; width: (100% / 7); margin-right: 0; margin-bottom: -5px; } } } .dropdown-new-label { .dropdown-content { max-height: 260px; } } .dropdown-label-color-input { position: relative; margin-bottom: 10px; &.is-active { padding-left: 32px; } } .dropdown-label-color-preview { position: absolute; left: 0; top: 0; width: 32px; height: 32px; border-top-left-radius: $border-radius-base; border-bottom-left-radius: $border-radius-base; } .label-row { .label-name { display: inline-block; margin-bottom: 10px; @media (min-width: $screen-sm-min) { width: 200px; margin-bottom: 0; } .label { overflow: hidden; text-overflow: ellipsis; vertical-align: middle; max-width: 100%; } } .label-type { display: block; margin-bottom: 10px; margin-left: 50px; @media (min-width: $screen-sm-min) { display: inline-block; width: 100px; margin-left: 10px; margin-bottom: 0; vertical-align: middle; } } .label-description { display: block; margin-bottom: 10px; margin-left: 50px; @media (min-width: $screen-sm-min) { display: inline-block; width: 30%; margin-left: 10px; margin-bottom: 0; vertical-align: middle; } } .label { padding: 8px 9px 9px; font-size: 14px; } } .color-label { padding: 3px $label-padding; border-radius: $label-border-radius; } .dropdown-labels-error { padding: 5px 10px; margin-bottom: 10px; background-color: $gl-danger; color: $white-light; } .manage-labels-list { @include new-style-dropdown; > li:not(.empty-message):not(.is-not-draggable) { background-color: $white-light; cursor: move; cursor: -webkit-grab; cursor: -moz-grab; &:active { cursor: -webkit-grabbing; cursor: -moz-grabbing; } &.sortable-ghost { opacity: 0.3; } } .btn-action { color: $gl-text-color; .fa { font-size: 18px; vertical-align: middle; pointer-events: none; } &:hover { color: $gl-link-color; &.remove-row { color: $gl-danger; } } } .dropdown { @media (min-width: $screen-sm-min) { float: right; } } } .draggable-handler { display: inline-block; opacity: 0; transition: opacity .3s; color: $gray-darkest; } .prioritized-labels { margin-bottom: 30px; .add-priority { display: none; color: $gray-light; } li:hover { .draggable-handler { display: inline-block; opacity: 1; } } } .other-labels { .remove-priority { display: none; } } .toggle-priority { display: inline-block; vertical-align: middle; button { border-color: transparent; padding: 5px 8px; vertical-align: top; font-size: 14px; &:hover { border-color: transparent; } } } .filtered-labels { font-size: 0; padding: 12px 16px; .label-row { margin-top: 4px; margin-bottom: 4px; &:not(:last-child) { margin-right: 8px; } } .label-remove { border-left: 1px solid $label-remove-border; z-index: 3; border-radius: $label-border-radius; padding: 6px 10px 6px 9px; &:hover { box-shadow: inset 0 0 0 80px $label-remove-border; } } .btn { color: inherit; } a.btn { padding: 0; .has-tooltip { top: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; line-height: 1.1; } } } .label-options-toggle { width: 100%; } .label-subscription { vertical-align: middle; .dropdown-group-label a { cursor: pointer; } } .label-subscribe-button { .label-subscribe-button-icon { &[disabled] { opacity: 0.5; pointer-events: none; } } .label-subscribe-button-loading { display: none; } &.disabled { .label-subscribe-button-icon { display: none; } .label-subscribe-button-loading { display: block; } } } .label-link { display: inline-block; vertical-align: top; .label { vertical-align: inherit; } }