Reworked CSS in order to isolate themable elements

This commit is contained in:
emeric
2020-04-12 18:35:55 +02:00
parent 8d8d778e47
commit fa14586b64
14 changed files with 123 additions and 214 deletions
+39 -137
View File
@@ -3,24 +3,6 @@ a, a:link, a:active, a:visited {
cursor: pointer;
}
a:hover {
color: #337ab7;
}
/* Base style for artist names */
.Lms-explore-artistname
{
color: darkgrey;
font-style: italic;
}
/* Base style for release names */
.Lms-explore-releasename
{
color: black;
font-style: normal;
}
.Lms-vertical-align {
display: flex;
align-items: center;
@@ -35,6 +17,32 @@ a:hover {
margin-bottom: 78px;
}
/* Themable items */
/* Base style for artist names */
.Lms-artistname {
font-style: normal;
}
/* Base style for release names */
.Lms-releasename {
font-style: normal;
}
.Lms-trackname {
font-style: normal;
}
.Lms-entry-hoverable:hover {
/* filter: drop-shadow(0 0 0.2rem darkgrey); */
}
.Lms-control-btn:hover {
color: #337ab7;
}
/* endof Themable items */
.Lms-show-more {
margin-top: 8px;
margin-bottom: 8px;
@@ -52,10 +60,6 @@ a:hover {
margin-bottom: 8px;
}
.Lms-admin-users-entry:hover {
background-color: lightgrey;
}
.Lms-admin-users-entry-role {
margin-left: 8px;
}
@@ -70,7 +74,7 @@ a:hover {
}
.Lms-cluster:hover {
filter: brightness(85%);
filter: brightness(130%);
}
.Lms-cluster-type-0 {
@@ -123,31 +127,17 @@ a:hover {
margin-bottom: 4px;
}
.Lms-cover:hover {
filter: brightness(130%);
}
.Lms-explore-contents {
margin-bottom: 24px;
}
.Lms-explore-filters {
background-color: #f5f5f5;
padding: 8px;
border-radius: 8px;
margin-bottom: 16px;
}
.Lms-explore-info {
background-color: #f5f5f5;
padding: 8px;
border-radius: 8px;
}
.Lms-explore-releases-entry {
padding-top: 8px;
padding-bottom: 8px;
margin: 0px;
}
.Lms-explore-releases-entry:hover {
background-color: lightgrey;
}
.Lms-explore-release-cover {
@@ -157,7 +147,6 @@ a:hover {
}
.Lms-explore-release-entry-tracknumber {
color: darkgrey;
text-align: center;
white-space: nowrap;
}
@@ -169,15 +158,7 @@ a:hover {
}
.Lms-explore-release-entry {
border-bottom-style: solid;
border-bottom-color: lightgrey;
border-bottom-width: thin;
min-height: 32px;
margin: 0px;
}
.Lms-explore-release-entry:hover {
background-color: lightgrey;
}
.Lms-explore-release-entry:hover .Lms-explore-release-entry-controls {
@@ -198,7 +179,6 @@ a:hover {
}
.Lms-explore-release-entry-track-duration {
color: darkgrey;
text-align: right;
white-space: nowrap;
display: block;
@@ -210,25 +190,11 @@ a:hover {
padding-bottom: 4px;
}
.Lms-explore-releaselink:hover {
background-color: lightgrey;
}
.Lms-explore-releaselink-artist {
color: dimgrey;
}
.Lms-explore-artists-entry {
min-height: 48px;
margin: 0px;
}
.Lms-explore-artists-entry:hover {
background-color: lightgrey;
}
.Lms-explore-artists-entry-name {
color: black;
font-style: normal;
}
@@ -239,11 +205,6 @@ a:hover {
.Lms-explore-artist-entry {
padding-top: 8px;
padding-bottom: 8px;
margin: 0px;
}
.Lms-explore-artist-entry:hover {
background-color: lightgrey;
}
.Lms-explore-artistlink {
@@ -251,25 +212,8 @@ a:hover {
margin: 0px;
}
.Lms-explore-artistlink:hover {
background-color: lightgrey;
}
.Lms-explore-artistlink-name {
color: black;
font-style: normal;
}
.Lms-explore-tracks-entry {
min-height: 32px;
border-bottom-style: solid;
border-bottom-color: lightgrey;
border-bottom-width: thin;
margin: 0px;
}
.Lms-explore-tracks-entry:hover {
background-color: lightgrey;
}
.Lms-explore-tracks-entry:hover .Lms-explore-tracks-entry-controls {
@@ -291,7 +235,6 @@ a:hover {
}
.Lms-explore-tracks-entry-duration {
color: darkgrey;
text-align: right;
white-space: nowrap;
display: block;
@@ -302,30 +245,14 @@ a:hover {
margin: 0px;
}
.Lms-explore-tracksinfo-entry:hover {
background-color: lightgrey;
}
.Lms-explore-btn {
font-size: 22px !important;
cursor: pointer;
}
.Lms-explore-btn:hover {
color: #337ab7;
}
.Lms-playqueue-entry {
border-bottom-style: solid;
border-bottom-color: lightgrey;
border-bottom-width: thin;
min-height: 32px;
margin: 0px;
}
.Lms-playqueue-entry:hover {
background-color: lightgrey;
}
.Lms-playqueue-entry:hover .Lms-playqueue-entry-controls {
@@ -342,21 +269,12 @@ a:hover {
margin: 2px;
}
.Lms-playqueue-btn:hover {
color: #337ab7;
}
.Lms-playqueue-btn-selected {
color: #337ab7;
}
.Lms-playqueue-entry-controls {
text-align: right;
display: none;
}
.Lms-playqueue-entry-duration {
color: darkgrey;
text-align: right;
white-space: nowrap;
display: block;
@@ -376,15 +294,8 @@ a:hover {
}
.Lms-playhistory-entry {
border-bottom-style: solid;
border-bottom-color: lightgrey;
border-bottom-width: thin;
min-height: 32px;
margin: 0px;
}
.Lms-playhistory-entry:hover {
background-color: lightgrey;
margin-bottom: 0px;
}
.Lms-playhistory-entry-name {
@@ -397,22 +308,14 @@ a:hover {
bottom: 0;
width: 100%;
height: 70px;
background-color: #f5f5f5;
box-shadow: 0px -2px 8px #f5f5f5;
}
.Lms-player-artistname {
color: dimgrey;
padding: 0px;
margin: 0px;
}
.Lms-player-btn {
cursor: pointer;
}
.Lms-player-btn:hover {
color: #337ab7;
}
.Lms-player-btn-volume {
font-size: 18px !important;
margin: auto;
@@ -427,7 +330,6 @@ a:hover {
.Lms-player-duration {
line-height: 40px;
text-align: right;
color: darkgrey;
white-space: nowrap;
}
@@ -454,6 +356,8 @@ a:hover {
-webkit-appearance: none;
-moz-appearance: none;
background: transparent;
border-style: solid;
border-width: thin;
}
.Lms-player-seek::-webkit-slider-thumb {
@@ -470,10 +374,6 @@ a:hover {
width: 0px;
}
.Lms-player-progress {
background-color: darkgrey;
}
.Lms-player-controls {
text-align: center;
white-space: nowrap;
@@ -508,10 +408,12 @@ a:hover {
appearance: none;
width: 100%;
height: 8px;
background: lightgrey;
outline: none;
cursor: pointer;
border-radius: 4px;
background-color: inherit;
border-style: solid;
border-width: thin;
}
.Lms-player-volume-slider::-webkit-slider-thumb {