Premium promo designs complete

app/hub/Views/HomeView/HomeViewContainer.jsx

@@ -76,7 +76,7 @@ class HomeViewContainer extends Component {
 				window.open(`https://checkout.${DOMAIN}.com/plus?utm_source=gbe&utm_campaign=intro_hub`, '_blank');
 				break;
 			case 'premium':
-				window.open('https://reddit.com', '_blank');
+				window.open('https://ghostery.com/thanks-for-downloading-midnight', '_blank');
 				break;
 			case 'basic':
 			default:
@@ -100,7 +100,7 @@ class HomeViewContainer extends Component {
 	 * @private
 	 * Function to handle clicks on the Midnight download button in the Premium promo modal
 	 */
-	_handleTryMidnightClick = () => { this._handlePremiumPromoModalClick('midnight'); }
+	_handleTryMidnightClick = () => { this._handlePremiumPromoModalClick('premium'); }
 
 	_render() {
 		const { justInstalled } = this.state;

app/panel/components/Panel.jsx

@@ -238,9 +238,7 @@ class Panel extends React.Component {
 	_handlePromoTryMidnightClick = () => {
 		this.props.actions.togglePromoModal();
 
-		// TODO detect OS and begin download of appropriate file
-		// TODO update with correct URL once it's available
-		const url = 'https://reddit.com';
+		const url = 'https://ghostery.com/thanks-for-downloading-midnight';
 		sendMessage('openNewTab', {
 			url,
 			become_active: true,

app/shared-components/PremiumPromoModal/PremiumPromoModal.jsx

@@ -58,9 +58,6 @@ const PremiumPromoModal = (props) => {
 	const optionDescriptionBoxClassNames = ClassNames(
 		'PremiumPromoModal__option-description-box',
 	);
-	const buttonBackgroundClassNames = ClassNames(
-		'PremiumPromoModal__buttons-background',
-	);
 
 	return (
 		<Modal show={show}>
@@ -90,15 +87,15 @@ const PremiumPromoModal = (props) => {
 						<div className="PremiumPromoModal__feature">
 							<span className="PremiumPromoModal__checked-circle-icon" />
 							<div className="PremiumPromoModal__feature-text">
-								Custom whitelist options
+								Built-in VPN
 							</div>
 						</div>
 					</div>
 					<div className="PremiumPromoModal__feature-column">
 						<div className="PremiumPromoModal__feature">
 							<span className="PremiumPromoModal__checked-circle-icon" />
 							<div className="PremiumPromoModal__feature-text">
-								Built-in VPN
+								Custom whitelist options
 							</div>
 						</div>
 						<div className="PremiumPromoModal__feature">
@@ -109,24 +106,27 @@ const PremiumPromoModal = (props) => {
 						</div>
 					</div>
 				</div>
-				<div className={buttonBackgroundClassNames}>
-					<div className="PremiumPromoModal__button basic" onClick={handleTryMidnightClick}>
-						<span className="side-padded">{t('select_basic')}</span>
-					</div>
-					<div onClick={handleGetPlusClick} className="PremiumPromoModal__button plus">
-						<span className="side-padded">{t('select_plus')}</span>
+				<div className="PremiumPromoModal__buttons-background">
+					<div className="PremiumPromoModal__button-container">
+						<div className="PremiumPromoModal__download-button" onClick={handleTryMidnightClick}>
+							<span>Download For Free</span>
+						</div>
 					</div>
-					{isInPanel && (
-						<div onClick={handleKeepBasicClick} className="PremiumPromoModal__text-link sign-in">
-							{t('already_subscribed_sign_in')}
+					<div className="PremiumPromoModal__text-link-container">
+						<div onClick={handleGetPlusClick} className="PremiumPromoModal__text-link">
+							Support Ghostery for $2/mo instead
 						</div>
-					)}
-					{isInPanel && (
-						<div onClick={handleXClick} className="requiredToCompileTEST" />
-					)}
-					{isInPanel && (
-						<div onClick={handleGoAwayClick} className="requiredToCompileTEST" />
-					)}
+						{isInHub && (
+							<div onClick={handleKeepBasicClick} className="PremiumPromoModal__text-link">
+								No thanks, continue with basic
+							</div>
+						)}
+						{isInPanel && (
+							<div onClick={handleGoAwayClick} className="PremiumPromoModal__text-link">
+								No thanks, turn promos off
+							</div>
+						)}
+					</div>
 				</div>
 			</div>
 		</Modal>