diff options
-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 | ||||
-rw-r--r-- | changelogs/unreleased/48804-redesign-gcp-banner.yml | 5 | ||||
-rw-r--r-- | locale/gitlab.pot | 8 |
5 files changed, 28 insertions, 48 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 diff --git a/changelogs/unreleased/48804-redesign-gcp-banner.yml b/changelogs/unreleased/48804-redesign-gcp-banner.yml new file mode 100644 index 00000000000..729f959badc --- /dev/null +++ b/changelogs/unreleased/48804-redesign-gcp-banner.yml @@ -0,0 +1,5 @@ +--- +title: Redesign GCP offer banner +merge_request: +author: +type: changed diff --git a/locale/gitlab.pot b/locale/gitlab.pot index 8e23383609f..a5f97e9548a 100644 --- a/locale/gitlab.pot +++ b/locale/gitlab.pot @@ -8,6 +8,8 @@ msgid "" msgstr "" "Project-Id-Version: gitlab 1.0.0\n" "Report-Msgid-Bugs-To: \n" +"POT-Creation-Date: 2018-07-10 16:02-0700\n" +"PO-Revision-Date: 2018-07-10 16:02-0700\n" "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n" "Language-Team: LANGUAGE <LL@li.org>\n" "Language: \n" @@ -1245,6 +1247,9 @@ msgstr "" msgid "ClusterIntegration|Create Kubernetes cluster" msgstr "" +msgid "ClusterIntegration|Did you know?" +msgstr "" + msgid "ClusterIntegration|Enter the details for your Kubernetes cluster" msgstr "" @@ -1407,9 +1412,6 @@ msgstr "" msgid "ClusterIntegration|Read our %{link_to_help_page} on Kubernetes cluster integration." msgstr "" -msgid "ClusterIntegration|Redeem up to $500 in free credit for Google Cloud Platform" -msgstr "" - msgid "ClusterIntegration|Remove Kubernetes cluster integration" msgstr "" |