diff options
| author | Ezekiel Kigbo <ekigbo@gitlab.com> | 2019-09-06 01:04:00 +1000 |
|---|---|---|
| committer | Ezekiel Kigbo <ekigbo@gitlab.com> | 2019-09-10 18:03:18 +1000 |
| commit | 1f67ae937f162c6f8723ab487d81d9b2f468cc15 (patch) | |
| tree | d556fb95834bf6003f9159ab3afe11cb47ebd6cf | |
| parent | 5d081b02f57b75f55d618c0e1c11e0acb22ac067 (diff) | |
| download | gitlab-ce-13076-add-stage-button.tar.gz | |
Replace custom css class with utilities13076-add-stage-button
Replaces the .stage-ghost class with
custom utility css classes based on
maintainer review feedback
| -rw-r--r-- | app/assets/javascripts/cycle_analytics/components/stage_card_list_item.vue | 5 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/cycle_analytics.scss | 14 | ||||
| -rw-r--r-- | app/assets/stylesheets/utilities.scss | 6 |
3 files changed, 10 insertions, 15 deletions
diff --git a/app/assets/javascripts/cycle_analytics/components/stage_card_list_item.vue b/app/assets/javascripts/cycle_analytics/components/stage_card_list_item.vue index d946594a069..63549596fac 100644 --- a/app/assets/javascripts/cycle_analytics/components/stage_card_list_item.vue +++ b/app/assets/javascripts/cycle_analytics/components/stage_card_list_item.vue @@ -23,7 +23,10 @@ export default { </script> <template> - <div :class="{ active: isActive }" class="stage-nav-item d-flex pl-4 pr-4 m-0 mb-1 ml-2 rounded"> + <div + :class="{ active: isActive }" + class="stage-nav-item d-flex pl-4 pr-4 m-0 mb-1 ml-2 rounded border-color-default border-style-solid border-width-1px" + > <slot></slot> <div v-if="canEdit" class="dropdown"> <gl-button diff --git a/app/assets/stylesheets/pages/cycle_analytics.scss b/app/assets/stylesheets/pages/cycle_analytics.scss index c504c7c99b6..e20711a193d 100644 --- a/app/assets/stylesheets/pages/cycle_analytics.scss +++ b/app/assets/stylesheets/pages/cycle_analytics.scss @@ -145,7 +145,6 @@ .stage-nav-item { line-height: 65px; - border: 1px solid $border-color; &.active { background: $blue-50; @@ -172,19 +171,6 @@ color: $gl-text-color-secondary; } } - - // EE-specific start - .stage-ghost.stage-nav-item { - border: dashed 1px $border-color; - - &.active { - font-weight: bold; - background: $blue-50; - border: solid 1px $blue-300; - box-shadow: inset 4px 0 0 0 $blue-500; - } - } - // EE-specific end } .stage-panel-container { diff --git a/app/assets/stylesheets/utilities.scss b/app/assets/stylesheets/utilities.scss index 3648ec5e239..d2906ce0780 100644 --- a/app/assets/stylesheets/utilities.scss +++ b/app/assets/stylesheets/utilities.scss @@ -15,3 +15,9 @@ font-size: $size; } } + +.border-width-1px { border-width: 1px; } +.border-style-dashed { border-style: dashed; } +.border-style-solid { border-style: solid; } +.border-color-blue-300 { border-color: $blue-300; } +.border-color-default { border-color: $border-color; } |