diff options
Diffstat (limited to 'app/assets/stylesheets/pages/dev_ops_report.scss')
-rw-r--r-- | app/assets/stylesheets/pages/dev_ops_report.scss | 259 |
1 files changed, 0 insertions, 259 deletions
diff --git a/app/assets/stylesheets/pages/dev_ops_report.scss b/app/assets/stylesheets/pages/dev_ops_report.scss deleted file mode 100644 index 871cd9c4f02..00000000000 --- a/app/assets/stylesheets/pages/dev_ops_report.scss +++ /dev/null @@ -1,259 +0,0 @@ -$space-between-cards: 8px; - -.devops-empty svg { - margin: 64px auto 32px; - max-width: 420px; -} - -.devops-header { - margin-top: $gl-padding; - margin-bottom: $gl-padding; - padding: 0 4px; - display: flex; - align-items: center; - - .devops-header-title { - font-size: 48px; - line-height: 1; - margin: 0; - } - - .devops-header-subtitle { - font-size: 22px; - line-height: 1; - color: $gl-text-color-secondary; - margin-left: 8px; - font-weight: $gl-font-weight-normal; - - .devops-header-icon { - vertical-align: px-to-rem(-$gl-spacing-scale-1); - } - - a { - font-size: 18px; - color: $gl-text-color-secondary; - - &:hover { - color: $blue-500; - } - } - } -} - -.devops-cards { - display: flex; - justify-content: center; - flex-wrap: wrap; -} - -.devops-card-wrapper { - display: flex; - flex-direction: column; - align-items: stretch; - text-align: center; - width: 50%; - border-color: $border-color; - margin: 0 0 32px; - padding: $space-between-cards / 2; - position: relative; - - @include media-breakpoint-up(xs) { - width: percentage(1 / 4); - } - - @include media-breakpoint-up(sm) { - width: percentage(1 / 5); - } - - @include media-breakpoint-up(md) { - width: percentage(1 / 6); - } - - @include media-breakpoint-up(lg) { - width: percentage(1 / 10); - } -} - -.devops-card { - border: solid 1px $border-color; - border-radius: 3px; - border-top-width: 3px; - display: flex; - flex-direction: column; - flex-grow: 1; -} - -.devops-card-low { - border-top-color: $red-400; - - .board-card-score-big { - background-color: $red-50; - } -} - -.devops-card-average { - border-top-color: $orange-200; - - .board-card-score-big { - background-color: $orange-50; - } -} - -.devops-card-high { - border-top-color: $green-400; - - .board-card-score-big { - background-color: $green-50; - } -} - -.devops-card-title { - margin: $gl-padding auto auto; - max-width: 100px; - - h3 { - font-size: 14px; - margin: 0 0 2px; - } - - .light-text { - font-size: 13px; - line-height: 1.25; - color: $gl-text-color-secondary; - } -} - -.board-card-scores { - display: flex; - justify-content: space-around; - align-items: center; - margin: $gl-padding $gl-btn-padding; - line-height: 1; -} - -.board-card-score { - color: $gl-text-color-secondary; - - .board-card-score-name { - font-size: 13px; - margin-top: 4px; - } -} - -.board-card-score-value { - font-size: 16px; - color: $gl-text-color; - font-weight: $gl-font-weight-normal; -} - -.board-card-score-big { - border-top: 2px solid $border-color; - border-bottom: 1px solid $border-color; - font-size: 22px; - padding: 10px 0; - font-weight: $gl-font-weight-normal; -} - -.board-card-buttons { - display: flex; - - > * { - font-size: 16px; - color: $gl-text-color-secondary; - padding: 10px; - flex-grow: 1; - - &:hover { - background-color: $border-color; - color: $gl-text-color; - } - - + * { - border-left: solid 1px $border-color; - } - } -} - -.devops-steps { - margin-top: $gl-padding; - height: 1px; - min-width: 100%; - justify-content: space-around; - position: relative; - background: $border-color; -} - -.devops-step { - $step-positions: 5% 10% 30% 42% 48% 55% 60% 70% 75% 90%; - @each $pos in $step-positions { - $i: index($step-positions, $pos); - - &:nth-child(#{$i}) { - left: $pos; - } - } - - position: absolute; - transform-origin: 75% 50%; - padding: 8px; - height: 50px; - width: 50px; - border-radius: 3px; - display: flex; - flex-direction: column; - align-items: center; - border: solid 1px $border-color; - background: $white; - transform: translate(-50%, -50%); - color: $gl-text-color-secondary; - fill: $gl-text-color-secondary; - box-shadow: 0 2px 4px $dropdown-shadow-color; - - &:hover { - padding: 8px 10px; - fill: currentColor; - z-index: 100; - height: auto; - width: auto; - - .devops-step-title { - max-height: 2em; - opacity: 1; - transition: opacity 0.2s; - } - - svg { - transform: scale(1.5); - margin: $gl-btn-padding; - } - } - - svg { - transition: transform 0.1s; - width: 30px; - height: 30px; - min-height: 30px; - min-width: 30px; - } -} - -.devops-step-title { - max-height: 0; - opacity: 0; - text-transform: uppercase; - margin: $gl-vert-padding 0 0; - text-align: center; - font-size: 12px; -} - -.devops-high-score { - color: $green-400; -} - -.devops-average-score { - color: $orange-500; -} - -.devops-low-score { - color: $red-400; -} |