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

[design] improve theme preset controls

Browse Source
This commit is contained in:
zombieFox 2019-12-24 14:25:16 +00:00
parent ed67b3d74e
commit ae8d4c93a6
1 changed files with 14 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/css/theme.css
View File

@ -43,20 +43,20 @@
.theme-preset-background-02 {
z-index: 2;
clip-path: polygon(0 0, 100% 100%, 100% 100%, 100% 0, 0 0);
transition-delay: var(--layout-duration-04);
clip-path: polygon(0 40%, 60% 100%, 100% 100%, 100% 0, 0 0);
transition-delay: 0;
}
.theme-preset-background-03 {
z-index: 3;
clip-path: polygon(0 0, 40% 0, 100% 60%, 100% 0);
transition-delay: var(--layout-duration-03);
clip-path: polygon(0 0, 100% 100%, 100% 0);
transition-delay: 0;
}
.theme-preset-background-04 {
z-index: 4;
clip-path: polygon(80% 0, 100% 20%, 100% 0);
transition-delay: var(--layout-duration-02);
clip-path: polygon(40% 0, 100% 60%, 100% 0);
transition-delay: 0;
}
.theme-preset-accent {
@ -67,26 +67,26 @@
.theme-preset-button:focus .theme-preset-background-02,
.theme-preset-button:hover .theme-preset-background-02 {
clip-path: polygon(0 40%, 60% 100%, 100% 100%, 100% 0, 0 0);
transition-delay: var(--layout-duration-01);
clip-path: polygon(0 20%, 80% 100%, 100% 100%, 100% 0, 0 0);
transition-delay: var(--layout-duration-04);
}
.theme-preset-button:focus .theme-preset-background-03,
.theme-preset-button:hover .theme-preset-background-03 {
clip-path: polygon(0 0, 0 0, 100% 100%, 100% 0);
transition-delay: var(--layout-duration-02);
clip-path: polygon(20% 0, 100% 80%, 100% 0);
transition-delay: var(--layout-duration-03);
}
.theme-preset-button:focus .theme-preset-background-04,
.theme-preset-button:hover .theme-preset-background-04 {
clip-path: polygon(40% 0, 100% 60%, 100% 0);
transition-delay: var(--layout-duration-03);
clip-path: polygon(60% 0, 100% 40%, 100% 0);
transition-delay: var(--layout-duration-02);
}
.theme-preset-button:focus .theme-preset-accent,
.theme-preset-button:hover .theme-preset-accent {
clip-path: polygon(100% 40%, 100% 100%, 40% 100%);
transition-delay: var(--layout-duration-02);
clip-path: polygon(100% 30%, 100% 100%, 30% 100%);
transition-delay: var(--layout-duration-01);
}
.theme-preset-background-nighttab-01 {