[feature] add tile shadow options

Author: zombieFox

package.json

@@ -1,6 +1,6 @@
 {
 "name": "nighttab",
-"version": "3.81.0",
+"version": "3.82.0",
 "description": "A neutral new tab page accented with a chosen colour. Customise the layout, style, background and bookmarks in nightTab.",
 "main": "index.js",
 "scripts":{

src/css/link.css

@@ -131,12 +131,9 @@
 text-decoration: none;
 }
 
-.link-item:focus .link-panel-front,
-.link-item:focus-within .link-panel-front,
-.link-item:hover .link-panel-front{
-text-decoration: none;
-outline: none;
-background-color:rgb(var(--theme-gray-03));
+.is-link-item-shadow-show .link-item:focus .link-panel-front,
+.is-link-item-shadow-show .link-item:focus-within .link-panel-front,
+.is-link-item-shadow-show .link-item:hover .link-panel-front{
 box-shadow:var(--layout-shadow-large);
 }
 
@@ -547,7 +544,12 @@
 .is-link-edit .link-item:hover .link-panel-front,
 .is-link-edit .link-item:focus .link-panel-front{
 height:calc(100%-var(--link-item-edit-height));
-box-shadow:var(--layout-shadow-small);
+}
+
+.is-link-item-shadow-show.is-link-edit .link-panel-front,
+.is-link-item-shadow-show.is-link-edit .link-item:hover .link-panel-front,
+.is-link-item-shadow-show.is-link-edit .link-item:focus .link-panel-front{
+box-shadow:var(--layout-shadow-medium);
 }
 
 .is-link-edit.is-link-item-url-show .link-item:focus .link-panel-front,

src/index.html

@@ -903,6 +903,11 @@ <h1 class="menu-item-header-text">Bookmarks</h1>
 <labelfor="control-link-item-line-show">Tile line</label>
 </div>
 <hr>
+<divclass="input-wrap">
+<inputid="control-link-item-shadow-show" class="control-link-item-shadow-show" type="checkbox" tabindex="-1">
+<labelfor="control-link-item-shadow-show">Tile shadow</label>
+</div>
+<hr>
 <divclass="input-wrap">
 <inputid="control-link-item-hoverscale" class="control-link-item-hoverscale" type="checkbox" tabindex="-1">
 <labelfor="control-link-item-hoverscale">Grow on tile hover</label>

src/js/control.js

@@ -1947,6 +1947,13 @@ var control = (function(){
 func: function(){
 render.class();
 }
+},{
+element: helper.e(".control-link-item-shadow-show"),
+path: "link.item.shadow.show",
+type: "checkbox",
+func: function(){
+render.class();
+}
 },{
 element: helper.e(".control-link-item-name-show"),
 path: "link.item.name.show",
@@ -2531,6 +2538,7 @@ var control = (function(){
 helper.removeClass(html,"is-link-display-alignment-bottomright");
 helper.removeClass(html,"is-link-item-url-show");
 helper.removeClass(html,"is-link-item-line-show");
+helper.removeClass(html,"is-link-item-shadow-show");
 helper.removeClass(html,"is-link-item-hoverscale");
 helper.removeClass(html,"is-link-item-alignment-left");
 helper.removeClass(html,"is-link-item-alignment-center");
@@ -2559,6 +2567,9 @@ var control = (function(){
 if(state.get().link.item.line.show){
 helper.addClass(html,"is-link-item-line-show");
 };
+if(state.get().link.item.shadow.show){
+helper.addClass(html,"is-link-item-shadow-show");
+};
 if(state.get().link.item.hoverScale){
 helper.addClass(html,"is-link-item-hoverscale");
 };
@@ -2969,6 +2980,7 @@ var control = (function(){
 _disable.element(".control-link-item-order-namedisplay-helper",true);
 _disable.input(".control-link-item-url-show",true);
 _disable.input(".control-link-item-line-show",true);
+_disable.input(".control-link-item-shadow-show",true);
 _disable.input(".control-link-item-hoverscale",true);
 _disable.element(".control-link-item-display-alignment-grid",true);
 _disable.element(".control-link-item-display-alignment-label",true);
@@ -3015,6 +3027,7 @@ var control = (function(){
 _disable.input(".control-link-item-name-show",false);
 _disable.input(".control-link-item-url-show",false);
 _disable.input(".control-link-item-line-show",false);
+_disable.input(".control-link-item-shadow-show",false);
 _disable.input(".control-link-item-hoverscale",false);
 _disable.input(".control-link-newtab",false);
 _disable.input(".control-link-style-block",false);

src/js/state.js

@@ -159,6 +159,9 @@ var state = (function(){
 line: {
 show: true
 },
+shadow: {
+show: true
+},
 hoverScale: {
 show: true
 },

src/js/update.js

@@ -612,6 +612,12 @@ var update = (function(){
 "3.81.0": function(data){
 data.state.link.orientation="bottom";
 returndata;
+},
+"3.82.0": function(data){
+data.state.link.item.shadow={
+show: true
+};
+returndata;
 }
 };
 

src/js/version.js

@@ -1,6 +1,6 @@
 varversion=(function(){
 
-varcurrent="3.81.0";
+varcurrent="3.82.0";
 
 varcompare=function(a,b){
 varpa=a.split(".");

src/manifest.json

@@ -2,7 +2,7 @@
 "name": "nightTab",
 "short_name": "nightTab",
 "description": "A neutral new tab page accented with a chosen colour. Customise the layout, style, background and bookmarks in nightTab.",
-"version": "3.81.0",
+"version": "3.82.0",
 "manifest_version": 2,
 "chrome_url_overrides":{
 "newtab": "index.html"