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

[design] improve link background image opacity

Browse Source
This commit is contained in:
zombieFox 2020-06-16 11:06:43 +01:00
parent d682e732da
commit 38159876c4
6 changed files with 21 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package-lock.json generated
View File

@ -1,6 +1,6 @@
{
"name": "nightTab",
"version": "5.42.2",
"version": "5.43.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {

2
package.json
View File

@ -1,6 +1,6 @@
{
"name": "nightTab",
"version": "5.42.2",
"version": "5.43.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": {

21
src/css/link.css
View File

@ -178,12 +178,13 @@
z-index: 3;
overflow: hidden;
text-decoration: none;
outline: none;
user-select: none;
transition: background-color var(--layout-timing-extra-fast), height var(--layout-timing-extra-fast), box-shadow var(--layout-timing-extra-fast), border-radius var(--layout-timing-extra-fast);
}
.link-image {
background-image: var(--link-image-url);
background-image: var(--link-item-image-url);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
@ -195,10 +196,7 @@
height: 100%;
z-index: 1;
pointer-events: none;
}
.link-panel-front {
background-color: rgba(var(--link-item-color), var(--link-item-opacity));
transition: opacity var(--layout-timing-extra-fast);
}
.is-link-style-block .link-panel-front {
@ -231,16 +229,27 @@
height: calc(100% - var(--layout-line-width));
}
.link-item:not(.link-item-image) .link-panel-front {
background-color: rgba(var(--link-item-color), var(--link-item-opacity));
}
.link-panel-front:hover,
.link-panel-front:focus,
.link-item:focus-within .link-panel-front,
.link-item:focus .link-panel-front,
.link-item:hover .link-panel-front {
background-color: rgba(var(--link-item-color-focus-hover), var(--link-item-opacity));
outline: none;
text-decoration: none;
}
.link-item:not(.link-item-image) .link-panel-front:hover,
.link-item:not(.link-item-image) .link-panel-front:focus,
.link-item:not(.link-item-image):focus-within .link-panel-front,
.link-item:not(.link-item-image):focus .link-panel-front,
.link-item:not(.link-item-image):hover .link-panel-front {
background-color: rgba(var(--link-item-color-focus-hover), var(--link-item-opacity));
}
.is-link-item-shadow-show.is-link-orientation-bottom .link-item:focus .link-panel-front,
.is-link-item-shadow-show.is-link-orientation-bottom .link-item:focus-within .link-panel-front,
.is-link-item-shadow-show.is-link-orientation-bottom .link-item:hover .link-panel-front {

3
src/js/link.js
View File

@ -941,7 +941,8 @@ var link = (function() {
"--link-item-color-focus-hover: " + stagedLink.link.color.rgb.r + ", " + stagedLink.link.color.rgb.g + ", " + stagedLink.link.color.rgb.b + ";";
};
if (helper.checkIfValidString(stagedLink.link.image)) {
linkItemOptions.attr[1].value = linkItemOptions.attr[1].value + "--link-image-url: url(" + helper.trimString(stagedLink.link.image) + ");"
linkItemOptions.attr[0].value = linkItemOptions.attr[0].value + " link-item-image";
linkItemOptions.attr[1].value = linkItemOptions.attr[1].value + "--link-item-image-url: url(" + helper.trimString(stagedLink.link.image) + ");"
};
};
var linkItem = helper.makeNode(linkItemOptions);

2
src/js/version.js
View File

@ -1,6 +1,6 @@
var version = (function() {
var current = "5.42.2";
var current = "5.43.0";
var name = "Macabre Caterpillar";

2
src/manifest.json
View File

@ -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": "5.42.2",
"version": "5.43.0",
"manifest_version": 2,
"chrome_url_overrides": {
"newtab": "index.html"