Skip to content

/ ghostery-extension

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

GH-1895 and GH-1896: CSS and string fixes for Edge #487

Merged
merged 3 commits into from Dec 17, 2019
+31 −34
Merged

GH-1895 and GH-1896: CSS and string fixes for Edge #487

Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
1e9c682
Ensure dollar sign and formatting look right in Premium promo modal i…
wlycdgr Dec 16, 2019
afc1beb
Merge branch 'develop' into premium-promo-modal-Edge-bugfixes
wlycdgr Dec 16, 2019
6d5d461
Text link container CSS fix for Edge
wlycdgr Dec 16, 2019
File filter
Filter file types
Jump to
Jump to file
Failed to load files.

Always

Just for now

Next
Loading status checks…
Ensure dollar sign and formatting look right in Premium promo modal i… 
…n both Edge and in normal browsers.
  • Loading branch information
@wlycdgr
wlycdgr committed Dec 16, 2019
commit 1e9c6829a2981e7e016381b76b28141ef6cc244b
6 _locales/en/messages.json
View file
Open in desktop
@@ -2353,8 +2353,7 @@
"message": "Try Ghostery Midnight"
},
"seven_day_free_trial": {
"message": "7 Day Free Trial ($$14/mo)",
"description": "Do not localize currency. Use the $14 USD amount. The second $ is needed to escape the special meaning of $"
"message": "7 Day Free Trial ($14/mo)"
},
"full_coverage_protection_promise": {
"message": "Get full-coverage protection across all browsers & apps on your device"
@@ -2375,8 +2374,7 @@
"message": "Download for free"
},
"support_ghostery_for_2_instead": {
"message": "Support Ghostery for $$2/mo instead",
"description": "Do not localize currency. Use the $2 USD amount. The second $ is needed to escape the special meaning of $"
"message": "Support Ghostery for $2/mo instead"
},
"no_thanks_continue_with_basic": {
"message": "No thanks, continue with basic"
6 app/shared-components/PremiumPromoModal/PremiumPromoModal.jsx
View file
Open in desktop
@@ -56,7 +56,7 @@ const PremiumPromoModal = (props) => {
<span>{t('try_ghostery_midnight')}</span>
<div className="PremiumPromoModal__header-beta-icon" />
</div>
<div className="PremiumPromoModal__header-text">{t('seven_day_free_trial')}</div>
<div className="PremiumPromoModal__header-text" dangerouslySetInnerHTML={{ __html: t('seven_day_free_trial') }} />
</div>
<div className="PremiumPromoModal__sub-header">
{t('full_coverage_protection_promise')}
@@ -99,9 +99,7 @@ const PremiumPromoModal = (props) => {
</div>
<div className="PremiumPromoModal__text-link-container">
{!isPlus && (
<div onClick={handleGetPlusClick} className="PremiumPromoModal__text-link">
{t('support_ghostery_for_2_instead')}
</div>
<div onClick={handleGetPlusClick} className="PremiumPromoModal__text-link" dangerouslySetInnerHTML={{ __html: t('support_ghostery_for_2_instead') }} />
)}
{isInHub && (
<div onClick={handleKeepBasicClick} className="PremiumPromoModal__text-link">
53 app/shared-components/PremiumPromoModal/PremiumPromoModal.scss
View file
Open in desktop
@@ -16,12 +16,12 @@ $standard-font-family: Roboto, "Open Sans", "Helvetica Neue", Helvetica, Arial,
$condensed-font-family: Roboto Condensed, "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;

.PremiumPromoModal__content {
position: relative;
z-index: 10;
width: 518px;
height: 437px;
border: solid 1.9px #720174;
background-color: #f7f7f7;
position: relative;
z-index: 10;
width: 518px;
height: 437px;
border: solid 1.9px #720174;
background-color: #f7f7f7;
}

.PremiumPromoModal__midnight-logo {
@@ -33,8 +33,8 @@ $condensed-font-family: Roboto Condensed, "Open Sans", "Helvetica Neue", Helveti

.PremiumPromoModal__header {
display: flex;
width: 100%;
justify-content: space-evenly;
width: 95%;
justify-content: space-around; // Edge does not support space-evenly
}

.PremiumPromoModal__header-text {
@@ -106,19 +106,20 @@ $condensed-font-family: Roboto Condensed, "Open Sans", "Helvetica Neue", Helveti
}

.PremiumPromoModal__buttons-background {
background-color: #e7ecee;
margin-bottom: 3px;
width: 99%;
height: 107px;
z-index: -1;
display: flex;
flex-direction: column;
justify-content: space-evenly
background-color: #e7ecee;
margin-bottom: 3px;
width: 99%;
height: 107px;
z-index: -1;
display: flex;
flex-direction: column;
justify-content: space-around; // Edge does not support space-evenly
}

.PremiumPromoModal__button-container {
display: flex;
justify-content: center;
margin-top: 10px;
}

.PremiumPromoModal__download-button {
@@ -150,17 +151,17 @@ $condensed-font-family: Roboto Condensed, "Open Sans", "Helvetica Neue", Helveti
}

.PremiumPromoModal__text-link-container {
display: flex;
justify-content: space-evenly;
display: flex;
justify-content: space-evenly;
This conversation was marked as resolved by wlycdgr

This comment has been minimized.

Sign in to view
@christophertino

christophertino Dec 16, 2019
Member

@wlycdgr Is this ok for Edge?

This comment has been minimized.

Sign in to view
@wlycdgr

wlycdgr Dec 16, 2019
Author Member

It is but it looks a little better with space-around. Pushing.

This comment has been minimized.

Sign in to view
@wlycdgr

wlycdgr Dec 16, 2019
Author Member

...fixed.
}

.PremiumPromoModal__text-link {
margin-left: 10px;
margin-right: 10px;
font-size: 15px;
font-family: $standard-font-family;
color: #4a4a4a;
text-decoration: underline;
text-align: center;
cursor: pointer;
margin-left: 10px;
margin-right: 10px;
font-size: 15px;
font-family: $standard-font-family;
color: #4a4a4a;
text-decoration: underline;
text-align: center;
cursor: pointer;
}
ProTip! Use n and p to navigate between commits in a pull request.