extern/nightTab
1
0
Fork 0
mirror of https://github.com/zombieFox/nightTab.git synced 2025-01-23 14:28:50 +01:00
Code Issues Packages Projects Releases Wiki Activity

[feature] adding control for link item grow on hover

Browse Source
This commit is contained in:
zombieFox 2019-06-15 11:57:53 +01:00
parent e0ae9601bc
commit 6d8f1c23b8
6 changed files with 51 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
css/link.css
View File

@ -49,15 +49,15 @@
z-index: 1;
}
.link-item:focus-within,
.link-item:focus,
.link-item:hover {
.is-link-item-hover-scale .link-item:focus-within,
.is-link-item-hover-scale .link-item:focus,
.is-link-item-hover-scale .link-item:hover {
transform: scale(1.05);
z-index: 2;
outline: 0;
}
.link-item:active {
.is-link-item-hover-scale .link-item:active {
transform: scale(1.04);
transition: none;
}
@ -75,7 +75,7 @@
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 {
.is-link-item-line .link-panel-front {
height: calc(100% - var(--line-width));
}
@ -175,14 +175,14 @@
transition: height var(--animation-speed-fast) ease-in-out, top var(--animation-speed-fast) ease-in-out;
}
.is-link-item-line-show .link-panel-back {
.is-link-item-line .link-panel-back {
height: calc(100% - var(--line-width));
}
.is-link-edit .link-panel-back,
.is-link-url-show:not(.is-link-item-line-show) .link-item:focus .link-panel-back,
.is-link-url-show:not(.is-link-item-line-show) .link-item:focus-within .link-panel-back,
.is-link-url-show:not(.is-link-item-line-show) .link-item:hover .link-panel-back {
.is-link-url-show:not(.is-link-item-line) .link-item:focus .link-panel-back,
.is-link-url-show:not(.is-link-item-line) .link-item:focus-within .link-panel-back,
.is-link-url-show:not(.is-link-item-line) .link-item:hover .link-panel-back {
top: 0;
height: 100%;
}

9
index.html
View File

@ -803,8 +803,13 @@
</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>
<input id="control-link-item-line" class="control-link-item-line" type="checkbox" tabindex="1">
<label for="control-link-item-line">Tile line</label>
</div>
<hr>
<div class="input-wrap">
<input id="control-link-item-hover-scale" class="control-link-item-hover-scale" type="checkbox" tabindex="1">
<label for="control-link-item-hover-scale">Grow on hover</label>
</div>
<hr>
<label class="control-link-item-display-alignment-horizontal-label">Content Horizontal Alignment</label>

27
js/control.js
View File

@ -1841,8 +1841,15 @@ var control = (function() {
render();
}
}, {
element: helper.e(".control-link-item-line-show"),
path: "link.item.line.show",
element: helper.e(".control-link-item-line"),
path: "link.item.line",
type: "checkbox",
func: function() {
render();
}
}, {
element: helper.e(".control-link-item-hover-scale"),
path: "link.item.hoverScale",
type: "checkbox",
func: function() {
render();
@ -2312,7 +2319,8 @@ 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-line");
helper.removeClass(html, "is-link-item-hover-scale");
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");
@ -2336,8 +2344,11 @@ 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.item.line) {
helper.addClass(html, "is-link-item-line");
};
if (state.get().link.item.hoverScale) {
helper.addClass(html, "is-link-item-hover-scale");
};
if (state.get().link.edit) {
helper.addClass(html, "is-link-edit");
@ -2688,7 +2699,8 @@ 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(".control-link-item-line").disabled = true;
helper.e(".control-link-item-hover-scale").disabled = true;
helper.e(".control-link-item-display-alignment-horizontal-label").setAttribute("disabled", "");
helper.e(".control-link-item-display-alignment-horizontal-left").disabled = true;
helper.e(".control-link-item-display-alignment-horizontal-center").disabled = true;
@ -2718,7 +2730,8 @@ 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(".control-link-item-line").disabled = false;
helper.e(".control-link-item-hover-scale").disabled = false;
helper.e(".control-link-new-tab").disabled = false;
helper.e(".control-link-style-block").disabled = false;
helper.e(".control-link-style-list").disabled = false;

7
js/state.js
View File

@ -138,7 +138,6 @@ var state = (function() {
}
},
item: {
size: 1,
display: {
show: true,
size: 2,
@ -161,9 +160,9 @@ var state = (function() {
show: true,
style: "dark"
},
line: {
show: true
}
size: 1,
line: true,
hoverScale: true
},
show: true,
newTab: false,

11
js/update.js
View File

@ -471,6 +471,13 @@ var update = (function() {
return data;
};
var _update_3110 = function(data) {
data.version = "3.11.0";
data.state.link.item.line = data.state.link.item.line.show;
data.state.link.item.hoverScale = true;
return data;
};
// var _update_300 = function(data) {
// data.version = 3.00;
// return data;
@ -597,6 +604,10 @@ var update = (function() {
console.log("\t= running update 3.10.0");
data = _update_3100(data);
};
if (version.compare(data.version, "3.11.0") == -1) {
console.log("\t= running update 3.11.0");
data = _update_3110(data);
};
};
// if no update is needed
// version bump

2
js/version.js
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.10.3";
var current = "3.11.0";
var compare = function(a, b) {
var pa = a.split(".");