From 0ed37c2667ec3bb5c7e02eff6baf30c6abfe5121 Mon Sep 17 00:00:00 2001 From: tophf Date: Tue, 14 Nov 2017 11:13:03 +0300 Subject: [PATCH] popup: add side borders in Chrome 62+ fixes #226 --- _locales/en/messages.json | 6 ++++++ js/prefs.js | 1 + options.html | 7 +++++++ popup/popup.js | 17 +++++++++++++++++ 4 files changed, 31 insertions(+) diff --git a/_locales/en/messages.json b/_locales/en/messages.json index 2c9aff70..44823873 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -593,6 +593,12 @@ "message": "Stylus failed to parse usercss:", "description": "The error message to show when stylus failed to parse usercss" }, + "popupBorders": { + "message": "Add white borders on the sides" + }, + "popupBordersTooltip": { + "message": "Useful for dark themes in new Chrome as it no longer paints the side borders" + }, "popupManageTooltip": { "message": "Shift-click or right-click opens manager with styles applicable for current site", "description": "Tooltip for the 'Manage' button in the popup." diff --git a/js/prefs.js b/js/prefs.js index 0b576b77..d90cea8e 100644 --- a/js/prefs.js +++ b/js/prefs.js @@ -15,6 +15,7 @@ var prefs = new function Prefs() { 'popup.breadcrumbs.usePath': false, // use URL path for 'this URL' 'popup.enabledFirst': true, // display enabled styles before disabled styles 'popup.stylesFirst': true, // display enabled styles before disabled styles + 'popup.borders': false, // add white borders on the sides 'manage.onlyEnabled': false, // display only enabled styles 'manage.onlyLocal': false, // display only styles created locally diff --git a/options.html b/options.html index 5c90d83f..87e4f0ef 100644 --- a/options.html +++ b/options.html @@ -93,6 +93,13 @@ + diff --git a/popup/popup.js b/popup/popup.js index b20b9e47..eff7f6db 100644 --- a/popup/popup.js +++ b/popup/popup.js @@ -8,6 +8,8 @@ const handleEvent = {}; const ENTRY_ID_PREFIX_RAW = 'style-'; const ENTRY_ID_PREFIX = '#' + ENTRY_ID_PREFIX_RAW; +toggleSideBorders(); + getActiveTab().then(tab => FIREFOX && tab.url === 'about:blank' && tab.status === 'loading' ? getTabRealURLFirefox(tab) @@ -45,6 +47,8 @@ function onRuntimeMessage(msg) { document.body.insertBefore(installed, before); } else if ('popupWidth' in msg.prefs) { setPopupWidth(msg.prefs.popupWidth); + } else if ('popup.borders' in msg.prefs) { + toggleSideBorders(msg.prefs['popup.borders']); } break; } @@ -57,6 +61,19 @@ function setPopupWidth(width = prefs.get('popupWidth')) { } +function toggleSideBorders(state = prefs.get('popup.borders')) { + // runs before is parsed + const style = document.documentElement.style; + if (CHROME >= 3167 && state) { + style.cssText += + 'border-left: 2px solid white !important;' + + 'border-right: 2px solid white !important;'; + } else if (style.cssText) { + style.borderLeft = style.borderRight = ''; + } +} + + function initPopup(url) { installed = $('#installed');