v2.1.0

README.md

@@ -1,5 +1,5 @@
 <p align="center">
-  <a href="https://github.com/victor-savinov/dark-mode"><img src="https://github.com/victor-savinov/icons/blob/master/dark-mode/raised-128.png"></a>
+  <a href="https://github.com/victor-savinov/dark-mode"><img src="https://github.com/victor-savinov/graphics/blob/master/icons/dark-mode/raised-128.png"></a>
 </p>
 
 <h3 align="center">Night Mode</h3>

_locales/ru/messages.json

@@ -9,13 +9,13 @@
         "message": "Внешний вид"
     },
     "areYouSureYouWantToDeleteTheSelectedWebsiteSettings": {
-        "message": "Are you sure you want to delete the selected website settings?"
+        "message": "Вы уверены, что хотите удалить выбранные настройки веб-сайта?"
     },
     "areYouSureYouWantToExportTheData": {
-        "message": "Are you sure you want to export the data?"
+        "message": "Вы действительно хотите экспортировать данные?"
     },
     "areYouSureYouWantToImportTheData": {
-        "message": "Are you sure you want to import the data?"
+        "message": "Вы действительно хотите испортировать данные?"
     },
     "audioFormats": {
         "message": "Форматы аудио"
@@ -36,7 +36,7 @@
         "message": "Отмена"
     },
     "colorTemperature": {
-        "message": "Color temperature"
+        "message": "Температура"
     },
     "contrast": {
         "message": "Контраст"
@@ -54,7 +54,7 @@
         "message": "Отключено"
     },
     "dynamicTheme": {
-        "message": "Dynamic theme"
+        "message": "Динамическая тема"
     },
     "excludeThisWebsite": {
         "message": "Исключить веб-сайт"
@@ -159,13 +159,13 @@
         "message": "Настройки"
     },
     "somethingWentWrongTryReloadingThePage": {
-        "message": "Something went wrong. Try reloading the page."
+        "message": "Что-то пошло не так. Попробуйте перезагрузить страницу."
     },
     "styles": {
         "message": "Стили"
     },
     "successfullyImportedSettings": {
-        "message": "Successfully imported settings"
+        "message": "Настройки успешно импортированы."
     },
     "sunsetToSunrise": {
         "message": "От заката до рассвета"
@@ -180,10 +180,10 @@
         "message": "Страница HOSTNAME защищна браузером."
     },
     "thisIsAnExperimentalFeatureDoYouWantToActivateIt": {
-        "message": "This is an experimental feature. Do you want to activate it?"
+        "message": "Это экспериментальная функция. Вы хотите это активировать?"
     },
     "thisWillResetAllSettings": {
-        "message": "This will reset all settings"
+        "message": "Вы действительно хотите сбросить все настройки?"
     },
     "timeFrom": {
         "message": "Время (от)"

content-scripts.js

@@ -42,7 +42,8 @@
 --------------------------------------------------------------*/
 
 var EXT = {
-    url: location.href,
+    url: location.hostname,
+    styles: [],
     elements: {},
     values: {},
     storage: {},
@@ -840,6 +841,7 @@ function elementStyle(node) {
     ) {
         if (node.sheet) {
             EXT.threads++;
+            EXT.child('added', node);
 
             createStyle(parseRules(node.sheet.cssRules), node.parentNode);
         }
@@ -868,6 +870,8 @@ function parseMutations(mutationList) {
                 if (node.nodeName === 'LINK') {
                     if (node.rel === 'stylesheet') {
                         if (ready && getGlobalOrLocale()['dynamic-theme']) {
+                            EXT.child('added', node);
+
                             elementLink(node);
                         }
                     }
@@ -877,6 +881,12 @@ function parseMutations(mutationList) {
                     }
                 }
             }
+
+            for (var j = 0, k = mutation.removedNodes.length; j < k; j++) {
+                var node = mutation.removedNodes[j];
+
+                EXT.child('removed', node);
+            }
         } else if (mutation.type === 'attributes') {
             if (mutation.attributeName === 'style') {
                 if (ready && getGlobalOrLocale()['dynamic-theme']) {
@@ -949,14 +959,9 @@ function parseRules(rules, parent, url) {
     if (EXT.threads === 0 && EXT.ready === false) {
         EXT.ready = true;
 
-        //queryLinks();
-        //queryStyles();
-
         document.documentElement.classList.add('dark-mode--ready');
     }
 
-    queryInlines();
-
     if (url) {
         string = string.replace(EXT.regex.url, function (match) {
             var result = match.replace(/url\(["']?/, '').replace(/["']?\)$/, '');
@@ -1280,4 +1285,36 @@ EXT.observer.observe(document, {
     ],
     childList: true,
     subtree: true
-});
+});
+
+
+/*--------------------------------------------------------------
+# HANDLERS
+--------------------------------------------------------------*/
+
+/*--------------------------------------------------------------
+# CHILD
+--------------------------------------------------------------*/
+
+EXT.child = function (type, element) {
+    var children = element.children,
+        index = EXT.styles.indexOf(element);
+
+    if (type === 'added') {
+        if (index === -1) {
+            EXT.styles.push(element);
+        }
+    } else if (type === 'removed') {
+        if (index !== -1) {
+            EXT.styles.splice(index, 1);
+        }
+    }
+
+    if (children) {
+        for (var i = 0, l = children.length; i < l; i++) {
+            var child = children[i];
+
+            EXT.child(type, child);
+        }
+    }
+};

manifest.json

@@ -1,7 +1,7 @@
 {
    "manifest_version": 2,
    "name": "Dark Mode",
-   "version": "2.0.12",
+   "version": "2.1.0",
    "description": "Dark Mode, read at night. Bluelight filter for every website. Relax your eyes at night and day.",
    "default_locale": "en",
    "icons": {

options.html

@@ -15,7 +15,7 @@
             }
         </style>
     </head>
-    <body>
+    <body theme="black">
         <link rel="stylesheet" href="satus.css">
         <link rel="stylesheet" href="popup.css">
         <script src="satus.js"></script>

popup.css

@@ -11,7 +11,7 @@
 # BASE
 --------------------------------------------------------------*/
 
-html {
+body[theme=black] {
     --satus-primary: rgb(255, 255, 255, .25);
     --satus-modal-background: #2b2e3b;
     --satus-modal-text: #dedfe3;
@@ -24,7 +24,8 @@ html {
     --satus-switch-track: #454d5f;
     --satus-switch-track--active: #375a6c;
     --satus-switch-thumb: #c6cad2;
-    --satus-tabs: #272935;
+    --satus-tabs-background: #1e2029;
+    --satus-tabs-foreground: #272935;
 }
 
 
@@ -43,10 +44,15 @@ html {
 # LAYERS
 --------------------------------------------------------------*/
 
+.satus-tabs {
+    width: 100%;
+    margin: 12px 0 4px;
+}
+
 .satus-switch--domain {
-    width: calc(100% - 24px);
+    width: 100%;
     height: 48px;
-    margin: 12px auto 0;
+    margin: 8px auto 0;
     padding: 0 16px;
     transition: 150ms;
     color: #7d95a1;
@@ -66,7 +72,6 @@ html {
 }
 
 .satus-alert {
-    width: calc(100% - 24px);
     margin: 12px auto 0;
 }
 
@@ -80,7 +85,7 @@ html {
 }
 
 .satus-section--styles {
-    margin: 8px;
+    margin: 8px 0;
     flex: 1;
 }
 
@@ -100,7 +105,7 @@ html {
 
 .satus-div--website-item {
     position: relative;
-    padding: 0;
+    padding: 0 !important;
 }
 
 .satus-button--favicon {

popup.html

@@ -14,7 +14,7 @@
 			}
 		</style>
 	</head>
-	<body>
+	<body theme="black">
 		<link rel="stylesheet" href="satus.css">
 		<link rel="stylesheet" href="popup.css">
 		<script src="satus.js"></script>