diff --git a/README.md b/README.md
index fd5e755..0e89f18 100644
--- a/README.md
+++ b/README.md
@@ -118,7 +118,22 @@ A list of objects describing map layers. Each object has at least `name`, `url`
#### mode (string)
-Allows to load a additional style for a night mode or similar use case. Style is attached to the mapLayer.
+Allows to load a additional style for a night mode or similar use case. Possible are inline style or link.
+Inline avoids re-rendering and maybe issues with label-layer update. Important are class "css-mode mode-name" and media "not".
+
+_Default is night.css inline in index.html_
+
+```html
+
+```
+
+or
+
+```html
+
+```
#### start (integer)
diff --git a/html/index.html b/html/index.html
index e972b56..c36bd6b 100644
--- a/html/index.html
+++ b/html/index.html
@@ -3,7 +3,10 @@
-
+
+
diff --git a/lib/map.js b/lib/map.js
index 992a0b0..39dec85 100644
--- a/lib/map.js
+++ b/lib/map.js
@@ -330,25 +330,15 @@ define(['map/clientlayer', 'map/labelslayer',
if (map.getZoom() > map.options.maxZoom) {
map.setZoom(map.options.maxZoom);
}
- if (helper.localStorageTest()) {
- localStorage.setItem('map/selectedLayer', JSON.stringify({ name: e.name }));
- }
- var cssMode = document.querySelector('.css-mode');
- if (cssMode) {
- cssMode.parentNode.removeChild(cssMode);
- document.querySelector('html').className = '';
+ var style = document.querySelector('.css-mode:not([media="not"])');
+ if (style && e.layer.options.mode !== '' && !style.classList.contains(e.layer.options.mode)) {
+ style.media = 'not';
labelsLayer.updateLayer();
}
if (e.layer.options.mode) {
- document.querySelector('head').innerHTML += "";
- document.querySelector('html').classList.add(e.layer.options.mode);
- var cssInterval = setInterval(function () {
- if (typeof document.querySelector('.css-mode').sheet.cssRules !== 'undefined') {
- labelsLayer.updateLayer();
- clearInterval(cssInterval);
- }
- }, 10);
+ document.querySelector('.css-mode.' + e.layer.options.mode).media = '';
+ labelsLayer.updateLayer();
}
});
diff --git a/scss/night.scss b/scss/night.scss
index 0c6cce3..ddaa1ce 100644
--- a/scss/night.scss
+++ b/scss/night.scss
@@ -5,7 +5,7 @@
$color-white: #111;
$color-black: #fefefe;
-.night {
+html {
//@import 'modules/base';
body {
background: $color-white;
diff --git a/tasks/build.js b/tasks/build.js
index 76efa5f..08ce777 100644
--- a/tasks/build.js
+++ b/tasks/build.js
@@ -42,24 +42,37 @@ module.exports = function exports(grunt) {
}
},
sass: {
+ files: [{
+ expand: true,
+ cwd: 'scss/',
+ src: '*.scss',
+ dest: 'build/',
+ ext: '.css'
+ }],
dev: {
options: {
sourceMap: true,
outputStyle: 'expanded'
},
- files: {
- 'build/style.css': 'scss/main.scss',
- 'build/night.css': 'scss/night.scss'
- }
+ files: [{
+ expand: true,
+ cwd: 'scss/',
+ src: '*.scss',
+ dest: 'build/',
+ ext: '.css'
+ }]
},
dist: {
options: {
outputStyle: 'compressed'
},
- files: {
- 'build/style.css': 'scss/main.scss',
- 'build/night.css': 'scss/night.scss'
- }
+ files: [{
+ expand: true,
+ cwd: 'scss/',
+ src: '*.scss',
+ dest: 'build/',
+ ext: '.css'
+ }]
}
},
postcss: {
diff --git a/tasks/clean.js b/tasks/clean.js
index 1691e13..60ba517 100644
--- a/tasks/clean.js
+++ b/tasks/clean.js
@@ -4,7 +4,7 @@ module.exports = function exports(grunt) {
grunt.config.merge({
clean: {
build: ['build/**/*', 'node_modules/grunt-newer/.cache'],
- release: ['build/vendor', 'build/*.map', 'build/config.json', 'build/style.css']
+ release: ['build/vendor', 'build/*.map', 'build/config.json', 'build/main.css']
}
});