[feature] add control for link item line

Author: zombieFox

css/link.css

@@ -65,7 +65,7 @@
 background-color:rgb(var(--gray-02));
 border-radius:var(--radius);
 width:100%;
-height:calc(100%-var(--line-width));
+height:100%;
 display: flex;
 z-index:3;
 overflow: hidden;
@@ -74,6 +74,10 @@
 transition: background-color var(--animation-speed-fast) ease-in-out, height var(--animation-speed-fast) ease-in-out, box-shadow var(--animation-speed-fast) ease-in-out;
 }
 
+.is-link-item-line-show .link-panel-front{
+height:calc(100%-var(--line-width));
+}
+
 .link-panel-front:hover,
 .link-panel-front:focus{
 background-color:rgb(var(--gray-03));

index.html

@@ -747,6 +747,11 @@ <h1 class="menu-item-header-text">Bookmarks</h1>
 </div>
 </div>
 <hr>
+<divclass="input-wrap">
+<inputid="control-link-item-line-show" class="control-link-item-line-show" type="checkbox" tabindex="1">
+<labelfor="control-link-item-line-show">Tile line</label>
+</div>
+<hr>
 <divclass="input-wrap">
 <labelfor="control-link-area-gap">Gap size</label>
 <inputid="control-link-area-gap" class="control-link-area-gap" type="range" min="0" max="20" value="0" tabindex="1">

js/control.js

@@ -1419,6 +1419,13 @@ var control = (function(){
 func: function(){
 render();
 }
+},{
+element: helper.e(".control-link-item-line-show"),
+path: "link.item.line.show",
+type: "checkbox",
+func: function(){
+render();
+}
 },{
 element: helper.e(".control-link-area-gap"),
 path: "link.area.gap",
@@ -1849,6 +1856,7 @@ var control = (function(){
 helper.removeClass(html,"is-link-url-show");
 helper.removeClass(html,"is-link-url-style-light");
 helper.removeClass(html,"is-link-url-style-dark");
+helper.removeClass(html,"is-link-item-line-show");
 helper.removeClass(html,"is-link-item-alignment-horizontal-left");
 helper.removeClass(html,"is-link-item-alignment-horizontal-center");
 helper.removeClass(html,"is-link-item-alignment-horizontal-right");
@@ -1872,6 +1880,9 @@ var control = (function(){
 if(state.get().link.item.url.show){
 helper.addClass(html,"is-link-url-show");
 };
+if(state.get().link.item.line.show){
+helper.addClass(html,"is-link-item-line-show");
+};
 if(state.get().link.edit){
 helper.addClass(html,"is-link-edit");
 link.render.tabIndex();
@@ -2200,6 +2211,7 @@ var control = (function(){
 helper.e(".control-link-item-url-show").disabled=true;
 helper.e(".control-link-item-url-style-dark").disabled=true;
 helper.e(".control-link-item-url-style-light").disabled=true;
+helper.e(".control-link-item-line-show").disabled=true;
 helper.e("[for=control-link-area-gap]").setAttribute("disabled","");
 helper.e(".control-link-area-gap").disabled=true;
 helper.e(".control-link-item-display-alignment-horizontal-label").setAttribute("disabled","");
@@ -2231,6 +2243,7 @@ var control = (function(){
 helper.e(".control-link-item-display-show").disabled=false;
 helper.e(".control-link-item-name-show").disabled=false;
 helper.e(".control-link-item-url-show").disabled=false;
+helper.e(".control-link-item-line-show").disabled=false;
 helper.e("[for=control-link-area-gap]").removeAttribute("disabled");
 helper.e(".control-link-area-gap").disabled=false;
 helper.e(".control-link-new-tab").disabled=false;

js/state.js

@@ -164,6 +164,9 @@ var state = (function(){
 show: true,
 style: "dark"
 },
+line: {
+show: true
+}
 },
 show: true,
 newTab: false,

js/update.js

@@ -419,6 +419,14 @@ var update = (function(){
 returndata;
 };
 
+var_update_370=function(data){
+data.version="3.7.0";
+data.state.link.item.line={
+show: true
+};
+returndata;
+};
+
 // var _update_300 = function(data){
 // data.version = 3.00;
 // return data;
@@ -529,6 +537,10 @@ var update = (function(){
 console.log("\t= running update 3.6.0");
 data=_update_360(data);
 };
+if(version.compare(data.version,"3.7.0")==-1){
+console.log("\t= running update 3.7.0");
+data=_update_370(data);
+};
 };
 // if no update is needed
 // version bump

js/version.js

@@ -1,7 +1,7 @@
 varversion=(function(){
 
 // version is normally bumped when the state needs changing or any new functionality is added
-varcurrent="3.6.0";
+varcurrent="3.7.0";
 
 varcompare=function(a,b){
 varpa=a.split(".");