added built in styles, reduce visuals and inline drawer
This commit is contained in:
parent
b62bf9023c
commit
9eb1b408c9
6 changed files with 166 additions and 16 deletions
0
src/renderer/themes/compactui.less
Normal file
0
src/renderer/themes/compactui.less
Normal file
|
@ -1 +0,0 @@
|
|||
//
|
|
@ -1,15 +0,0 @@
|
|||
{
|
||||
"name": "Groovy",
|
||||
"description": "Inspired by Groove Music and Media Player found on Windows",
|
||||
"version": "1.0.0",
|
||||
"author": "ciderapp",
|
||||
"github_repo": "ciderapp/Groovy",
|
||||
"directives": {
|
||||
"windowLayout": {
|
||||
"value": "twopanel"
|
||||
},
|
||||
"lcdArtworkSize": {
|
||||
"value": 70
|
||||
}
|
||||
}
|
||||
}
|
41
src/renderer/themes/inline_drawer.less
Normal file
41
src/renderer/themes/inline_drawer.less
Normal file
|
@ -0,0 +1,41 @@
|
|||
&:not(.modular-fs) {
|
||||
.app-drawer {
|
||||
border-radius: 0px;
|
||||
top : 0;
|
||||
right : 0;
|
||||
height : 100%;
|
||||
box-shadow : unset;
|
||||
border-left : 1px solid var(--color2);
|
||||
background : var(--color1);
|
||||
margin-right : 0px;
|
||||
position : relative;
|
||||
}
|
||||
|
||||
.drawertransition-enter-active,
|
||||
.drawertransition-leave-active {
|
||||
transition: margin .25s var(--appleEase), opacity .25s var(--appleEase);
|
||||
}
|
||||
|
||||
.drawertransition-enter,
|
||||
.drawertransition-leave-to {
|
||||
margin-right: -300px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1120px) {
|
||||
.app-drawer {
|
||||
margin-right: 0px;
|
||||
position : absolute;
|
||||
}
|
||||
|
||||
.drawertransition-enter-active,
|
||||
.drawertransition-leave-active {
|
||||
transition: right .25s var(--appleEase), opacity .25s var(--appleEase);
|
||||
}
|
||||
|
||||
.drawertransition-enter,
|
||||
.drawertransition-leave-to {
|
||||
right: -300px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
115
src/renderer/themes/reduce_visuals.less
Normal file
115
src/renderer/themes/reduce_visuals.less
Normal file
|
@ -0,0 +1,115 @@
|
|||
body {
|
||||
--ciderShadow-Generic : var(--mediaItemShadow);
|
||||
--mediaItemShadow-Shadow : var(--mediaItemShadow);
|
||||
--mediaItemShadow-ShadowSubtle: var(--mediaItemShadow);
|
||||
}
|
||||
|
||||
.bg-artwork-container {
|
||||
display : none;
|
||||
animation: none !important;
|
||||
|
||||
.bg-artwork {
|
||||
animation: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.replaycard-enter-active,
|
||||
.replaycard-leave-active {
|
||||
transition: unset;
|
||||
}
|
||||
|
||||
.replaycard-enter,
|
||||
.replaycard-leave-to {
|
||||
opacity : 0;
|
||||
transform: translateY(20px);
|
||||
}
|
||||
|
||||
.modal-enter-active,
|
||||
.modal-leave-active {
|
||||
transition: unset;
|
||||
}
|
||||
|
||||
.modal-enter,
|
||||
.modal-leave-to {
|
||||
opacity : 0;
|
||||
transform: scale(1.10);
|
||||
}
|
||||
|
||||
.wpfade-enter-active,
|
||||
.wpfade-leave-active {
|
||||
transition: opacity .1s var(--appleEase);
|
||||
}
|
||||
|
||||
.wpfade-enter,
|
||||
.wpfade-leave-to {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.wpfade_transform-enter-active,
|
||||
.wpfade_transform-leave-active {
|
||||
transition : unset;
|
||||
will-change: unset;
|
||||
}
|
||||
|
||||
.wpfade_transform-enter {
|
||||
opacity : 0;
|
||||
transform : unset;
|
||||
will-change: unset;
|
||||
}
|
||||
|
||||
.wpfade_transform-leave-to {
|
||||
opacity : 0;
|
||||
transform : unset;
|
||||
will-change: unset;
|
||||
}
|
||||
|
||||
|
||||
.wpfade_transform_backwards-enter-active,
|
||||
.wpfade_transform_backwards-leave-active {
|
||||
transition: unset;
|
||||
}
|
||||
|
||||
.wpfade_transform_backwards-enter {
|
||||
opacity : 0;
|
||||
transform : unset;
|
||||
will-change: unset;
|
||||
}
|
||||
|
||||
.wpfade_transform_backwards-leave-to {
|
||||
opacity : 0;
|
||||
transform : unset;
|
||||
will-change: unset;
|
||||
}
|
||||
|
||||
.fabfade-enter-active,
|
||||
.fabfade-leave-active {
|
||||
transition: unset;
|
||||
}
|
||||
|
||||
.fabfade-enter,
|
||||
.fabfade-leave-to {
|
||||
opacity : 0;
|
||||
transform: scale(0.5);
|
||||
}
|
||||
|
||||
.fsModeSwitch-enter-active,
|
||||
.fsModeSwitch-leave-active {
|
||||
transition: unset;
|
||||
}
|
||||
|
||||
.fsModeSwitch-enter,
|
||||
.fsModeSwitch-leave-to {
|
||||
transform: scale(1.10);
|
||||
opacity : 0;
|
||||
}
|
||||
|
||||
|
||||
.drawertransition-enter-active,
|
||||
.drawertransition-leave-active {
|
||||
transition: unset;
|
||||
}
|
||||
|
||||
.drawertransition-enter,
|
||||
.drawertransition-leave-to {
|
||||
right: -300px;
|
||||
}
|
|
@ -991,6 +991,16 @@
|
|||
newTheme: null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.themes.unshift({
|
||||
name: "Reduce Visuals",
|
||||
file: "reduce_visuals.less"
|
||||
})
|
||||
this.themes.unshift({
|
||||
name: "Inline Drawer",
|
||||
file: "inline_drawer.less"
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
gitHubExplore() {
|
||||
this.$root.appRoute("themes-github")
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue