[feature] add control for link item line

This commit is contained in:
Kuldeep M 2019-06-06 19:06:47 +01:00
parent 29f14af9bc
commit b3146705cb
6 changed files with 39 additions and 2 deletions

View File

@ -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));

View File

@ -747,6 +747,11 @@
</div>
</div>
<hr>
<div class="input-wrap">
<input id="control-link-item-line-show" class="control-link-item-line-show" type="checkbox" tabindex="1">
<label for="control-link-item-line-show">Tile line</label>
</div>
<hr>
<div class="input-wrap">
<label for="control-link-area-gap">Gap size</label>
<input id="control-link-area-gap" class="control-link-area-gap" type="range" min="0" max="20" value="0" tabindex="1">

View File

@ -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;

View File

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

View File

@ -419,6 +419,14 @@ var update = (function() {
return data;
};
var _update_370 = function(data) {
data.version = "3.7.0";
data.state.link.item.line = {
show: true
};
return data;
};
// 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

View File

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