extern/nightTab
1
0
Fork 0
mirror of https://github.com/zombieFox/nightTab.git synced 2025-06-26 04:21:38 +02:00
Code Issues Packages Projects Releases Wiki Activity

[design] improve link border radius

Browse Source
This commit is contained in:
zombieFox 2019-11-11 23:47:48 +00:00
parent 0daaf692cd
commit b70f75c330
1 changed files with 30 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
src/css/link.css
View File

@ -88,7 +88,7 @@
z-index: 3; z-index: 3;
overflow: hidden; overflow: hidden;
user-select: 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); 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);
} }
.is-link-orientation-top .link-panel-front { .is-link-orientation-top .link-panel-front {
@ -231,6 +231,20 @@
height: calc(100% - var(--link-item-url-height)); height: calc(100% - var(--link-item-url-height));
} }
.is-link-orientation-top.is-link-item-url-show .link-item:focus .link-panel-front,
.is-link-orientation-top.is-link-item-url-show .link-item:focus-within .link-panel-front,
.is-link-orientation-top.is-link-item-url-show .link-item:hover .link-panel-front {
border-top-left-radius: 0.25em;
border-top-right-radius: 0.25em;
}
.is-link-orientation-bottom.is-link-item-url-show .link-item:focus .link-panel-front,
.is-link-orientation-bottom.is-link-item-url-show .link-item:focus-within .link-panel-front,
.is-link-orientation-bottom.is-link-item-url-show .link-item:hover .link-panel-front {
border-bottom-left-radius: 0.25em;
border-bottom-right-radius: 0.25em;
}
.link-panel-back { .link-panel-back {
background-color: rgb(var(--theme-accent)); background-color: rgb(var(--theme-accent));
border-radius: var(--theme-radius); border-radius: var(--theme-radius);
@ -243,7 +257,7 @@
align-items: stretch; align-items: stretch;
justify-content: flex-end; justify-content: flex-end;
z-index: 2; z-index: 2;
transition: height var(--layout-timing-extra-fast), top var(--layout-timing-extra-fast), clip-path var(--layout-timing-extra-fast); transition: height var(--layout-timing-extra-fast), border-radius var(--layout-timing-extra-fast), top var(--layout-timing-extra-fast), clip-path var(--layout-timing-extra-fast);
clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
} }
@ -601,6 +615,20 @@
height: calc(100% - var(--link-item-edit-height)); height: calc(100% - var(--link-item-edit-height));
} }
.is-link-orientation-top.is-link-edit .link-panel-front,
.is-link-orientation-top.is-link-edit .link-item:hover .link-panel-front,
.is-link-orientation-top.is-link-edit .link-item:focus .link-panel-front {
border-top-left-radius: 0.25em;
border-top-right-radius: 0.25em;
}
.is-link-orientation-bottom.is-link-edit .link-panel-front,
.is-link-orientation-bottom.is-link-edit .link-item:hover .link-panel-front,
.is-link-orientation-bottom.is-link-edit .link-item:focus .link-panel-front {
border-bottom-left-radius: 0.25em;
border-bottom-right-radius: 0.25em;
}
.is-link-item-shadow-show.is-link-edit .link-panel-front, .is-link-item-shadow-show.is-link-edit .link-panel-front,
.is-link-item-shadow-show.is-link-edit .link-item:hover .link-panel-front, .is-link-item-shadow-show.is-link-edit .link-item:hover .link-panel-front,
.is-link-item-shadow-show.is-link-edit .link-item:focus .link-panel-front { .is-link-item-shadow-show.is-link-edit .link-item:focus .link-panel-front {