From 6c3ecbcc03ffda878b0eb2ffc82fb07ffabd7c49 Mon Sep 17 00:00:00 2001 From: Caleb Richelson Date: Tue, 17 Apr 2018 13:34:15 -0400 Subject: [PATCH 1/2] GH-955: Update Smart Blocking icon on Tracker List --- app/scss/panel.scss | 1 + app/scss/partials/_blocking.scss | 2 +- app/scss/partials/_blocking_tracker.scss | 10 ++-- app/scss/partials/_cliqz_features.scss | 16 ------ app/scss/partials/_colors.scss | 8 +-- app/scss/partials/_ghostery_features.scss | 8 --- app/scss/partials/_pause_button.scss | 16 ------ app/scss/partials/_placeholders.scss | 2 +- app/scss/partials/_svgs.scss | 68 +++++++++++++++++++++++ 9 files changed, 77 insertions(+), 54 deletions(-) create mode 100644 app/scss/partials/_svgs.scss diff --git a/app/scss/panel.scss b/app/scss/panel.scss index d176c9bf6..24d52d40d 100644 --- a/app/scss/panel.scss +++ b/app/scss/panel.scss @@ -46,6 +46,7 @@ html body { } // Partial View SASS files +@import './partials/_svgs'; @import './partials/_header'; @import './partials/_callout'; @import './partials/_summary'; diff --git a/app/scss/partials/_blocking.scss b/app/scss/partials/_blocking.scss index 085e37ab4..6180a5480 100644 --- a/app/scss/partials/_blocking.scss +++ b/app/scss/partials/_blocking.scss @@ -75,7 +75,7 @@ } &.smart-blocked .warning-image, &.smart-unblocked .warning-image { - background-image: buildSmartBlockIcon($button-purple); + background-image: buildIconSmartBlockingNoCircle(#1dafed); } } } diff --git a/app/scss/partials/_blocking_tracker.scss b/app/scss/partials/_blocking_tracker.scss index 284e40085..b48aeba93 100644 --- a/app/scss/partials/_blocking_tracker.scss +++ b/app/scss/partials/_blocking_tracker.scss @@ -5,7 +5,7 @@ * https://www.ghostery.com/ * * Copyright 2018 Ghostery, Inc. All rights reserved. - * + * * This Source Code Form is subject to the terms of the Mozilla Public * License, v. 2.0. If a copy of the MPL was not distributed with this * file, You can obtain one at http://mozilla.org/MPL/2.0 @@ -35,10 +35,10 @@ } .warning-image { display: block; - width: 18px; - height: 18px; - margin-right: 5px; - background-size: auto 18px; + width: 32px; + height: 25px; + margin-right: -12px; + background-size: auto 25px; background-repeat: no-repeat; } } diff --git a/app/scss/partials/_cliqz_features.scss b/app/scss/partials/_cliqz_features.scss index c9da5dcb4..5c8350567 100644 --- a/app/scss/partials/_cliqz_features.scss +++ b/app/scss/partials/_cliqz_features.scss @@ -11,22 +11,6 @@ * file, You can obtain one at http://mozilla.org/MPL/2.0 */ -@function buildIconAntiTracking($stroke-color) { - @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2250%22%20height%3D%2250%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cg%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20stroke-width%3D%222%22%20fill%3D%22none%22%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2225%22%20r%3D%2223%22/%3E%3Cpath%20d%3D%22M25.213%2015.032a.721.721%200%200%200-.426%200l-9.149%202.427a.82.82%200%200%200-.638.809c.043%206.514%203.532%2012.56%209.532%2016.604A.859.859%200%200%200%2025%2035c.17%200%20.34-.043.468-.128%206-4.045%209.49-10.09%209.532-16.604a.82.82%200%200%200-.638-.81l-9.15-2.426z%22/%3E%3C/g%3E%3C/svg%3E'); -} - -@function buildIconAdBlocking($stroke-color) { - @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2250%22%20height%3D%2250%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cg%3E%3Ccircle%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20cx%3D%2225%22%20cy%3D%2225%22%20r%3D%2223%22/%3E%3Cpath%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20fill-rule%3D%22nonzero%22%20transform%3D%22translate%2814%2C14%29%22%20d%3D%22M14.873%201.312l-7.973.07-5.588%205.686.07%207.973%205.686%205.589%207.973-.07%205.589-5.687-.07-7.973-5.687-5.588z%22/%3E%3Cpath%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20stroke-width%3D%222%22%20d%3D%22M31.5%2C18.5%20L18.5%2C31.5%22/%3E%3C/g%3E%3C/svg%3E'); -} - -@function buildIconSmartBlocking($stroke-color) { - @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2250%22%20height%3D%2250%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Ccircle%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20cx%3D%2225%22%20cy%3D%2225%22%20r%3D%2223%22/%3E%3Cpath%20fill%3D%22#{url-friendly-colour($stroke-color)}%22%20d%3D%22M31.977%2020.24c-.097%201.677-.697%203.156-1.654%204.514-.43.61-.867%201.217-1.285%201.84-.597.887-1.074%201.832-1.258%202.898-.03.175-.141.162-.263.162l-2.525-.001c-.832%200-1.663-.005-2.497.003-.181.002-.246-.05-.283-.238-.197-1.031-.657-1.954-1.241-2.818-.497-.733-1.015-1.454-1.514-2.187A8.257%208.257%200%200%201%2018.011%2020c-.112-2.82%201.486-5.279%204.185-6.42%203.458-1.462%207.547.004%209.166%203.293.521%201.062.682%202.19.615%203.365zM22.352%2032.3v-.63h5.305v.63h-5.305zm4.76%202.681h-4.216c-.508%200-.602-.108-.536-.653h5.28c.075.537-.022.653-.529.653zm6.238-18.576c-1.449-3.169-3.966-4.928-7.385-5.335-2.913-.348-5.446.61-7.511%202.673-2.305%202.306-2.858%205.124-2.19%208.241.351%201.63%201.149%203.046%202.104%204.39.438.617.869%201.243%201.271%201.883.372.593.635%201.241.661%201.946.03.814.008%201.627.008%202.441h.032c0%20.676-.001%201.351.002%202.027.006%201.204.952%202.22%202.15%202.3.158.01.21.056.25.214a2.322%202.322%200%200%200%204.524-.007c.034-.14.072-.194.225-.206a2.329%202.329%200%200%200%202.174-2.337c0-1.257.01-2.515-.003-3.774-.011-.941.208-1.816.706-2.61.402-.64.832-1.268%201.274-1.88%201.263-1.757%202.155-3.653%202.323-5.844.109-1.423-.018-2.816-.615-4.122z%22/%3E%3Cpath%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20stroke-width%3D%221.5%22%20fill%3D%22none%22%20d%3D%22M25.096%2018.214a.324.324%200%200%200-.192%200l-4.117%201.092a.37.37%200%200%200-.287.364c.02%202.932%201.59%205.652%204.29%207.472a.387.387%200%200%200%20.21.058c.077%200%20.153-.02.21-.058%202.7-1.82%204.27-4.54%204.29-7.472a.37.37%200%200%200-.287-.364l-4.117-1.092z%22/%3E%3C/svg%3E'); -} - -@function buildIconDash($stroke-color) { - @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2210%22%20height%3D%2210%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20stroke-width%3D%223%22%20d%3D%22M1%205h8%22/%3E%3C/svg%3E'); -} - .sub-component.cliqz-features { .cliqz-feature { display: inline-block; diff --git a/app/scss/partials/_colors.scss b/app/scss/partials/_colors.scss index c9981bdd0..e81faafbf 100644 --- a/app/scss/partials/_colors.scss +++ b/app/scss/partials/_colors.scss @@ -8,7 +8,7 @@ * https://www.ghostery.com/ * * Copyright 2018 Ghostery, Inc. All rights reserved. - * + * * This Source Code Form is subject to the terms of the Mozilla Public * License, v. 2.0. If a copy of the MPL was not distributed with this * file, You can obtain one at http://mozilla.org/MPL/2.0 @@ -56,9 +56,3 @@ $transparent-green: rgba($apple, 0.08); $transparent-red: rgba($red, 0.08); /* ADD PROJECT COLORS HERE */ - -$button-grey: 979797; -$button-dark-grey: 4A4A4A; -$button-purple: 930194; -$button-white: ffffff; -$button-purple-f: unquote("##{$button-purple}"); diff --git a/app/scss/partials/_ghostery_features.scss b/app/scss/partials/_ghostery_features.scss index d099aeb93..954152bf6 100644 --- a/app/scss/partials/_ghostery_features.scss +++ b/app/scss/partials/_ghostery_features.scss @@ -11,14 +11,6 @@ * file, You can obtain one at http://mozilla.org/MPL/2.0 */ -@function buildIconTrust($stroke-color) { - @return url('data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20width%3D%2214%22%20height%3D%2214%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22>%3Ccircle%20cx%3D%227%22%20cy%3D%227%22%20r%3D%226%22%20stroke-width%3D%222%22%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20fill%3D%22none%22/%3E%3C/svg%3E'); -} - -@function buildIconRestrict($stroke-color) { - @return url('data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20width%3D%2214%22%20height%3D%2214%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cg%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20fill%3D%22none%22%20stroke-width%3D%222%22%3E%3Ccircle%20cx%3D%227%22%20cy%3D%227%22%20r%3D%226%22/%3E%3Cpath%20d%3D%22M3%203l8%208%22/%3E%3C/g%3E%3C/svg%3E'); -} - .sub-component.ghostery-features { .button { width: 150px; diff --git a/app/scss/partials/_pause_button.scss b/app/scss/partials/_pause_button.scss index 8190b3042..9b7f67d3a 100644 --- a/app/scss/partials/_pause_button.scss +++ b/app/scss/partials/_pause_button.scss @@ -11,22 +11,6 @@ * file, You can obtain one at http://mozilla.org/MPL/2.0 */ -@function buildIconPause($stroke-color) { - @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width=%2214%22%20height=%2216%22%20xmlns=%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d=%22M1%2015h3V1H1v14zM9%201v14h3V1H9z%22%20fill=%22#{url-friendly-colour($stroke-color)}%22/%3E%3C/svg%3E'); -} - -@function buildIconPlay($stroke-color) { - @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width=%2214%22%20height=%2216%22%20xmlns=%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d=%22M12.74%207.543a.532.532%200%200%201%200%20.915L1.782%2014.92c-.322.222-.783-.045-.783-.458V1.54c0-.378.44-.693.783-.458l10.956%206.462zM2.043%2013.547L11.435%208%202.044%202.454v11.093z%22%20fill=%22#{url-friendly-colour($stroke-color)}%22/%3E%3C/svg%3E'); -} - -@function buildIconCaretDown($stroke-color) { - @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width=%229%22%20height=%225%22%20xmlns=%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d=%22M0%200h9L4.5%205%200%200%22%20fill=%22#{url-friendly-colour($stroke-color)}%22/%3E%3C/svg%3E'); -} - -@function buildIconCircle($stroke-color) { - @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width=%224%22%20height=%224%22%20xmlns=%22http%3A//www.w3.org/2000/svg%22%3E%3Ccircle%20cx=%222%22%20cy=%222%22%20r=%222%22%20fill=%22#{url-friendly-colour($stroke-color)}%22/%3E%3C/svg%3E'); -} - .sub-component.pause-button { .button { color: #4a4a4a; diff --git a/app/scss/partials/_placeholders.scss b/app/scss/partials/_placeholders.scss index 688ca67d9..d914669d2 100644 --- a/app/scss/partials/_placeholders.scss +++ b/app/scss/partials/_placeholders.scss @@ -8,7 +8,7 @@ * https://www.ghostery.com/ * * Copyright 2018 Ghostery, Inc. All rights reserved. - * + * * This Source Code Form is subject to the terms of the Mozilla Public * License, v. 2.0. If a copy of the MPL was not distributed with this * file, You can obtain one at http://mozilla.org/MPL/2.0 diff --git a/app/scss/partials/_svgs.scss b/app/scss/partials/_svgs.scss new file mode 100644 index 000000000..f33625732 --- /dev/null +++ b/app/scss/partials/_svgs.scss @@ -0,0 +1,68 @@ +/** + * SVGs Sass + * + * Ghostery Browser Extension + * https://www.ghostery.com/ + * + * Copyright 2018 Ghostery, Inc. All rights reserved. + * + * This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0 + */ + +// Used in Blocking +@function buildIconSmartBlockingNoCircle($stroke-color) { + @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2250%22%20height%3D%2250%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20fill%3D%22#{url-friendly-colour($stroke-color)}%22%20d%3D%22M31.977%2020.24c-.097%201.677-.697%203.156-1.654%204.514-.43.61-.867%201.217-1.285%201.84-.597.887-1.074%201.832-1.258%202.898-.03.175-.141.162-.263.162l-2.525-.001c-.832%200-1.663-.005-2.497.003-.181.002-.246-.05-.283-.238-.197-1.031-.657-1.954-1.241-2.818-.497-.733-1.015-1.454-1.514-2.187A8.257%208.257%200%200%201%2018.011%2020c-.112-2.82%201.486-5.279%204.185-6.42%203.458-1.462%207.547.004%209.166%203.293.521%201.062.682%202.19.615%203.365zM22.352%2032.3v-.63h5.305v.63h-5.305zm4.76%202.681h-4.216c-.508%200-.602-.108-.536-.653h5.28c.075.537-.022.653-.529.653zm6.238-18.576c-1.449-3.169-3.966-4.928-7.385-5.335-2.913-.348-5.446.61-7.511%202.673-2.305%202.306-2.858%205.124-2.19%208.241.351%201.63%201.149%203.046%202.104%204.39.438.617.869%201.243%201.271%201.883.372.593.635%201.241.661%201.946.03.814.008%201.627.008%202.441h.032c0%20.676-.001%201.351.002%202.027.006%201.204.952%202.22%202.15%202.3.158.01.21.056.25.214a2.322%202.322%200%200%200%204.524-.007c.034-.14.072-.194.225-.206a2.329%202.329%200%200%200%202.174-2.337c0-1.257.01-2.515-.003-3.774-.011-.941.208-1.816.706-2.61.402-.64.832-1.268%201.274-1.88%201.263-1.757%202.155-3.653%202.323-5.844.109-1.423-.018-2.816-.615-4.122z%22/%3E%3Cpath%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20stroke-width%3D%221.5%22%20fill%3D%22none%22%20d%3D%22M25.096%2018.214a.324.324%200%200%200-.192%200l-4.117%201.092a.37.37%200%200%200-.287.364c.02%202.932%201.59%205.652%204.29%207.472a.387.387%200%200%200%20.21.058c.077%200%20.153-.02.21-.058%202.7-1.82%204.27-4.54%204.29-7.472a.37.37%200%200%200-.287-.364l-4.117-1.092z%22/%3E%3C/svg%3E'); +} + + +// Used in Cliqz Features +@function buildIconAntiTracking($stroke-color) { + @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2250%22%20height%3D%2250%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cg%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20stroke-width%3D%222%22%20fill%3D%22none%22%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2225%22%20r%3D%2223%22/%3E%3Cpath%20d%3D%22M25.213%2015.032a.721.721%200%200%200-.426%200l-9.149%202.427a.82.82%200%200%200-.638.809c.043%206.514%203.532%2012.56%209.532%2016.604A.859.859%200%200%200%2025%2035c.17%200%20.34-.043.468-.128%206-4.045%209.49-10.09%209.532-16.604a.82.82%200%200%200-.638-.81l-9.15-2.426z%22/%3E%3C/g%3E%3C/svg%3E'); +} + +// Used in Cliqz Features +@function buildIconAdBlocking($stroke-color) { + @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2250%22%20height%3D%2250%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cg%3E%3Ccircle%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20cx%3D%2225%22%20cy%3D%2225%22%20r%3D%2223%22/%3E%3Cpath%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20fill-rule%3D%22nonzero%22%20transform%3D%22translate%2814%2C14%29%22%20d%3D%22M14.873%201.312l-7.973.07-5.588%205.686.07%207.973%205.686%205.589%207.973-.07%205.589-5.687-.07-7.973-5.687-5.588z%22/%3E%3Cpath%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20stroke-width%3D%222%22%20d%3D%22M31.5%2C18.5%20L18.5%2C31.5%22/%3E%3C/g%3E%3C/svg%3E'); +} + +// Used in Cliqz Features +@function buildIconSmartBlocking($stroke-color) { + @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2250%22%20height%3D%2250%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Ccircle%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20stroke-width%3D%222%22%20fill%3D%22none%22%20cx%3D%2225%22%20cy%3D%2225%22%20r%3D%2223%22/%3E%3Cpath%20fill%3D%22#{url-friendly-colour($stroke-color)}%22%20d%3D%22M31.977%2020.24c-.097%201.677-.697%203.156-1.654%204.514-.43.61-.867%201.217-1.285%201.84-.597.887-1.074%201.832-1.258%202.898-.03.175-.141.162-.263.162l-2.525-.001c-.832%200-1.663-.005-2.497.003-.181.002-.246-.05-.283-.238-.197-1.031-.657-1.954-1.241-2.818-.497-.733-1.015-1.454-1.514-2.187A8.257%208.257%200%200%201%2018.011%2020c-.112-2.82%201.486-5.279%204.185-6.42%203.458-1.462%207.547.004%209.166%203.293.521%201.062.682%202.19.615%203.365zM22.352%2032.3v-.63h5.305v.63h-5.305zm4.76%202.681h-4.216c-.508%200-.602-.108-.536-.653h5.28c.075.537-.022.653-.529.653zm6.238-18.576c-1.449-3.169-3.966-4.928-7.385-5.335-2.913-.348-5.446.61-7.511%202.673-2.305%202.306-2.858%205.124-2.19%208.241.351%201.63%201.149%203.046%202.104%204.39.438.617.869%201.243%201.271%201.883.372.593.635%201.241.661%201.946.03.814.008%201.627.008%202.441h.032c0%20.676-.001%201.351.002%202.027.006%201.204.952%202.22%202.15%202.3.158.01.21.056.25.214a2.322%202.322%200%200%200%204.524-.007c.034-.14.072-.194.225-.206a2.329%202.329%200%200%200%202.174-2.337c0-1.257.01-2.515-.003-3.774-.011-.941.208-1.816.706-2.61.402-.64.832-1.268%201.274-1.88%201.263-1.757%202.155-3.653%202.323-5.844.109-1.423-.018-2.816-.615-4.122z%22/%3E%3Cpath%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20stroke-width%3D%221.5%22%20fill%3D%22none%22%20d%3D%22M25.096%2018.214a.324.324%200%200%200-.192%200l-4.117%201.092a.37.37%200%200%200-.287.364c.02%202.932%201.59%205.652%204.29%207.472a.387.387%200%200%200%20.21.058c.077%200%20.153-.02.21-.058%202.7-1.82%204.27-4.54%204.29-7.472a.37.37%200%200%200-.287-.364l-4.117-1.092z%22/%3E%3C/svg%3E'); +} + +// Used in Cliqz Features +@function buildIconDash($stroke-color) { + @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2210%22%20height%3D%2210%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20stroke-width%3D%223%22%20d%3D%22M1%205h8%22/%3E%3C/svg%3E'); +} + +// Used in Ghostery Features +@function buildIconTrust($stroke-color) { + @return url('data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20width%3D%2214%22%20height%3D%2214%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22>%3Ccircle%20cx%3D%227%22%20cy%3D%227%22%20r%3D%226%22%20stroke-width%3D%222%22%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20fill%3D%22none%22/%3E%3C/svg%3E'); +} + +// Used in Ghostery Features +@function buildIconRestrict($stroke-color) { + @return url('data:image/svg+xml;charset%3DUS-ASCII,%3Csvg%20width%3D%2214%22%20height%3D%2214%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cg%20stroke%3D%22#{url-friendly-colour($stroke-color)}%22%20fill%3D%22none%22%20stroke-width%3D%222%22%3E%3Ccircle%20cx%3D%227%22%20cy%3D%227%22%20r%3D%226%22/%3E%3Cpath%20d%3D%22M3%203l8%208%22/%3E%3C/g%3E%3C/svg%3E'); +} + +// Used in Pause Button +@function buildIconPause($stroke-color) { + @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width=%2214%22%20height=%2216%22%20xmlns=%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d=%22M1%2015h3V1H1v14zM9%201v14h3V1H9z%22%20fill=%22#{url-friendly-colour($stroke-color)}%22/%3E%3C/svg%3E'); +} + +// Used in Pause Button +@function buildIconPlay($stroke-color) { + @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width=%2214%22%20height=%2216%22%20xmlns=%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d=%22M12.74%207.543a.532.532%200%200%201%200%20.915L1.782%2014.92c-.322.222-.783-.045-.783-.458V1.54c0-.378.44-.693.783-.458l10.956%206.462zM2.043%2013.547L11.435%208%202.044%202.454v11.093z%22%20fill=%22#{url-friendly-colour($stroke-color)}%22/%3E%3C/svg%3E'); +} + +// Used in Pause Button +@function buildIconCaretDown($stroke-color) { + @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width=%229%22%20height=%225%22%20xmlns=%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d=%22M0%200h9L4.5%205%200%200%22%20fill=%22#{url-friendly-colour($stroke-color)}%22/%3E%3C/svg%3E'); +} + +// Used in Pause Button +@function buildIconCircle($stroke-color) { + @return url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width=%224%22%20height=%224%22%20xmlns=%22http%3A//www.w3.org/2000/svg%22%3E%3Ccircle%20cx=%222%22%20cy=%222%22%20r=%222%22%20fill=%22#{url-friendly-colour($stroke-color)}%22/%3E%3C/svg%3E'); +} From 2b71d230a6cf6f30891a9cab295ebbcf7b7267d9 Mon Sep 17 00:00:00 2001 From: Caleb Richelson Date: Tue, 17 Apr 2018 13:41:08 -0400 Subject: [PATCH 2/2] GH-954: Fix spelling error for Anti-Tracking ON notification --- _locales/en/messages.json | 2 +- package-lock.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/_locales/en/messages.json b/_locales/en/messages.json index 762670881..b3c4f4956 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -1192,7 +1192,7 @@ "message": "Ghostery extension has been resumed." }, "alert_anti_track_on": { - "message": "Enhanced Anti-Trackng ON. Personal data will be anonymized." + "message": "Enhanced Anti-Tracking ON. Personal data will be anonymized." }, "alert_anti_track_off": { "message": "Enhanced Anti-Tracking OFF. Personal data will not be anonymized." diff --git a/package-lock.json b/package-lock.json index 846cc6f73..ec51a8159 100644 --- a/package-lock.json +++ b/package-lock.json @@ -272,7 +272,7 @@ }, "@sinonjs/formatio": { "version": "2.0.0", - "resolved": "http://registry.npmjs.org/@sinonjs/formatio/-/formatio-2.0.0.tgz", + "resolved": "https://registry.npmjs.org/@sinonjs/formatio/-/formatio-2.0.0.tgz", "integrity": "sha512-ls6CAMA6/5gG+O/IdsBcblvnd8qcO/l1TYoNeAzp3wcISOxlPXQEus0mLcdwazEkWjaBdaJ3TaxmNgCLWwvWzg==", "dev": true, "requires": {