/** COLORS **/ .cgray { color: $common-gray; } .clgray { color: $common-gray-light; } .cred { color: $common-red; } .cgreen { color: $common-green; } .cdark { color: $common-gray-dark; } /** COMMON CLASSES **/ .prepend-top-0 { margin-top: 0; } .prepend-top-5 { margin-top: 5px; } .prepend-top-10 { margin-top: 10px; } .prepend-top-default { margin-top: $gl-padding !important; } .prepend-top-20 { margin-top: 20px; } .prepend-left-4 { margin-left: 4px; } .prepend-left-5 { margin-left: 5px; } .prepend-left-10 { margin-left: 10px; } .prepend-left-default { margin-left: $gl-padding; } .prepend-left-20 { margin-left: 20px; } .append-right-5 { margin-right: 5px; } .append-right-8 { margin-right: 8px; } .append-right-10 { margin-right: 10px; } .append-right-default { margin-right: $gl-padding; } .append-right-20 { margin-right: 20px; } .append-bottom-0 { margin-bottom: 0; } .append-bottom-5 { margin-bottom: 5px; } .append-bottom-10 { margin-bottom: 10px; } .append-bottom-15 { margin-bottom: 15px; } .append-bottom-20 { margin-bottom: 20px; } .append-bottom-default { margin-bottom: $gl-padding; } .inline { display: inline-block; } .center { text-align: center; } .vertical-align-middle { vertical-align: middle; } .underlined-link { text-decoration: underline; } .hint { font-style: italic; color: $hint-color; } .light { color: $common-gray; } .slead { color: $common-gray; font-size: 14px; margin-bottom: 12px; font-weight: $gl-font-weight-normal; line-height: 24px; } .bold { font-weight: $gl-font-weight-bold; } .tab-content { overflow: visible; } pre { &.clean { background: none; border: none; margin: 0; padding: 0; } &.well-pre { border: 1px solid $well-pre-bg; background: $gray-light; border-radius: 0; color: $well-pre-color; } &.wrap { word-break: break-word; white-space: pre-wrap; } } hr { margin: 24px 0; border-top: 1px solid darken($gray-normal, 8%); } .str-truncated { @include str-truncated; } .block-truncated { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; > div, .str-truncated { display: inline; } } .item-title { font-weight: $gl-font-weight-bold; } /** FLASH message **/ .author_link, .author-link { color: $gl-link-color; } .back-link { font-size: 14px; } table a code { position: relative; top: -2px; margin-right: 3px; } .loading { margin: 20px auto; height: 40px; color: $loading-color; font-size: 32px; text-align: center; } span.update-author { display: block; color: $update-author-color; font-weight: $gl-font-weight-normal; font-style: italic; strong { font-weight: $gl-font-weight-bold; font-style: normal; } } .field_with_errors { display: inline; } p.time { color: $time-color; font-size: 90%; margin: 30px 3px 3px 2px; } .highlight { text-shadow: none; } .thin_area { height: 150px; } // Fix issue with notes & lists creating a bunch of bottom borders. li.note { img { max-width: 100%; } .note-title { li { border-bottom: none !important; } } } .markdown { img { max-width: 100%; } } .wiki_content code, .readme code { background-color: inherit; } .project_member_show { td:first-child { color: $project-member-show-color; } } .rss-icon { img { width: 24px; vertical-align: top; } strong { line-height: 24px; } } .show-suppressed-diff, .show-all-commits { cursor: pointer; } .git_error_tips { @extend .col-md-6; text-align: left; margin-top: 40px; pre { background: $white-light; border: none; font-size: 12px; } } .error-message { padding: 10px; background: $error-bg; margin: 0; color: $white-light; a { color: $white-light; text-decoration: underline; } } .browser-alert { padding: 10px; text-align: center; background: $error-bg; color: $white-light; font-weight: $gl-font-weight-bold; a { color: $white-light; text-decoration: underline; } } .warning_message { border-left: 4px solid $warning-message-border; color: $warning-message-color; padding: 10px; margin-bottom: 10px; background: $warning-message-bg; padding-left: 20px; &.centered { text-align: center; } } .gitlab-promo { a { color: $gl-promo-color; margin-right: 30px; } } .milestone { &.milestone-closed { background: $gray-light; } .progress { margin-bottom: 0; margin-top: 4px; box-shadow: none; background-color: $border-gray-light; } } .control-group { .controls { span { &.descr { position: relative; top: 2px; left: 5px; color: $control-group-descr-color; } } } } img.emoji { height: 20px; vertical-align: top; width: 20px; margin-top: 1px; } .chart { overflow: hidden; height: 220px; } .description-block { @extend .light-well; @extend .light; margin-bottom: 10px; } table { td.permission-x { background: $table-permission-x-bg !important; text-align: center; } } .btn-sign-in { text-shadow: none; @media (min-width: $screen-sm-min) { margin-top: 8px; } } .side-filters { fieldset { margin-bottom: 15px; } } .footer-links { margin-bottom: 20px; a { margin-right: 15px; } } .well { margin-bottom: $gl-padding; hr { border-color: $gray-darker; } } .search_box { @extend .well; text-align: center; } .header-with-avatar { h3 { margin: 0; font-weight: $gl-font-weight-bold; } .username { font-size: 18px; color: $username-color; margin-top: 8px; } .description { font-size: $gl-font-size; color: $description-color; margin-top: 8px; } } .profiler-results { top: 73px !important; .profiler-button, .profiler-controls { border-color: $profiler-border !important; } } .dropzone .dz-preview .dz-progress { border-color: $border-color !important; } .dropzone .dz-preview .dz-progress .dz-upload { background: $gl-success !important; } .dz-message { margin: 0; } .space-right { margin-right: 10px; } .alert, .progress { margin-bottom: $gl-padding; } .project-item-select-holder { display: inline-block; position: relative; .project-item-select { position: absolute; top: 0; right: 0; min-width: 250px; visibility: hidden; } } .content-separator { margin-left: -$gl-padding; margin-right: -$gl-padding; border-top: 1px solid $border-color; } .hide-bottom-border { border-bottom: none !important; } .gl-accessibility { &:focus { display: flex; align-items: center; top: 1px; left: 1px; width: auto; height: 100%; padding: 0 10px; clip: auto; text-decoration: none; color: $gl-text-color; background: $gray-light; z-index: 1; } } .bordered-box { border: 1px solid $border-color; border-radius: $border-radius-default; } .str-truncated { &-60 { @include str-truncated(60%); } &-100 { @include str-truncated(100%); } } .tooltip { .tooltip-inner { word-wrap: break-word; } } .disabled-content { pointer-events: none; opacity: .5; }