diff options
author | Filipa Lacerda <filipa@gitlab.com> | 2019-03-11 12:07:56 +0300 |
---|---|---|
committer | John Jarvis <jarv@gitlab.com> | 2019-03-19 18:24:40 +0300 |
commit | d9d9d6ea01c5856a02c001011c1dd99dc3678243 (patch) | |
tree | 0652e7907ad9281a4af4e79e388186371eea8418 /app/assets | |
parent | 37dd88acbb25204292c32d50b15e60c64c93c823 (diff) |
Merge branch '7861-cross-project-pipeline-dashboard-mvc-ce-backport' into 'master'
Backport EE CSS addition
See merge request gitlab-org/gitlab-ce!25874
Diffstat (limited to 'app/assets')
-rw-r--r-- | app/assets/stylesheets/components/dashboard_skeleton.scss | 80 |
1 files changed, 80 insertions, 0 deletions
diff --git a/app/assets/stylesheets/components/dashboard_skeleton.scss b/app/assets/stylesheets/components/dashboard_skeleton.scss new file mode 100644 index 00000000000..42ede599bc6 --- /dev/null +++ b/app/assets/stylesheets/components/dashboard_skeleton.scss @@ -0,0 +1,80 @@ +.dashboard-cards { + margin-right: -$gl-padding-8; + margin-left: -$gl-padding-8; +} + +.dashboard-card { + &-header { + &-warning { + background-color: $orange-100; + } + + &-failed { + background-color: $red-100; + } + } + + &-body { + height: 120px; + + &-warning { + background-color: $orange-50; + } + + &-failed { + background-color: $red-50; + } + } + + &-time-ago { + &-icon { + color: $gray-500; + } + } + + &-footer { + border-radius: $gl-padding; + height: $gl-padding-32; + + &-failed { + background-color: $red-100; + } + + &-arrow { + color: $gray-300; + } + + &-downstream { + margin-right: -$gl-padding-8; + } + + &-extra { + background-color: $gray-400; + font-size: 10px; + line-height: $gl-line-height; + width: $gl-padding; + } + } + + &-skeleton-info { + border-radius: $gl-padding; + height: $gl-padding; + overflow: hidden; + + &::after { + content: ' '; + display: block; + animation: blockTextShine 1s linear infinite forwards; + background-repeat: no-repeat; + background-size: cover; + background-image: linear-gradient(to right, + $gray-100 0%, + $gray-50 20%, + $gray-100 40%, + $gray-100 100%); + border-radius: $gl-padding; + height: $gl-padding; + margin-top: -$gl-padding-8; + } + } +} |