0ct0pu5/siyuan
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

💄 tab https://github.com/siyuan-note/siyuan/issues/6264

Browse source
This commit is contained in:
Vanessa 2022-10-19 18:01:29 +08:00
parent 4e27798f53
commit bbca5683ce
3 changed files with 4 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app/src/assets/scss/_layout.scss
View file

@ -131,11 +131,11 @@
display: flex;
align-items: center;
transition: var(--b3-transition);
flex: 1;
min-height: 42px;
position: relative;
max-width: 186px;
flex-shrink: 0;
overflow: hidden;
&:hover:not(.item--focus):not(.item--readonly) .item__text {
color: var(--b3-theme-on-background);

6
app/src/layout/Tab.ts
View file

@ -30,7 +30,7 @@ export class Tab {
this.headElement = document.createElement("li");
this.headElement.setAttribute("data-type", "tab-header");
this.headElement.setAttribute("draggable", "true");
this.headElement.setAttribute("style", "flex: 0;width: 0;overflow: hidden");
this.headElement.setAttribute("style", "max-width: 0");
this.headElement.setAttribute("data-id", this.id);
this.headElement.setAttribute("data-position", "center"); // showTooltip 位置标识
this.headElement.classList.add("item", "item--focus");
@ -40,9 +40,7 @@ export class Tab {
} else if (options.docIcon) {
iconHTML = `<span class="item__icon">${unicode2Emoji(options.docIcon)}</span>`;
}
this.headElement.innerHTML = `<span class="fn__flex-1"></span>
${iconHTML}<span class="item__text">${escapeHtml(options.title)}</span>
<span class="fn__flex-1"></span>
this.headElement.innerHTML = `${iconHTML}<span class="item__text">${escapeHtml(options.title)}</span>
<span class="item__close"><svg><use xlink:href='#iconClose'></use></svg></span>`;
this.headElement.addEventListener("mouseenter", (event) => {
event.stopPropagation();

2
app/src/layout/Wnd.ts
View file

@ -616,7 +616,7 @@ export class Wnd {
this.switchTab(this.children[currentIndex].headElement, true);
}
}
item.headElement.setAttribute("style", "flex: 0;width: 0;overflow: hidden");
item.headElement.setAttribute("style", "max-width: 0px;");
setTimeout(() => {
item.headElement.remove();
}, Constants.TIMEOUT_TRANSITION);