dan/dribbblish-dynamic-theme
1
0
Fork 0
mirror of https://github.com/danbulant/dribbblish-dynamic-theme synced 2026-05-25 04:52:10 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add top bar options (For windows users so the controls look so awkward)

Browse source
This commit is contained in:
Send_Nukez 2021-10-04 04:15:54 +02:00
parent f73ee467c0
commit 353029cd61
2 changed files with 57 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
dribbblish.js
View file

@ -92,12 +92,23 @@ DribbblishShared.config.register("Right expanded cover", "rightBigCover", true,
}
});
DribbblishShared.config.register("OS Icon Dodge", "osIconDodge", false, (value) => {
if (value) {
document.documentElement.style.setProperty("--os-windows-icon-dodge", 1);
} else {
document.documentElement.style.setProperty("--os-windows-icon-dodge", 0);
}
waitForElement(["#main"], () => {
DribbblishShared.config.registerSelect("Windows Top Bar", "winTopBar", ["None", "None (With Top Padding)", "Solid", "Transparent"], 0, (value) => {
switch (value) {
case 0:
document.getElementById("main").setAttribute("top-bar", "none");
break;
case 1:
document.getElementById("main").setAttribute("top-bar", "none-padding");
break;
case 2:
document.getElementById("main").setAttribute("top-bar", "solid");
break;
case 3:
document.getElementById("main").setAttribute("top-bar", "transparent");
break;
}
});
});
function waitForElement(els, func, timeout = 100) {

48
user.css
View file

@ -569,20 +569,52 @@ li.GlueDropTarget {
}
/** OS-specific window controls dodge */
.spotify__os--is-windows .main-navBar-navBar {
padding-top: calc(var(--os-windows-icon-dodge) * 24px);
#main:not([top-bar^="none"]) .main-topBar-background {
-webkit-app-region: no-drag;
}
.spotify__container--is-desktop:not(.fullscreen).spotify__os--is-windows .main-navBar-entryPoints {
padding-top: calc(var(--os-windows-icon-dodge) * 12px + 12px);
#main:not([top-bar="none-padding"]) .main-navBar-navBar,
#main:not([top-bar="none-padding"]) .main-buddyFeed-header,
#main:not([top-bar="none-padding"]) .main-navBar-entryPoints {
padding-top: 8px !important;
}
.spotify__os--is-windows .main-buddyFeed-header {
padding-top: calc(var(--os-windows-icon-dodge) * 32px);
#main:not([top-bar^="none"]) {
padding-top: 31px;
}
.spotify__container--is-desktop.spotify__os--is-windows[dir=ltr] .main-topBar-container {
padding-right: calc(var(--os-windows-icon-dodge) * 135px + 32px);
#main:not([top-bar^="none"])::before {
z-index: 999;
content: "";
position: absolute;
top: 0px;
left: 0px;
right: 135px;
height: 31px;
background-color: rgba(0, 0, 0, 0.53);
-webkit-app-region: drag;
pointer-events: none;
}
#main[top-bar="solid"]::before {
right: 0px;
background-color: black;
}
#main[top-bar="none-padding"] .spotify__os--is-windows .main-navBar-navBar {
padding-top: 24px;
}
#main[top-bar="none-padding"] .spotify__container--is-desktop:not(.fullscreen).spotify__os--is-windows .main-navBar-entryPoints {
padding-top: 22px;
}
#main[top-bar="none-padding"] .spotify__os--is-windows .main-buddyFeed-header {
padding-top: 32px;
}
#main[top-bar="none-padding"] .spotify__container--is-desktop.spotify__os--is-windows[dir=ltr] .Root__top-bar + .main-buddyFeed-buddyFeedRoot .main-topBar-container {
padding-right: 167px;
}
.main-topBar-container {