From 4b56f2f257fdc473e97a71dd6a0478560ab57cbf Mon Sep 17 00:00:00 2001 From: pidgeonman <2166135+pidgeonman@users.noreply.github.com> Date: Tue, 24 Mar 2020 01:04:15 -0300 Subject: [PATCH 1/3] Full implementation. Ready for review. --- _inc/jetpack-jitm.js | 3 ++ _inc/lib/class.core-rest-api-endpoints.php | 2 +- .../jitm/assets/jetpack-admin-jitm-rtl.css | 6 +++ .../assets/jetpack-admin-jitm-rtl.min.css | 2 +- packages/jitm/assets/jetpack-admin-jitm.css | 6 +++ .../jitm/assets/jetpack-admin-jitm.min.css | 2 +- packages/jitm/src/class-jitm.php | 5 ++- packages/logo/src/class-logo.php | 41 ++++++++++++++----- 8 files changed, 51 insertions(+), 16 deletions(-) diff --git a/_inc/jetpack-jitm.js b/_inc/jetpack-jitm.js index 832b2f5b5feb1..a048d0b00fade 100644 --- a/_inc/jetpack-jitm.js +++ b/_inc/jetpack-jitm.js @@ -217,9 +217,12 @@ jQuery( document ).ready( function( $ ) { ); } + var full_jp_logo_exists = $( '.jetpack-logo__masthead' ).length ? true : false; + $.get( window.jitm_config.api_root + 'jetpack/v4/jitm', { message_path: message_path, query: query, + full_jp_logo_exists: full_jp_logo_exists, _wpnonce: $el.data( 'nonce' ), } ).then( function( response ) { if ( 'object' === typeof response && response[ '1' ] ) { diff --git a/_inc/lib/class.core-rest-api-endpoints.php b/_inc/lib/class.core-rest-api-endpoints.php index ab7c0d875d4b1..d7c2335d41fcc 100644 --- a/_inc/lib/class.core-rest-api-endpoints.php +++ b/_inc/lib/class.core-rest-api-endpoints.php @@ -592,7 +592,7 @@ public static function get_jitm_message( $request ) { return array(); } - return $jitm->get_messages( $request['message_path'], urldecode_deep( $request['query'] ) ); + return $jitm->get_messages( $request['message_path'], urldecode_deep( $request['query'] ), 'true' === $request['full_jp_logo_exists'] ? true : false ); } /** diff --git a/packages/jitm/assets/jetpack-admin-jitm-rtl.css b/packages/jitm/assets/jetpack-admin-jitm-rtl.css index ca0300d502eb3..7c819c7877d5b 100644 --- a/packages/jitm/assets/jetpack-admin-jitm-rtl.css +++ b/packages/jitm/assets/jetpack-admin-jitm-rtl.css @@ -345,6 +345,12 @@ https://github.com/thoughtbot/bourbon fill: #00BE28; } +.jitm-banner__icon-plan .jp-emblem .jitm-jp-logo { + height: inherit; + width: 6rem; + fill: inherit; +} + @media (min-width: 481px) { .jitm-banner__icon-plan { align-items: center; diff --git a/packages/jitm/assets/jetpack-admin-jitm-rtl.min.css b/packages/jitm/assets/jetpack-admin-jitm-rtl.min.css index a54f3e97185e9..d077437c95884 100644 --- a/packages/jitm/assets/jetpack-admin-jitm-rtl.min.css +++ b/packages/jitm/assets/jetpack-admin-jitm-rtl.min.css @@ -2,4 +2,4 @@ * Do not modify this file directly. It is automatically generated. *//*! * Do not modify this file directly. It is compiled SASS code. -*/.jitm-button{background:#f3f5f6;border-color:#0071a1;border-style:solid;border-width:1px;color:#0071a1;cursor:pointer;display:inline-block;margin:0;outline:0;overflow:hidden;font-size:14px;font-weight:500;text-overflow:ellipsis;text-decoration:none;vertical-align:top;box-sizing:border-box;font-size:14px;border-radius:4px;padding:7px 14px 9px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.jitm-button:hover{background:#f1f1f1;border-color:#016087;color:#016087}.jitm-button:disabled,.jitm-button[disabled]{color:#eee;background:#fff;border-color:#eee;cursor:default}.jitm-button:focus{background:#fff;border-color:#0071a1;box-shadow:0 0 0 1px #0071a1}.jitm-button.is-compact{padding:7px;font-size:11px;line-height:1;text-transform:uppercase}.jitm-button.is-compact:disabled{color:#eee}.jitm-button.is-compact .gridicon{top:4px;margin-top:-8px}.jitm-button.is-compact .gridicons-plus-small{margin-right:-4px}.jitm-button.is-compact .gridicons-plus-small:last-of-type{margin-right:0}.jitm-button.is-compact .gridicons-plus-small+.gridicon{margin-right:-4px}.jitm-button.hidden{display:none}.jitm-button.is-primary{background:#007cba;border-color:#007cba;color:#fff}.jitm-button.is-primary:focus,.jitm-button.is-primary:hover{border-color:#0071a1;background:#0071a1;color:#fff}.jitm-button.is-primary:focus{box-shadow:0 0 0 1px #fff,0 0 0 3px #0071a1}.jitm-button.is-primary:disabled,.jitm-button.is-primary[disabled]{background:#bceefd;border-color:#8cc9e2;color:#fff}.jitm-button.is-primary.is-compact{color:#fff;white-space:nowrap}.jitm-card{display:block;clear:both;position:relative;margin:3rem auto 0 1.25rem;padding:1rem;box-sizing:border-box;background:#fff;box-shadow:0 0 0 1px #ccd0d4,0 1px 1px 1px rgba(0,0,0,.04)}.jitm-card:after{content:".";display:block;height:0;clear:both;visibility:hidden}@media (min-width:481px){.jitm-card{margin-bottom:1rem;padding:1.5rem}}.jitm-card.is-compact{margin-bottom:.0625rem}@media (min-width:481px){.jitm-card.is-compact{margin-bottom:1px;padding:1rem 1.5rem}}.jitm-card.is-card-link{padding-left:3rem}#screen-meta-links+.jitm-card{margin:2.5rem auto 0 1.5385em}#dolly+.jitm-card{margin:3rem auto 0 1rem}.post-php .jitm-card{margin-left:0}.jp-lower .jitm-card{margin:0 0 1.5rem}.jitm-banner.jitm-card{border-right:4px solid;display:flex;padding:.75rem .75rem .75rem .375rem;position:relative;z-index:2;border-right-color:#4ab866}@media (max-width:480px){.jitm-banner.jitm-card{display:block}}.jitm-banner.jitm-card.is-card-link{padding:.75rem 1rem .75rem 3rem}.jitm-banner.jitm-card.is-dismissible{padding-left:3rem}.jitm-banner.jitm-card .jitm-banner__icon{color:#4ab866}.jitm-banner.jitm-card .jitm-banner__icon-circle{background-color:#4ab866}.jitm-banner.jitm-card.is-upgrade-personal{border-right-color:#f0b849}.jitm-banner.jitm-card.is-upgrade-personal .jitm-banner__icon{color:#f0b849}.jitm-banner.jitm-card.is-upgrade-personal .jitm-banner__icon-circle{background-color:#f0b849}.jitm-banner.jitm-card.is-upgrade-premium{border-right-color:#4ab866}.jitm-banner.jitm-card.is-upgrade-premium .jitm-banner__icon{color:#4ab866}.jitm-banner.jitm-card.is-upgrade-premium .jitm-banner__icon-circle{background-color:#4ab866}.jitm-banner.jitm-card.is-upgrade-business,.jitm-banner.jitm-card.woo-jitm{border-right-color:#855da6}.jitm-banner.jitm-card.is-upgrade-business .jitm-banner__icon,.jitm-banner.jitm-card.woo-jitm .jitm-banner__icon{color:#855da6}.jitm-banner.jitm-card.is-upgrade-business .jitm-banner__icon-circle,.jitm-banner.jitm-card.woo-jitm .jitm-banner__icon-circle{background-color:#855da6}.jitm-banner.jitm-card .jitm-card__link-indicator{align-items:center;color:#0087be;display:flex}.jitm-banner.jitm-card:hover{transition:all .1s ease-in-out}.jitm-banner.jitm-card:hover.is-card-link{box-shadow:0 0 0 1px #a2a2a2,0 2px 4px #d5d5d5}.jitm-banner.jitm-card:hover .jitm-card__link-indicator{color:#005082}@media (min-width:481px){.jitm-banner.jitm-card{padding:.75rem 1rem}.jitm-banner.jitm-card.is-dismissible{padding-left:1rem}}.jitm-banner__icons{display:flex}.jitm-banner__icons .jitm-banner__icon,.jitm-banner__icons .jitm-banner__icon-circle{border-radius:50%;flex-shrink:0;height:1.5rem;width:1.5rem;margin-left:1rem;margin-top:-.125rem;text-align:center;top:.25rem}.jitm-banner__icons .jitm-banner__icon{align-self:center;color:#fff;display:block}.jitm-banner__icons .jitm-banner__icon-circle{color:#fff;display:none;padding:.1875rem .1875rem .25rem .25rem}@media (min-width:481px){.jitm-banner__icons{align-items:center}.jitm-banner__icons .jitm-banner__icon{display:none}.jitm-banner__icons .jitm-banner__icon-circle{display:block}}.jitm-banner__icon-plan{display:flex;margin-left:1rem}.jitm-banner__icon-plan .dops-plan-icon{height:2rem;width:2rem}.jitm-banner__icon-plan .jp-emblem{position:relative;top:.125rem}@media (max-width:480px){.jitm-banner__icon-plan .jp-emblem{margin-bottom:.75rem}}.jitm-banner__icon-plan .jp-emblem svg{height:2rem;width:2rem;fill:#00be28}@media (min-width:481px){.jitm-banner__icon-plan{align-items:center}}.jitm-banner__content{align-items:center;display:flex;flex-grow:1;flex-wrap:wrap}@media (min-width:481px){.jitm-banner__content{flex-wrap:nowrap}}.jitm-banner__info{flex-grow:1;line-height:1.4}@media (min-width:481px){.jitm-banner__info{flex-basis:50%}}@media (min-width:961px){.jitm-banner__info{flex-basis:70%}}.jitm-banner__info .jitm-banner__description,.jitm-banner__info .jitm-banner__title{color:#414141}.jitm-banner__info .jitm-banner__title{font-size:14px;font-weight:500}.jitm-banner__info .jitm-banner__description{font-size:.75rem;line-height:1.5;margin-top:.375rem}.jitm-banner__info .banner__list{font-size:12px;list-style:none;margin:10px 0}.jitm-banner__info .banner__list li{margin:6px 0}.jitm-banner__info .banner__list li .gridicon{fill:#a2a2a2;display:inline;margin-left:12px;vertical-align:bottom}.jitm-banner__action{align-self:center;font-size:.75rem;margin:.5rem 0 0;text-align:right;width:100%}.jitm-banner__action .jitm-banner__prices{display:flex;justify-content:flex-start}.jitm-banner__action .jitm-banner__prices .dops-plan-price{margin-bottom:0}.jitm-banner__action .jitm-banner__prices .dops-plan-price.is-discounted,.jitm-banner__action .jitm-banner__prices .dops-plan-price.is-discounted .dops-plan-price__currency-symbol{color:#414141}.has-call-to-action .jitm-banner__action .jitm-banner__prices .dops-plan-price{margin-bottom:.5rem}@media (min-width:481px){.jitm-banner__action{margin:0 .5rem 0 .25rem;text-align:center;width:auto}.jitm-banner__action .is-dismissible{margin-top:2.5rem}.jitm-banner__action .jitm-banner__prices{justify-content:flex-end;text-align:left}}.jitm-banner__dismiss{display:block;text-decoration:none;line-height:.5}.jitm-banner__dismiss:before{color:#6f6f6f;font:400 16px/1 dashicons;content:'\f158'}@media (min-width:661px){.jitm-banner__dismiss{margin-left:-.5rem}}@media (max-width:480px){.jitm-banner__dismiss{position:absolute;top:.875rem;left:.875rem}}.jitm-banner__action+.jitm-banner__dismiss{margin-right:.625rem}#dolly+.jitm-card{margin:3rem auto 0 1rem} \ No newline at end of file +*/.jitm-button{background:#f3f5f6;border-color:#0071a1;border-style:solid;border-width:1px;color:#0071a1;cursor:pointer;display:inline-block;margin:0;outline:0;overflow:hidden;font-size:14px;font-weight:500;text-overflow:ellipsis;text-decoration:none;vertical-align:top;box-sizing:border-box;font-size:14px;border-radius:4px;padding:7px 14px 9px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.jitm-button:hover{background:#f1f1f1;border-color:#016087;color:#016087}.jitm-button:disabled,.jitm-button[disabled]{color:#eee;background:#fff;border-color:#eee;cursor:default}.jitm-button:focus{background:#fff;border-color:#0071a1;box-shadow:0 0 0 1px #0071a1}.jitm-button.is-compact{padding:7px;font-size:11px;line-height:1;text-transform:uppercase}.jitm-button.is-compact:disabled{color:#eee}.jitm-button.is-compact .gridicon{top:4px;margin-top:-8px}.jitm-button.is-compact .gridicons-plus-small{margin-right:-4px}.jitm-button.is-compact .gridicons-plus-small:last-of-type{margin-right:0}.jitm-button.is-compact .gridicons-plus-small+.gridicon{margin-right:-4px}.jitm-button.hidden{display:none}.jitm-button.is-primary{background:#007cba;border-color:#007cba;color:#fff}.jitm-button.is-primary:focus,.jitm-button.is-primary:hover{border-color:#0071a1;background:#0071a1;color:#fff}.jitm-button.is-primary:focus{box-shadow:0 0 0 1px #fff,0 0 0 3px #0071a1}.jitm-button.is-primary:disabled,.jitm-button.is-primary[disabled]{background:#bceefd;border-color:#8cc9e2;color:#fff}.jitm-button.is-primary.is-compact{color:#fff;white-space:nowrap}.jitm-card{display:block;clear:both;position:relative;margin:3rem auto 0 1.25rem;padding:1rem;box-sizing:border-box;background:#fff;box-shadow:0 0 0 1px #ccd0d4,0 1px 1px 1px rgba(0,0,0,.04)}.jitm-card:after{content:".";display:block;height:0;clear:both;visibility:hidden}@media (min-width:481px){.jitm-card{margin-bottom:1rem;padding:1.5rem}}.jitm-card.is-compact{margin-bottom:.0625rem}@media (min-width:481px){.jitm-card.is-compact{margin-bottom:1px;padding:1rem 1.5rem}}.jitm-card.is-card-link{padding-left:3rem}#screen-meta-links+.jitm-card{margin:2.5rem auto 0 1.5385em}#dolly+.jitm-card{margin:3rem auto 0 1rem}.post-php .jitm-card{margin-left:0}.jp-lower .jitm-card{margin:0 0 1.5rem}.jitm-banner.jitm-card{border-right:4px solid;display:flex;padding:.75rem .75rem .75rem .375rem;position:relative;z-index:2;border-right-color:#4ab866}@media (max-width:480px){.jitm-banner.jitm-card{display:block}}.jitm-banner.jitm-card.is-card-link{padding:.75rem 1rem .75rem 3rem}.jitm-banner.jitm-card.is-dismissible{padding-left:3rem}.jitm-banner.jitm-card .jitm-banner__icon{color:#4ab866}.jitm-banner.jitm-card .jitm-banner__icon-circle{background-color:#4ab866}.jitm-banner.jitm-card.is-upgrade-personal{border-right-color:#f0b849}.jitm-banner.jitm-card.is-upgrade-personal .jitm-banner__icon{color:#f0b849}.jitm-banner.jitm-card.is-upgrade-personal .jitm-banner__icon-circle{background-color:#f0b849}.jitm-banner.jitm-card.is-upgrade-premium{border-right-color:#4ab866}.jitm-banner.jitm-card.is-upgrade-premium .jitm-banner__icon{color:#4ab866}.jitm-banner.jitm-card.is-upgrade-premium .jitm-banner__icon-circle{background-color:#4ab866}.jitm-banner.jitm-card.is-upgrade-business,.jitm-banner.jitm-card.woo-jitm{border-right-color:#855da6}.jitm-banner.jitm-card.is-upgrade-business .jitm-banner__icon,.jitm-banner.jitm-card.woo-jitm .jitm-banner__icon{color:#855da6}.jitm-banner.jitm-card.is-upgrade-business .jitm-banner__icon-circle,.jitm-banner.jitm-card.woo-jitm .jitm-banner__icon-circle{background-color:#855da6}.jitm-banner.jitm-card .jitm-card__link-indicator{align-items:center;color:#0087be;display:flex}.jitm-banner.jitm-card:hover{transition:all .1s ease-in-out}.jitm-banner.jitm-card:hover.is-card-link{box-shadow:0 0 0 1px #a2a2a2,0 2px 4px #d5d5d5}.jitm-banner.jitm-card:hover .jitm-card__link-indicator{color:#005082}@media (min-width:481px){.jitm-banner.jitm-card{padding:.75rem 1rem}.jitm-banner.jitm-card.is-dismissible{padding-left:1rem}}.jitm-banner__icons{display:flex}.jitm-banner__icons .jitm-banner__icon,.jitm-banner__icons .jitm-banner__icon-circle{border-radius:50%;flex-shrink:0;height:1.5rem;width:1.5rem;margin-left:1rem;margin-top:-.125rem;text-align:center;top:.25rem}.jitm-banner__icons .jitm-banner__icon{align-self:center;color:#fff;display:block}.jitm-banner__icons .jitm-banner__icon-circle{color:#fff;display:none;padding:.1875rem .1875rem .25rem .25rem}@media (min-width:481px){.jitm-banner__icons{align-items:center}.jitm-banner__icons .jitm-banner__icon{display:none}.jitm-banner__icons .jitm-banner__icon-circle{display:block}}.jitm-banner__icon-plan{display:flex;margin-left:1rem}.jitm-banner__icon-plan .dops-plan-icon{height:2rem;width:2rem}.jitm-banner__icon-plan .jp-emblem{position:relative;top:.125rem}@media (max-width:480px){.jitm-banner__icon-plan .jp-emblem{margin-bottom:.75rem}}.jitm-banner__icon-plan .jp-emblem svg{height:2rem;width:2rem;fill:#00be28}.jitm-banner__icon-plan .jp-emblem .jitm-jp-logo{height: inherit;width: 6rem;fill: inherit;}@media (min-width:481px){.jitm-banner__icon-plan{align-items:center}}.jitm-banner__content{align-items:center;display:flex;flex-grow:1;flex-wrap:wrap}@media (min-width:481px){.jitm-banner__content{flex-wrap:nowrap}}.jitm-banner__info{flex-grow:1;line-height:1.4}@media (min-width:481px){.jitm-banner__info{flex-basis:50%}}@media (min-width:961px){.jitm-banner__info{flex-basis:70%}}.jitm-banner__info .jitm-banner__description,.jitm-banner__info .jitm-banner__title{color:#414141}.jitm-banner__info .jitm-banner__title{font-size:14px;font-weight:500}.jitm-banner__info .jitm-banner__description{font-size:.75rem;line-height:1.5;margin-top:.375rem}.jitm-banner__info .banner__list{font-size:12px;list-style:none;margin:10px 0}.jitm-banner__info .banner__list li{margin:6px 0}.jitm-banner__info .banner__list li .gridicon{fill:#a2a2a2;display:inline;margin-left:12px;vertical-align:bottom}.jitm-banner__action{align-self:center;font-size:.75rem;margin:.5rem 0 0;text-align:right;width:100%}.jitm-banner__action .jitm-banner__prices{display:flex;justify-content:flex-start}.jitm-banner__action .jitm-banner__prices .dops-plan-price{margin-bottom:0}.jitm-banner__action .jitm-banner__prices .dops-plan-price.is-discounted,.jitm-banner__action .jitm-banner__prices .dops-plan-price.is-discounted .dops-plan-price__currency-symbol{color:#414141}.has-call-to-action .jitm-banner__action .jitm-banner__prices .dops-plan-price{margin-bottom:.5rem}@media (min-width:481px){.jitm-banner__action{margin:0 .5rem 0 .25rem;text-align:center;width:auto}.jitm-banner__action .is-dismissible{margin-top:2.5rem}.jitm-banner__action .jitm-banner__prices{justify-content:flex-end;text-align:left}}.jitm-banner__dismiss{display:block;text-decoration:none;line-height:.5}.jitm-banner__dismiss:before{color:#6f6f6f;font:400 16px/1 dashicons;content:'\f158'}@media (min-width:661px){.jitm-banner__dismiss{margin-left:-.5rem}}@media (max-width:480px){.jitm-banner__dismiss{position:absolute;top:.875rem;left:.875rem}}.jitm-banner__action+.jitm-banner__dismiss{margin-right:.625rem}#dolly+.jitm-card{margin:3rem auto 0 1rem} \ No newline at end of file diff --git a/packages/jitm/assets/jetpack-admin-jitm.css b/packages/jitm/assets/jetpack-admin-jitm.css index a27170422ddf6..0f3c9f9d3d53a 100644 --- a/packages/jitm/assets/jetpack-admin-jitm.css +++ b/packages/jitm/assets/jetpack-admin-jitm.css @@ -342,6 +342,12 @@ https://github.com/thoughtbot/bourbon fill: #00BE28; } +.jitm-banner__icon-plan .jp-emblem .jitm-jp-logo { + height: inherit; + width: 6rem; + fill: inherit; +} + @media (min-width: 481px) { .jitm-banner__icon-plan { align-items: center; diff --git a/packages/jitm/assets/jetpack-admin-jitm.min.css b/packages/jitm/assets/jetpack-admin-jitm.min.css index 109c1c492594e..51a2fa4b47328 100644 --- a/packages/jitm/assets/jetpack-admin-jitm.min.css +++ b/packages/jitm/assets/jetpack-admin-jitm.min.css @@ -1,3 +1,3 @@ @charset "UTF-8";/*! * Do not modify this file directly. It is compiled SASS code. -*/.jitm-button{background:#f3f5f6;border-color:#0071a1;border-style:solid;border-width:1px;color:#0071a1;cursor:pointer;display:inline-block;margin:0;outline:0;overflow:hidden;font-size:14px;text-overflow:ellipsis;text-decoration:none;vertical-align:top;box-sizing:border-box;font-size:14px;border-radius:4px;padding:7px 14px 9px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.jitm-button:hover{background:#f1f1f1;border-color:#016087;color:#016087}.jitm-button:disabled,.jitm-button[disabled]{color:#eee;background:#fff;border-color:#eee;cursor:default}.jitm-button:focus{background:#fff;border-color:#0071a1;box-shadow:0 0 0 1px #0071a1}.jitm-button.is-compact{padding:7px;font-size:11px;line-height:1;text-transform:uppercase}.jitm-button.is-compact:disabled{color:#eee}.jitm-button.is-compact .gridicon{top:4px;margin-top:-8px}.jitm-button.is-compact .gridicons-plus-small{margin-left:-4px}.jitm-button.is-compact .gridicons-plus-small:last-of-type{margin-left:0}.jitm-button.is-compact .gridicons-plus-small+.gridicon{margin-left:-4px}.jitm-button.hidden{display:none}.jitm-button.is-primary{background:#007cba;border-color:#007cba;color:#fff}.jitm-button.is-primary:focus,.jitm-button.is-primary:hover{border-color:#0071a1;background:#0071a1;color:#fff}.jitm-button.is-primary:focus{box-shadow:0 0 0 1px #fff,0 0 0 3px #0071a1}.jitm-button.is-primary:disabled,.jitm-button.is-primary[disabled]{background:#bceefd;border-color:#8cc9e2;color:#fff}.jitm-button.is-primary.is-compact{color:#fff;white-space:nowrap}.jitm-card{display:block;clear:both;position:relative;margin:3rem 1.25rem 0 auto;padding:1rem;box-sizing:border-box;background:#fff;box-shadow:0 0 0 1px #ccd0d4,0 1px 1px 1px rgba(0,0,0,.04)}.jitm-card:after{content:".";display:block;height:0;clear:both;visibility:hidden}@media (min-width:481px){.jitm-card{margin-bottom:1rem;padding:1.5rem}}.jitm-card.is-compact{margin-bottom:.0625rem}@media (min-width:481px){.jitm-card.is-compact{margin-bottom:1px;padding:1rem 1.5rem}}.jitm-card.is-card-link{padding-right:3rem}#screen-meta-links+.jitm-card{margin:2.5rem 1.5385em 0 auto}#dolly+.jitm-card{margin:3rem 1rem 0 auto}.post-php .jitm-card{margin-right:0}.jp-lower .jitm-card{margin:0 0 1.5rem}.jitm-banner.jitm-card{border-left:4px solid;display:flex;padding:.75rem .375rem .75rem .75rem;position:relative;z-index:2;border-left-color:#4ab866}@media (max-width:480px){.jitm-banner.jitm-card{display:block}}.jitm-banner.jitm-card.is-card-link{padding:.75rem 3rem .75rem 1rem}.jitm-banner.jitm-card.is-dismissible{padding-right:3rem}.jitm-banner.jitm-card .jitm-banner__icon{color:#4ab866}.jitm-banner.jitm-card .jitm-banner__icon-circle{background-color:#4ab866}.jitm-banner.jitm-card.is-upgrade-personal{border-left-color:#f0b849}.jitm-banner.jitm-card.is-upgrade-personal .jitm-banner__icon{color:#f0b849}.jitm-banner.jitm-card.is-upgrade-personal .jitm-banner__icon-circle{background-color:#f0b849}.jitm-banner.jitm-card.is-upgrade-premium{border-left-color:#4ab866}.jitm-banner.jitm-card.is-upgrade-premium .jitm-banner__icon{color:#4ab866}.jitm-banner.jitm-card.is-upgrade-premium .jitm-banner__icon-circle{background-color:#4ab866}.jitm-banner.jitm-card.is-upgrade-business,.jitm-banner.jitm-card.woo-jitm{border-left-color:#855da6}.jitm-banner.jitm-card.is-upgrade-business .jitm-banner__icon,.jitm-banner.jitm-card.woo-jitm .jitm-banner__icon{color:#855da6}.jitm-banner.jitm-card.is-upgrade-business .jitm-banner__icon-circle,.jitm-banner.jitm-card.woo-jitm .jitm-banner__icon-circle{background-color:#855da6}.jitm-banner.jitm-card .jitm-card__link-indicator{align-items:center;color:#0087be;display:flex}.jitm-banner.jitm-card:hover{transition:all .1s ease-in-out}.jitm-banner.jitm-card:hover.is-card-link{box-shadow:0 0 0 1px #a2a2a2,0 2px 4px #d5d5d5}.jitm-banner.jitm-card:hover .jitm-card__link-indicator{color:#005082}@media (min-width:481px){.jitm-banner.jitm-card{padding:.75rem 1rem}.jitm-banner.jitm-card.is-dismissible{padding-right:1rem}}.jitm-banner__icons{display:flex}.jitm-banner__icons .jitm-banner__icon,.jitm-banner__icons .jitm-banner__icon-circle{border-radius:50%;flex-shrink:0;height:1.5rem;width:1.5rem;margin-right:1rem;margin-top:-.125rem;text-align:center;top:.25rem}.jitm-banner__icons .jitm-banner__icon{align-self:center;color:#fff;display:block}.jitm-banner__icons .jitm-banner__icon-circle{color:#fff;display:none;padding:.1875rem .25rem .25rem .1875rem}@media (min-width:481px){.jitm-banner__icons{align-items:center}.jitm-banner__icons .jitm-banner__icon{display:none}.jitm-banner__icons .jitm-banner__icon-circle{display:block}}.jitm-banner__icon-plan{display:flex;margin-right:1rem}.jitm-banner__icon-plan .dops-plan-icon{height:2rem;width:2rem}.jitm-banner__icon-plan .jp-emblem{position:relative;top:.125rem}@media (max-width:480px){.jitm-banner__icon-plan .jp-emblem{margin-bottom:.75rem}}.jitm-banner__icon-plan .jp-emblem svg{height:2rem;width:2rem;fill:#00be28}@media (min-width:481px){.jitm-banner__icon-plan{align-items:center}}.jitm-banner__content{align-items:center;display:flex;flex-grow:1;flex-wrap:wrap}@media (min-width:481px){.jitm-banner__content{flex-wrap:nowrap}}.jitm-banner__info{flex-grow:1;line-height:1.4}@media (min-width:481px){.jitm-banner__info{flex-basis:50%}}@media (min-width:961px){.jitm-banner__info{flex-basis:70%}}.jitm-banner__info .jitm-banner__description,.jitm-banner__info .jitm-banner__title{color:#414141}.jitm-banner__info .jitm-banner__title{font-size:14px;font-weight:500}.jitm-banner__info .jitm-banner__description{font-size:.75rem;line-height:1.5;margin-top:.375rem}.jitm-banner__info .banner__list{font-size:12px;list-style:none;margin:10px 0}.jitm-banner__info .banner__list li{margin:6px 0}.jitm-banner__info .banner__list li .gridicon{fill:#a2a2a2;display:inline;margin-right:12px;vertical-align:bottom}.jitm-banner__action{align-self:center;font-size:.75rem;margin:.5rem 0 0;text-align:left;width:100%}.jitm-banner__action .jitm-banner__prices{display:flex;justify-content:flex-start}.jitm-banner__action .jitm-banner__prices .dops-plan-price{margin-bottom:0}.jitm-banner__action .jitm-banner__prices .dops-plan-price.is-discounted,.jitm-banner__action .jitm-banner__prices .dops-plan-price.is-discounted .dops-plan-price__currency-symbol{color:#414141}.has-call-to-action .jitm-banner__action .jitm-banner__prices .dops-plan-price{margin-bottom:.5rem}@media (min-width:481px){.jitm-banner__action{margin:0 .25rem 0 .5rem;text-align:center;width:auto}.jitm-banner__action .is-dismissible{margin-top:2.5rem}.jitm-banner__action .jitm-banner__prices{justify-content:flex-end;text-align:right}}.jitm-banner__dismiss{display:block;text-decoration:none;line-height:.5}.jitm-banner__dismiss:before{color:#6f6f6f;font:400 16px/1 dashicons;content:'\f158'}@media (min-width:661px){.jitm-banner__dismiss{margin-right:-.5rem}}@media (max-width:480px){.jitm-banner__dismiss{position:absolute;top:.875rem;right:.875rem}}.jitm-banner__action+.jitm-banner__dismiss{margin-left:.625rem}#dolly+.jitm-card{margin:3rem 1rem 0 auto} \ No newline at end of file +*/.jitm-button{background:#f3f5f6;border-color:#0071a1;border-style:solid;border-width:1px;color:#0071a1;cursor:pointer;display:inline-block;margin:0;outline:0;overflow:hidden;font-size:14px;text-overflow:ellipsis;text-decoration:none;vertical-align:top;box-sizing:border-box;font-size:14px;border-radius:4px;padding:7px 14px 9px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.jitm-button:hover{background:#f1f1f1;border-color:#016087;color:#016087}.jitm-button:disabled,.jitm-button[disabled]{color:#eee;background:#fff;border-color:#eee;cursor:default}.jitm-button:focus{background:#fff;border-color:#0071a1;box-shadow:0 0 0 1px #0071a1}.jitm-button.is-compact{padding:7px;font-size:11px;line-height:1;text-transform:uppercase}.jitm-button.is-compact:disabled{color:#eee}.jitm-button.is-compact .gridicon{top:4px;margin-top:-8px}.jitm-button.is-compact .gridicons-plus-small{margin-left:-4px}.jitm-button.is-compact .gridicons-plus-small:last-of-type{margin-left:0}.jitm-button.is-compact .gridicons-plus-small+.gridicon{margin-left:-4px}.jitm-button.hidden{display:none}.jitm-button.is-primary{background:#007cba;border-color:#007cba;color:#fff}.jitm-button.is-primary:focus,.jitm-button.is-primary:hover{border-color:#0071a1;background:#0071a1;color:#fff}.jitm-button.is-primary:focus{box-shadow:0 0 0 1px #fff,0 0 0 3px #0071a1}.jitm-button.is-primary:disabled,.jitm-button.is-primary[disabled]{background:#bceefd;border-color:#8cc9e2;color:#fff}.jitm-button.is-primary.is-compact{color:#fff;white-space:nowrap}.jitm-card{display:block;clear:both;position:relative;margin:3rem 1.25rem 0 auto;padding:1rem;box-sizing:border-box;background:#fff;box-shadow:0 0 0 1px #ccd0d4,0 1px 1px 1px rgba(0,0,0,.04)}.jitm-card:after{content:".";display:block;height:0;clear:both;visibility:hidden}@media (min-width:481px){.jitm-card{margin-bottom:1rem;padding:1.5rem}}.jitm-card.is-compact{margin-bottom:.0625rem}@media (min-width:481px){.jitm-card.is-compact{margin-bottom:1px;padding:1rem 1.5rem}}.jitm-card.is-card-link{padding-right:3rem}#screen-meta-links+.jitm-card{margin:2.5rem 1.5385em 0 auto}#dolly+.jitm-card{margin:3rem 1rem 0 auto}.post-php .jitm-card{margin-right:0}.jp-lower .jitm-card{margin:0 0 1.5rem}.jitm-banner.jitm-card{border-left:4px solid;display:flex;padding:.75rem .375rem .75rem .75rem;position:relative;z-index:2;border-left-color:#4ab866}@media (max-width:480px){.jitm-banner.jitm-card{display:block}}.jitm-banner.jitm-card.is-card-link{padding:.75rem 3rem .75rem 1rem}.jitm-banner.jitm-card.is-dismissible{padding-right:3rem}.jitm-banner.jitm-card .jitm-banner__icon{color:#4ab866}.jitm-banner.jitm-card .jitm-banner__icon-circle{background-color:#4ab866}.jitm-banner.jitm-card.is-upgrade-personal{border-left-color:#f0b849}.jitm-banner.jitm-card.is-upgrade-personal .jitm-banner__icon{color:#f0b849}.jitm-banner.jitm-card.is-upgrade-personal .jitm-banner__icon-circle{background-color:#f0b849}.jitm-banner.jitm-card.is-upgrade-premium{border-left-color:#4ab866}.jitm-banner.jitm-card.is-upgrade-premium .jitm-banner__icon{color:#4ab866}.jitm-banner.jitm-card.is-upgrade-premium .jitm-banner__icon-circle{background-color:#4ab866}.jitm-banner.jitm-card.is-upgrade-business,.jitm-banner.jitm-card.woo-jitm{border-left-color:#855da6}.jitm-banner.jitm-card.is-upgrade-business .jitm-banner__icon,.jitm-banner.jitm-card.woo-jitm .jitm-banner__icon{color:#855da6}.jitm-banner.jitm-card.is-upgrade-business .jitm-banner__icon-circle,.jitm-banner.jitm-card.woo-jitm .jitm-banner__icon-circle{background-color:#855da6}.jitm-banner.jitm-card .jitm-card__link-indicator{align-items:center;color:#0087be;display:flex}.jitm-banner.jitm-card:hover{transition:all .1s ease-in-out}.jitm-banner.jitm-card:hover.is-card-link{box-shadow:0 0 0 1px #a2a2a2,0 2px 4px #d5d5d5}.jitm-banner.jitm-card:hover .jitm-card__link-indicator{color:#005082}@media (min-width:481px){.jitm-banner.jitm-card{padding:.75rem 1rem}.jitm-banner.jitm-card.is-dismissible{padding-right:1rem}}.jitm-banner__icons{display:flex}.jitm-banner__icons .jitm-banner__icon,.jitm-banner__icons .jitm-banner__icon-circle{border-radius:50%;flex-shrink:0;height:1.5rem;width:1.5rem;margin-right:1rem;margin-top:-.125rem;text-align:center;top:.25rem}.jitm-banner__icons .jitm-banner__icon{align-self:center;color:#fff;display:block}.jitm-banner__icons .jitm-banner__icon-circle{color:#fff;display:none;padding:.1875rem .25rem .25rem .1875rem}@media (min-width:481px){.jitm-banner__icons{align-items:center}.jitm-banner__icons .jitm-banner__icon{display:none}.jitm-banner__icons .jitm-banner__icon-circle{display:block}}.jitm-banner__icon-plan{display:flex;margin-right:1rem}.jitm-banner__icon-plan .dops-plan-icon{height:2rem;width:2rem}.jitm-banner__icon-plan .jp-emblem{position:relative;top:.125rem}@media (max-width:480px){.jitm-banner__icon-plan .jp-emblem{margin-bottom:.75rem}}.jitm-banner__icon-plan .jp-emblem svg{height:2rem;width:2rem;fill:#00be28}.jitm-banner__icon-plan .jp-emblem .jitm-jp-logo{height: inherit;width: 6rem;fill: inherit;}@media (min-width:481px){.jitm-banner__icon-plan{align-items:center}}.jitm-banner__content{align-items:center;display:flex;flex-grow:1;flex-wrap:wrap}@media (min-width:481px){.jitm-banner__content{flex-wrap:nowrap}}.jitm-banner__info{flex-grow:1;line-height:1.4}@media (min-width:481px){.jitm-banner__info{flex-basis:50%}}@media (min-width:961px){.jitm-banner__info{flex-basis:70%}}.jitm-banner__info .jitm-banner__description,.jitm-banner__info .jitm-banner__title{color:#414141}.jitm-banner__info .jitm-banner__title{font-size:14px;font-weight:500}.jitm-banner__info .jitm-banner__description{font-size:.75rem;line-height:1.5;margin-top:.375rem}.jitm-banner__info .banner__list{font-size:12px;list-style:none;margin:10px 0}.jitm-banner__info .banner__list li{margin:6px 0}.jitm-banner__info .banner__list li .gridicon{fill:#a2a2a2;display:inline;margin-right:12px;vertical-align:bottom}.jitm-banner__action{align-self:center;font-size:.75rem;margin:.5rem 0 0;text-align:left;width:100%}.jitm-banner__action .jitm-banner__prices{display:flex;justify-content:flex-start}.jitm-banner__action .jitm-banner__prices .dops-plan-price{margin-bottom:0}.jitm-banner__action .jitm-banner__prices .dops-plan-price.is-discounted,.jitm-banner__action .jitm-banner__prices .dops-plan-price.is-discounted .dops-plan-price__currency-symbol{color:#414141}.has-call-to-action .jitm-banner__action .jitm-banner__prices .dops-plan-price{margin-bottom:.5rem}@media (min-width:481px){.jitm-banner__action{margin:0 .25rem 0 .5rem;text-align:center;width:auto}.jitm-banner__action .is-dismissible{margin-top:2.5rem}.jitm-banner__action .jitm-banner__prices{justify-content:flex-end;text-align:right}}.jitm-banner__dismiss{display:block;text-decoration:none;line-height:.5}.jitm-banner__dismiss:before{color:#6f6f6f;font:400 16px/1 dashicons;content:'\f158'}@media (min-width:661px){.jitm-banner__dismiss{margin-right:-.5rem}}@media (max-width:480px){.jitm-banner__dismiss{position:absolute;top:.875rem;right:.875rem}}.jitm-banner__action+.jitm-banner__dismiss{margin-left:.625rem}#dolly+.jitm-card{margin:3rem 1rem 0 auto} \ No newline at end of file diff --git a/packages/jitm/src/class-jitm.php b/packages/jitm/src/class-jitm.php index c437528b3f899..f1b5dadf21602 100644 --- a/packages/jitm/src/class-jitm.php +++ b/packages/jitm/src/class-jitm.php @@ -454,10 +454,11 @@ public function dismiss( $id, $feature_class ) { * * @param string $message_path The message path to ask for. * @param string $query The query string originally from the front end. + * @param bool $full_jp_logo_exists If there is a full Jetpack logo already on the page. * * @return array The JITM's to show, or an empty array if there is nothing to show */ - public function get_messages( $message_path, $query ) { + public function get_messages( $message_path, $query, $full_jp_logo_exists ) { // Custom filters go here. add_filter( 'jitm_woocommerce_services_msg', array( $this, 'jitm_woocommerce_services_msg' ) ); add_filter( 'jitm_jetpack_woo_services_install', array( $this, 'jitm_jetpack_woo_services_install' ) ); @@ -608,7 +609,7 @@ public function get_messages( $message_path, $query ) { switch ( $envelope->content->icon ) { case 'jetpack': $jetpack_logo = new Jetpack_Logo(); - $envelope->content->icon = '
' . $jetpack_logo->get_jp_emblem() . '
'; + $envelope->content->icon = '
' . ( ( $full_jp_logo_exists ) ? $jetpack_logo->get_jp_emblem() : $jetpack_logo->get_jp_emblem_header() ) . '
'; break; case 'woocommerce': $envelope->content->icon = '
' . ( ( $full_jp_logo_exists ) ? $jetpack_logo->get_jp_emblem() : $jetpack_logo->get_jp_emblem_header() ) . '
'; + $envelope->content->icon = '
' . ( ( $full_jp_logo_exists ) ? $jetpack_logo->get_jp_emblem() : $jetpack_logo->get_jp_emblem_larger() ) . '
'; break; case 'woocommerce': $envelope->content->icon = '