Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-04 20:36:13 +01:00
Code Issues Packages Projects Releases Activity

tabs wip

Browse Source
This commit is contained in:
zadam
2019-05-02 22:24:43 +02:00
parent 63ab82a076
commit 0d11cadc18
17 changed files with 264 additions and 264 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
libraries/chrome-tabs/chrome-tabs.css
View File

@@ -149,27 +149,4 @@
.chrome-tabs.chrome-tabs-is-sorting .chrome-tab:not(.chrome-tab-is-dragging),
.chrome-tabs:not(.chrome-tabs-is-sorting) .chrome-tab.chrome-tab-was-just-dragged {
transition: transform 120ms ease-in-out;
}
.chrome-tabs .chrome-tabs-bottom-bar {
position: absolute;
bottom: 0;
height: 4px;
left: 0;
width: 100%;
background: #fff;
z-index: 10;
}
.chrome-tabs-optional-shadow-below-bottom-bar {
position: relative;
height: 1px;
width: 100%;
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='1' viewBox='0 0 1 1'><rect x='0' y='0' width='1' height='1' fill='rgba(0, 0, 0, .17)'></rect></svg>");
background-size: 1px 1px;
background-repeat: repeat-x;
background-position: 0% 0%;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
.chrome-tabs-optional-shadow-below-bottom-bar {
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='2' height='2' viewBox='0 0 2 2'><rect x='0' y='0' width='2' height='1' fill='rgba(0, 0, 0, .27)'></rect></svg>");
}
}
}

16
libraries/chrome-tabs/chrome-tabs.js
View File

@@ -41,12 +41,7 @@
const tabTemplate = `
<div class="chrome-tab">
<div class="chrome-tab-dividers"></div>
<div class="chrome-tab-background">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg"><defs><symbol id="chrome-tab-geometry-left" viewBox="0 0 214 36"><path d="M17 0h197v36H0v-2c4.5 0 9-3.5 9-8V8c0-4.5 3.5-8 8-8z"/></symbol><symbol id="chrome-tab-geometry-right" viewBox="0 0 214 36"><use xlink:href="#chrome-tab-geometry-left"/></symbol><clipPath id="crop"><rect class="mask" width="100%" height="100%" x="0"/></clipPath></defs><svg width="52%" height="100%"><use xlink:href="#chrome-tab-geometry-left" width="214" height="36" class="chrome-tab-geometry"/></svg><g transform="scale(-1, 1)"><svg width="52%" height="100%" x="-100%" y="0"><use xlink:href="#chrome-tab-geometry-right" width="214" height="36" class="chrome-tab-geometry"/></svg></g></svg>
</div>
<div class="chrome-tab-content">
<div class="chrome-tab-favicon"></div>
<div class="chrome-tab-title"></div>
<div class="chrome-tab-drag-handle"></div>
<div class="chrome-tab-close"></div>
@@ -211,6 +206,8 @@
this.cleanUpPreviouslyDraggedTabs()
this.layoutTabs()
this.setupDraggabilly()
return tabEl
}
setTabCloseEventListener(tabEl) {
@@ -251,15 +248,6 @@
updateTab(tabEl, tabProperties) {
tabEl.querySelector('.chrome-tab-title').textContent = tabProperties.title
const faviconEl = tabEl.querySelector('.chrome-tab-favicon')
if (tabProperties.favicon) {
faviconEl.style.backgroundImage = `url('${ tabProperties.favicon }')`
faviconEl.removeAttribute('hidden', '')
} else {
faviconEl.setAttribute('hidden', '')
faviconEl.removeAttribute('style')
}
if (tabProperties.id) {
tabEl.setAttribute('data-tab-id', tabProperties.id)
}