diff --git a/src/renderer/themes/sweetener.less b/src/renderer/themes/sweetener.less new file mode 100644 index 00000000..071be700 --- /dev/null +++ b/src/renderer/themes/sweetener.less @@ -0,0 +1,68 @@ +@panelColorsFallback: rgb(30 30 30); +@panelColors : rgb(30 30 30 / 45%); + +.menu-panel { + .menu-panel-body { + background-color: @panelColors; + backdrop-filter : blur(32px) saturate(180%); + animation: menuIn .10s var(--appleEase); + } + + + @keyframes menuIn { + 0% { + opacity : 0; + transform : translateY(-10px); + background: @panelColorsFallback; + } + + 100% { + opacity : 1; + transform : translateY(0); + background: @panelColors; + } + } + +} + + +.cd-mediaitem-square:not(.mediaitem-card) { + transition : transform .2s var(--appleEase); + transition-delay: .1s; + padding : 12px; + + // background-color: red; + height: 250px; + + + .artwork-container {} + + .info-rect {} + + .artwork-container, + .info-rect { + transition : transform .22s var(--appleEase); + transition-delay: .05s; + } + + &:hover { + .artwork-container { + transform : scale(1.1) ; + transition : transform .1s var(--appleEase); + transition-delay: 0s; + transform-origin: center; + } + + + .info-rect { + z-index : 1; + transition : transform .1s var(--appleEase); + transition-delay: 0s; + transform : translateY(8px); + } + } + + &:active { + + } +} \ No newline at end of file diff --git a/src/renderer/views/pages/settings.ejs b/src/renderer/views/pages/settings.ejs index 5b058845..c22010cb 100644 --- a/src/renderer/views/pages/settings.ejs +++ b/src/renderer/views/pages/settings.ejs @@ -135,6 +135,7 @@