diff --git a/src/html/settings.html b/src/html/settings.html index b2bcf68..8624f0a 100644 --- a/src/html/settings.html +++ b/src/html/settings.html @@ -102,6 +102,11 @@ + + Opacity : + + + Border Size : diff --git a/src/js/background.js b/src/js/background.js index 5f1738a..4e44552 100644 --- a/src/js/background.js +++ b/src/js/background.js @@ -117,6 +117,8 @@ app.Settings.init = function(callback){ // Load settings and nodes cells: { margin: 4, marginHover: 4, + opacity: 1, + opacityHover: 1, backgroundColor: null, backgroundColorHover: null, borderColor: '#333333', @@ -173,6 +175,8 @@ app.Settings.init = function(callback){ // Load settings and nodes app.Settings.save(); }); } + if(!data.settings.grid.cells.opacity) data.settings.grid.cells.opacity = 1; + if(!data.settings.grid.cells.opacityHover) data.settings.grid.cells.opacityHover = 1; if(!data.settings.grid.cells.borderSize) data.settings.grid.cells.borderSize = 1; if(!data.settings.grid.cells.borderSizeHover) data.settings.grid.cells.borderSizeHover = 1; if(!data.settings.grid.cells.titleBorderSize) data.settings.grid.cells.titleBorderSize = 1; diff --git a/src/js/dial.js b/src/js/dial.js index 1d3ae5b..b03189f 100644 --- a/src/js/dial.js +++ b/src/js/dial.js @@ -257,9 +257,9 @@ dial.initStyles = function(){ dial.styles.grid = {}; dial.styles.grid.grid = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid { border-collapse: collapse; margin: auto; }')].style; dial.styles.grid.cell = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td { margin: 0px; padding: 0px; }')].style; - dial.styles.grid.link = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a { display: block; outline: none; overflow: hidden; text-decoration: none; margin: ' + app.settings.grid.cells.margin + 'px; border: ' + app.settings.grid.cells.borderSize + 'px solid ' + app.settings.grid.cells.borderColor + '; border-radius: ' + app.settings.grid.cells.borderRadius + 'px; }')].style; + dial.styles.grid.link = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a { display: block; outline: none; overflow: hidden; text-decoration: none; margin: ' + app.settings.grid.cells.margin + 'px; opacity: ' + app.settings.grid.cells.opacity + '; border: ' + app.settings.grid.cells.borderSize + 'px solid ' + app.settings.grid.cells.borderColor + '; border-radius: ' + app.settings.grid.cells.borderRadius + 'px; }')].style; //dial.styles.grid.linkHover = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a:hover { border-color: ' + app.settings.grid.cells.borderColorHover + '; border-radius: ' + app.settings.grid.cells.borderRadiusHover + 'px; }')].style; - dial.styles.grid.linkHover = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a:hover { border-color: ' + app.settings.grid.cells.borderColorHover + '; margin: ' + app.settings.grid.cells.marginHover + 'px; border-radius: ' + app.settings.grid.cells.borderRadiusHover + 'px; }')].style; + dial.styles.grid.linkHover = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a:hover { border-color: ' + app.settings.grid.cells.borderColorHover + '; margin: ' + app.settings.grid.cells.marginHover + 'px; opacity: ' + app.settings.grid.cells.opacityHover + '; border-radius: ' + app.settings.grid.cells.borderRadiusHover + 'px; }')].style; dial.styles.grid.linkPanel = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a>div:first-child { background-repeat: no-repeat; }')].style; if(app.settings.grid.cells.backgroundColor) dial.styles.grid.linkPanel.backgroundColor = app.settings.grid.cells.backgroundColor; dial.styles.grid.linkPanelHover = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a:hover>div:first-child { }')].style; diff --git a/src/js/settings.js b/src/js/settings.js index 2859fe3..0e50091 100644 --- a/src/js/settings.js +++ b/src/js/settings.js @@ -40,6 +40,8 @@ app.init = function(){ GridFolderPreview.style.backgroundSize = '100% 100%'; GridCellsMargins.value = app.settings.grid.cells.margin; GridCellsMarginsHover.value = app.settings.grid.cells.marginHover; + GridCellsOpacity.value = app.settings.grid.cells.opacity * 100; + GridCellsOpacityHover.value = app.settings.grid.cells.opacityHover * 100; GridCellsBorderSize.value = app.settings.grid.cells.borderSize; GridCellsBorderSizeHover.value = app.settings.grid.cells.borderSizeHover; GridCellsBackgroundTransparent.checked = (app.settings.grid.cells.backgroundColor == null); @@ -78,6 +80,8 @@ app.init = function(){ app.settings.grid.cells.margin = +(GridCellsMargins.value); //app.settings.grid.cells.marginHover = +(GridCellsMarginsHover.value); app.settings.grid.cells.marginHover = +(GridCellsMargins.value); + app.settings.grid.cells.opacity = +(GridCellsOpacity.value) / 100; + app.settings.grid.cells.opacityHover = +(GridCellsOpacityHover.value) / 100; app.settings.grid.cells.borderSize = +(GridCellsBorderSize.value); //app.settings.grid.cells.borderSizeHover = +(GridCellsBorderSizeHover.value); if(GridCellsBackgroundTransparent.checked == true) app.settings.grid.cells.backgroundColor = null;