1
0
mirror of https://github.com/mwalbeck/nextcloud-breeze-dark.git synced 2024-11-09 01:46:51 +00:00
nextcloud-breeze-dark/css/apps/thirdparty/_audio-player.scss
Magnus Walbeck a58dc593c2
Rewrite core styling #133 (#163)
Complete rewrite of core styling to realign with current Nextcloud, and rely more on CSS4 variable for theming.
2020-10-06 19:12:45 +02:00

148 lines
3.4 KiB
SCSS

/***
* @copyright Copyright (c) 2017, Magnus Walbeck <mw@mwalbeck.org>
*
* @license GNU AGPL version 3 or any later version, see COPYING file for more.
*/
/* Audio Player ------------------------------------------------------------- */
.app-audioplayer #app-navigation {
#myCategory li {
opacity: 1;
&:hover {
background-color: var(--color-background-hover);
}
&.active span {
color: var(--color-main-text);
}
i.ioc {
color: var(--color-main-text);
opacity: 0.7;
&.ioc-sort:hover {
color: var(--color-success);
opacity: 1;
}
&.ioc-delete:hover {
color: var(--color-error);
opacity: 1;
}
}
i.icon-rename {
opacity: 0.7;
&:hover {
opacity: 1;
}
}
&.activeHover {
border-color: var(--color-primary-element);
}
&.dropHover {
background-color: var(--color-background-hover);
}
}
#app-settings #audio-settings li.audio-settings-item {
opacity: 1;
}
}
.app-audioplayer #app-content {
#loading {
color: var(--color-icon);
}
.sm2-bar-ui {
.sm2-progress {
.sm2-progress-track {
background-color: var(--color-background-darker);
}
.sm2-progress-bar {
background-color: var(--color-primary-element);
}
.sm2-progress-ball {
background-color: var(--color-icon);
}
}
}
#playlist-container {
.coverrow .album .albumcover {
box-shadow: none;
}
.songcontainer {
background-color: var(--color-background-darker);
border: 1px solid var(--color-border);
box-shadow: none;
color: var(--color-main-text);
.open-arrow::before {
border-bottom-color: var(--color-border);
}
.songcontainer-cover {
box-shadow: none;
}
}
#individual-playlist-header .header-indi {
border-bottom-color: var(--color-border);
}
}
}
.app-audioplayer #app-sidebar {
#ID3EditorTabView .icon-info {
opacity: 1;
}
}
#audios_import .ui-progressbar .ui-progressbar-value {
background-color: var(--color-primary);
}
/* Icons -------------------------------------------------------------------- */
.app-audioplayer {
.sm2-inline-button.previous {
background-image: var(--icon-audioplayer-previous-f2f2f2) !important;
}
.play-pause,
.play-pause:hover,
.paused .play-pause:hover {
background-image: var(--icon-audioplayer-play-f2f2f2) !important;
}
.playing .play-pause {
background-image: var(--icon-audioplayer-pause-f2f2f2) !important;
}
.sm2-inline-button.next {
background-image: var(--icon-audioplayer-next-f2f2f2) !important;
}
.sm2-volume-control {
background-image: var(--icon-audioplayer-volume-f2f2f2) !important;
}
.sm2-inline-button.repeat {
background-image: var(--icon-audioplayer-repeat-f2f2f2) !important;
}
.sm2-inline-button.shuffle {
background-image: var(--icon-audioplayer-shuffle-f2f2f2) !important;
}
}