diff --git a/src/html/settings.html b/src/html/settings.html
index 5441286..b2bcf68 100644
--- a/src/html/settings.html
+++ b/src/html/settings.html
@@ -12,6 +12,7 @@
input[type=color] { width: 60px; }
.hidden { display: none; }
.Tab>table { width: 100%; border-collapse: collapse; }
+ .Tab>div { overflow: auto; }
.Tab .TabSpace { width: 100%; border-bottom: solid 1px #505050; }
.Tab .TabButton { border: solid 1px #505050; padding: 2px 6px 2px 6px; cursor: default; }
.Tab .TabButtonActive { border: solid 1px #505050; border-bottom: none; padding: 2px 6px 2px 6px; cursor: default; }
@@ -101,6 +102,11 @@
|
|
+
+ Border Size : |
+ |
+ |
+
Border Radius : |
|
@@ -136,6 +142,11 @@
|
|
+
+ Title Border Size : |
+ |
+ |
+
Title Text Color : |
|
diff --git a/src/js/background.js b/src/js/background.js
index da61ffd..5f1738a 100644
--- a/src/js/background.js
+++ b/src/js/background.js
@@ -123,6 +123,8 @@ app.Settings.init = function(callback){ // Load settings and nodes
borderColorHover: '#a9a9a9',
borderRadius: 4,
borderRadiusHover: 4,
+ borderSize: 1,
+ borderSizeHover: 1,
title: true,
titleHeight: 16,
titleFontSize: 10,
@@ -131,6 +133,8 @@ app.Settings.init = function(callback){ // Load settings and nodes
titleColorHover: '#33ccff',
titleBackgroundColor: null,
titleBackgroundColorHover: null,
+ titleBorderSize: 1,
+ titleBorderSizeHover: 1,
previewWidth: 1200,
previewHeight: 710
},
@@ -169,6 +173,10 @@ app.Settings.init = function(callback){ // Load settings and nodes
app.Settings.save();
});
}
+ 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;
+ if(!data.settings.grid.cells.titleBorderSizeHover) data.settings.grid.cells.titleBorderSizeHover = 1;
app.settings = data.settings;
app.node = data.node;
if(callback) callback();
diff --git a/src/js/dial.js b/src/js/dial.js
index 067c468..1d3ae5b 100644
--- a/src/js/dial.js
+++ b/src/js/dial.js
@@ -257,14 +257,14 @@ 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: 1px 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; 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.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;
if(app.settings.grid.cells.backgroundColorHover) dial.styles.grid.linkPanelHover.backgroundColor = app.settings.grid.cells.backgroundColorHover;
- dial.styles.grid.linkTitle = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a>div:last-child { height: ' + app.settings.grid.cells.titleHeight + 'px; font-size: ' + app.settings.grid.cells.titleFontSize + 'pt; font-family: ' + app.settings.grid.cells.titleFont + 'pt; text-align: center; overflow: hidden; color: ' + app.settings.grid.cells.titleColor + '; border-top: 1px solid ' + app.settings.grid.cells.borderColor + '; }')].style;
+ dial.styles.grid.linkTitle = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a>div:last-child { height: ' + app.settings.grid.cells.titleHeight + 'px; font-size: ' + app.settings.grid.cells.titleFontSize + 'pt; font-family: ' + app.settings.grid.cells.titleFont + 'pt; text-align: center; overflow: hidden; color: ' + app.settings.grid.cells.titleColor + '; border-top: ' + app.settings.grid.cells.titleBorderSize + 'px solid ' + app.settings.grid.cells.borderColor + '; }')].style;
if(app.settings.grid.cells.titleBackgroundColor) dial.styles.grid.linkTitle.backgroundColor = app.settings.grid.cells.titleBackgroundColor;
dial.styles.grid.linkTitleHover = dial.Style.sheet.cssRules[dial.Style.sheet.insertRule('.Grid td>a:hover>div:last-child { color: ' + app.settings.grid.cells.titleColorHover + '; border-top-color: ' + app.settings.grid.cells.borderColorHover + ' }')].style;
if(app.settings.grid.cells.titleBackgroundColorHover) dial.styles.grid.linkTitleHover.backgroundColor = app.settings.grid.cells.titleBackgroundColorHover;
@@ -364,8 +364,8 @@ dial.updateGridLayout = function(){
dial.styles.grid.cell.width = linkWidth.toString() + 'px';
dial.styles.grid.cell.height = linkHeight.toString() + 'px';
- linkWidth = linkWidth - 2 * (app.settings.grid.cells.margin + 1);
- linkHeight = linkHeight - 2 * (app.settings.grid.cells.margin + 1);
+ linkWidth = linkWidth - 2 * (app.settings.grid.cells.margin + 1) - 2 * app.settings.grid.cells.borderSize;
+ linkHeight = linkHeight - 2 * (app.settings.grid.cells.margin + 1) - 2 * app.settings.grid.cells.borderSize - app.settings.grid.cells.titleBorderSize;
dial.styles.grid.link.width = linkWidth.toString() + 'px';
dial.styles.grid.link.height = linkHeight.toString() + 'px';
diff --git a/src/js/settings.js b/src/js/settings.js
index 6d46cb0..2859fe3 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;
+ GridCellsBorderSize.value = app.settings.grid.cells.borderSize;
+ GridCellsBorderSizeHover.value = app.settings.grid.cells.borderSizeHover;
GridCellsBackgroundTransparent.checked = (app.settings.grid.cells.backgroundColor == null);
GridCellsBackgroundColor.value = app.settings.grid.cells.backgroundColor;
GridCellsBackgroundTransparentHover.checked = (app.settings.grid.cells.backgroundColorHover == null);
@@ -51,6 +53,7 @@ app.init = function(){
GridCellsTitle.checked = app.settings.grid.cells.title;
GridCellsTitleHeight.value = app.settings.grid.cells.titleHeight;
GridCellsTitleFontSize.value = app.settings.grid.cells.titleFontSize;
+ GridCellsTitleBorderSize.value = app.settings.grid.cells.titleBorderSize;
GridCellsTitleColor.value = app.settings.grid.cells.titleColor;
GridCellsTitleColorHover.value = app.settings.grid.cells.titleColorHover;
GridCellsTitleBackgroundTransparent.checked = (app.settings.grid.cells.titleBackgroundColor == null);
@@ -75,6 +78,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.borderSize = +(GridCellsBorderSize.value);
+ //app.settings.grid.cells.borderSizeHover = +(GridCellsBorderSizeHover.value);
if(GridCellsBackgroundTransparent.checked == true) app.settings.grid.cells.backgroundColor = null;
else app.settings.grid.cells.backgroundColor = GridCellsBackgroundColor.value;
if(GridCellsBackgroundTransparentHover.checked == true) app.settings.grid.cells.backgroundColorHover = null;
@@ -86,6 +91,7 @@ app.init = function(){
app.settings.grid.cells.title = GridCellsTitle.checked;
app.settings.grid.cells.titleHeight = GridCellsTitleHeight.value;
app.settings.grid.cells.titleFontSize = GridCellsTitleFontSize.value;
+ app.settings.grid.cells.titleBorderSize = GridCellsTitleBorderSize.value;
app.settings.grid.cells.titleColor = GridCellsTitleColor.value;
app.settings.grid.cells.titleColorHover = GridCellsTitleColorHover.value;
if(GridCellsTitleBackgroundTransparent.checked == true) app.settings.grid.cells.titleBackgroundColor = null;