diff options
author | Mike Greiling <mike@pixelcog.com> | 2018-07-18 00:56:17 +0300 |
---|---|---|
committer | Mike Greiling <mike@pixelcog.com> | 2018-07-18 00:56:17 +0300 |
commit | 489025bbdd449948e67e305e53a638d1e81ecc84 (patch) | |
tree | 2959d8f0983f3fa7ef94165a0c71c2b74bdf9191 /app | |
parent | cb1a827e85d3b05a7e80ddf5674af45f3dbb0e53 (diff) | |
parent | c2c8f25ebf88c17ee817657a5ea36362e3893798 (diff) |
Merge branch '48804-redesign-gcp-banner' into 'master'
Resolve "Redesign GCP banner"
Closes #48804
See merge request gitlab-org/gitlab-ce!20542
Diffstat (limited to 'app')
-rw-r--r-- | app/assets/stylesheets/framework/variables.scss | 1 | ||||
-rw-r--r-- | app/assets/stylesheets/pages/clusters.scss | 48 | ||||
-rw-r--r-- | app/views/projects/clusters/_gcp_signup_offer_banner.html.haml | 14 |
3 files changed, 18 insertions, 45 deletions
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss index 6cfa09b56a7..6c2fdbe0608 100644 --- a/app/assets/stylesheets/framework/variables.scss +++ b/app/assets/stylesheets/framework/variables.scss @@ -297,7 +297,6 @@ $performance-bar-height: 35px; $flash-height: 52px; $context-header-height: 60px; $breadcrumb-min-height: 48px; -$gcp-signup-offer-icon-max-width: 125px; /* * Common component specific colors diff --git a/app/assets/stylesheets/pages/clusters.scss b/app/assets/stylesheets/pages/clusters.scss index 56beb7718a4..0f22fe21143 100644 --- a/app/assets/stylesheets/pages/clusters.scss +++ b/app/assets/stylesheets/pages/clusters.scss @@ -32,49 +32,23 @@ } .gcp-signup-offer { - background-color: $blue-50; - border: 1px solid $blue-300; - border-radius: $border-radius-default; + border-left-color: $blue-500; - // TODO: To be superceded by cssLab - &.alert { - padding: 24px 16px; - - &-dismissable { - padding-right: 32px; - - .close { - top: -8px; - right: -16px; - color: $blue-500; - opacity: 1; - } - } - } - - .gcp-logo { - margin-bottom: $gl-padding; - text-align: center; - } - - img { - max-width: $gcp-signup-offer-icon-max-width; + svg { + fill: $blue-500; + vertical-align: middle; } - a:not(.btn) { - color: $gl-link-color; - font-weight: normal; - text-decoration: none; - } + .gcp-signup-offer--content { + display: flex; - @include media-breakpoint-up(sm) { - > div { - display: flex; - align-items: center; + h4 { + font-size: 16px; + line-height: 24px; } - .gcp-logo { - margin: 0; + .gcp-signup-offer--icon { + align-self: flex-start; } } } diff --git a/app/views/projects/clusters/_gcp_signup_offer_banner.html.haml b/app/views/projects/clusters/_gcp_signup_offer_banner.html.haml index 9298d93663d..73b11d509d3 100644 --- a/app/views/projects/clusters/_gcp_signup_offer_banner.html.haml +++ b/app/views/projects/clusters/_gcp_signup_offer_banner.html.haml @@ -1,12 +1,12 @@ - link = link_to(s_('ClusterIntegration|sign up'), 'https://console.cloud.google.com/freetrial?utm_campaign=2018_cpanel&utm_source=gitlab&utm_medium=referral', target: '_blank', rel: 'noopener noreferrer') -.gcp-signup-offer.alert.alert-block.alert-dismissable.prepend-top-default.append-bottom-default{ role: 'alert' } +.bs-callout.gcp-signup-offer.alert.alert-block.alert-dismissable.prepend-top-default.append-bottom-default{ role: 'alert' } %button.close{ type: "button", data: { feature_id: UserCalloutsHelper::GCP_SIGNUP_OFFER, dismiss_endpoint: user_callouts_path } } × - %div - .col-sm-2.gcp-logo - = image_tag 'illustrations/logos/google-cloud-platform_logo.svg' - .col-sm-10 - %h4= s_('ClusterIntegration|Redeem up to $500 in free credit for Google Cloud Platform') + .gcp-signup-offer--content + .gcp-signup-offer--icon.append-right-8 + = sprite_icon("information", size: 16) + .gcp-signup-offer--copy + %h4= s_('ClusterIntegration|Did you know?') %p= s_('ClusterIntegration|Every new Google Cloud Platform (GCP) account receives $300 in credit upon %{sign_up_link}. In partnership with Google, GitLab is able to offer an additional $200 for both new and existing GCP accounts to get started with GitLab\'s Google Kubernetes Engine Integration.').html_safe % { sign_up_link: link } - %a.btn.btn-info{ href: 'https://goo.gl/AaJzRW', target: '_blank', rel: 'noopener noreferrer' } + %a.btn.btn-default{ href: 'https://goo.gl/AaJzRW', target: '_blank', rel: 'noopener noreferrer' } Apply for credit |