diff --git a/app/assets/javascripts/clusters/components/gcp_signup_offer.js b/app/assets/javascripts/clusters/components/gcp_signup_offer.js index 38663bd4898..04b778c6be9 100644 --- a/app/assets/javascripts/clusters/components/gcp_signup_offer.js +++ b/app/assets/javascripts/clusters/components/gcp_signup_offer.js @@ -4,5 +4,5 @@ export default function gcpSignupOffer() { const alertEl = document.querySelector('.gcp-signup-offer'); if (!alertEl) return; - new PersistentUserCallout(alertEl).init(); + new PersistentUserCallout(alertEl); } diff --git a/app/assets/javascripts/pages/root/index.js b/app/assets/javascripts/pages/root/index.js new file mode 100644 index 00000000000..bb3e672a000 --- /dev/null +++ b/app/assets/javascripts/pages/root/index.js @@ -0,0 +1 @@ +import '../dashboard/projects/index'; diff --git a/app/assets/javascripts/persistent_user_callout.js b/app/assets/javascripts/persistent_user_callout.js index d136b3bfee9..1e34e74a152 100644 --- a/app/assets/javascripts/persistent_user_callout.js +++ b/app/assets/javascripts/persistent_user_callout.js @@ -8,6 +8,8 @@ export default class PersistentUserCallout { this.container = container; this.dismissEndpoint = dismissEndpoint; this.featureId = featureId; + + this.init(); } init() { diff --git a/app/helpers/dashboard_helper.rb b/app/helpers/dashboard_helper.rb index 19aa55a8d49..7a0e2135b94 100644 --- a/app/helpers/dashboard_helper.rb +++ b/app/helpers/dashboard_helper.rb @@ -19,6 +19,29 @@ module DashboardHelper links.any? { |link| dashboard_nav_link?(link) } end + def controller_action_to_child_dashboards(controller = controller_name, action = action_name) + case "#{controller}##{action}" + when 'projects#index', 'root#index', 'projects#starred', 'projects#trending' + ['projects', 'stars'] + when 'dashboard#activity' + ['starred_project_activity', 'project_activity'] + when 'groups#index' + ['groups'] + when 'todos#index' + ['todos'] + when 'dashboard#issues' + ['issues'] + when 'dashboard#merge_requests' + ['merge_requests'] + else + [] + end + end + + def is_default_dashboard?(user = current_user) + controller_action_to_child_dashboards.any? {|dashboard| dashboard == user.dashboard } + end + private def get_dashboard_nav_links diff --git a/app/views/explore/groups/index.html.haml b/app/views/explore/groups/index.html.haml index 387c37b7a91..1d8b9c5bc8f 100644 --- a/app/views/explore/groups/index.html.haml +++ b/app/views/explore/groups/index.html.haml @@ -2,6 +2,9 @@ - page_title _("Groups") - header_title _("Groups"), dashboard_groups_path += content_for :above_breadcrumbs_content do + = render_if_exists "shared/gold_trial_callout" + - if current_user = render 'dashboard/groups_head' - else diff --git a/app/views/explore/projects/index.html.haml b/app/views/explore/projects/index.html.haml index 452f390695c..16be5791f83 100644 --- a/app/views/explore/projects/index.html.haml +++ b/app/views/explore/projects/index.html.haml @@ -2,6 +2,9 @@ - page_title _("Projects") - header_title _("Projects"), dashboard_projects_path += content_for :above_breadcrumbs_content do + = render_if_exists "shared/gold_trial_callout" + - if current_user = render 'dashboard/projects_head' - else diff --git a/app/views/explore/projects/starred.html.haml b/app/views/explore/projects/starred.html.haml index 452f390695c..16be5791f83 100644 --- a/app/views/explore/projects/starred.html.haml +++ b/app/views/explore/projects/starred.html.haml @@ -2,6 +2,9 @@ - page_title _("Projects") - header_title _("Projects"), dashboard_projects_path += content_for :above_breadcrumbs_content do + = render_if_exists "shared/gold_trial_callout" + - if current_user = render 'dashboard/projects_head' - else diff --git a/app/views/explore/projects/trending.html.haml b/app/views/explore/projects/trending.html.haml index 452f390695c..16be5791f83 100644 --- a/app/views/explore/projects/trending.html.haml +++ b/app/views/explore/projects/trending.html.haml @@ -2,6 +2,9 @@ - page_title _("Projects") - header_title _("Projects"), dashboard_projects_path += content_for :above_breadcrumbs_content do + = render_if_exists "shared/gold_trial_callout" + - if current_user = render 'dashboard/projects_head' - else diff --git a/ee/app/assets/stylesheets/pages/promotions.scss b/ee/app/assets/stylesheets/pages/promotions.scss new file mode 100644 index 00000000000..7b04164ca1d --- /dev/null +++ b/ee/app/assets/stylesheets/pages/promotions.scss @@ -0,0 +1,193 @@ +.user-callout.promotion-callout { + margin: 20px 0 0; + + &.prepend-top-10 { + margin-top: 10px; + } + + &.append-bottom-20 { + margin-bottom: 20px; + } + + .user-callout-copy { + max-width: 700px; + margin-left: auto; + margin-right: auto; + } + + .bordered-box { + padding: 20px; + border-color: $border-color; + background-color: $white-light; + align-items: flex-start; + + .close { + .dismiss-icon { + color: $gray-darkest; + } + + &:hover { + .dismiss-icon { + color: $text-color; + } + } + } + + .svg-container { + margin-right: 15px; + } + } + + &.promotion-empty-page { + margin-top: 56px; + } + + &.promotion-advanced-search { + margin: 0; + border-bottom: solid 1px $border-color; + + h5 { + margin-top: 0; + } + + .bordered-box.content-block { + border: 0; + padding: 20px 0; + justify-content: left; + + svg { + height: auto; + } + } + + .user-callout-copy { + margin-left: 0; + } + } + + .promotion-burndown-charts-content { + justify-content: end; + + .svg-container { + margin-left: 4px; + margin-right: 24px; + } + + .user-callout-copy { + margin: 0; + } + } + + &.thin-callout { + .bordered-box { + padding: $gl-padding; + padding-left: 40px; + + .close { + position: relative; + top: 0; + right: 0; + } + } + + .svg-container .svg { + max-width: 39px; + max-height: 39px; + } + } +} + +.promotion-modal { + .modal-dialog { + width: 540px; + } + + .modal-header { + border-bottom: 0; + } + + .modal-body { + margin-top: -20px; + padding: 16px 16px 32px; + } + + .modal-footer { + border-top: 0; + } +} + +.promotion-backdrop { + background-color: $white-transparent; + position: absolute; + padding-top: 72px; + + .user-callout-copy { + max-width: 700px; + } +} + +.promotion-issue-sidebar { + .promotion-issue-sidebar-message { + padding: $gl-padding-top; + + .dropdown-title { + margin: 0 0 10px; + } + + .btn + .btn { + margin-top: $gl-padding-4; + } + } + + .btn { + padding: $gl-vert-padding $gl-btn-padding; + border-radius: $border-radius-default; + display: block; + line-height: $line-height-base; + } + + .right-sidebar & .btn-link { + display: inline; + color: $blue-600; + background-color: transparent; + padding: 0; + + &:hover { + background-color: transparent; + color: $blue-800; + } + } +} + +.promotion-issue-template-message { + padding: $gl-padding 30px 20px $gl-padding; + + p { + margin-right: 20px; + } + + .dropdown-title { + margin: 0 -25px; + padding: 0; + overflow: initial; + border-bottom: 0; + } + + .btn { + padding: $gl-vert-padding $gl-btn-padding; + border-radius: $border-radius-default; + display: inline-block; + line-height: $line-height-base; + } + + .btn-link { + display: inline; + color: $blue-600; + padding: 0; + + &:hover { + background-color: transparent; + color: $blue-800; + } + } +} diff --git a/ee/app/views/shared/_gold_trial_callout.html.haml b/ee/app/views/shared/_gold_trial_callout.html.haml new file mode 100644 index 00000000000..300ff5634c3 --- /dev/null +++ b/ee/app/views/shared/_gold_trial_callout.html.haml @@ -0,0 +1,16 @@ +- if show_gold_trial? && is_default_dashboard? + .pt-1.d-none.d-md-block{ class: container_class } + .user-callout.promotion-callout.thin-callout.js-gold-trial-callout{ data: { uid: 'trial_callout_dismissed', feature_id: UserCalloutsHelper::GOLD_TRIAL, dismiss_endpoint: user_callouts_path } } + .bordered-box.justify-content-left.align-items-center + .svg-container + = image_tag 'illustrations/golden_tanuki.svg', class: 'svg' + .d-flex.flex-grow.align-items-center + .user-callout-copy.ml-0 + %h5.mb-0.mt-0= _('Free Trial of GitLab.com Gold') + %p.mb-0 + %span= _('Try all GitLab has to offer for 30 days.') + %span.d-none.d-sm-inline= _('No credit card required.') + = link_to _('Start your trial'), 'https://customers.gitlab.com/trials/new?gl_com=true', class: 'btn btn-primary mr-5 mt-2 mt-sm-0', target: '_blank' + %button.btn.btn-default.close.js-close{ type: 'button', + 'aria-label' => _('Dismiss trial promotion') } + = icon('times', class: 'dismiss-icon', 'aria-hidden' => 'true')