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
+24 -20
View File
@@ -3,57 +3,61 @@
<!--FORMS message blocks-->
<message id="Lms.PlayQueue.template.clear-btn">
<i class="fa fa-times-circle Lms-playqueue-btn"></i>
<i class="fa fa-times-circle Lms-playqueue-btn Lms-control-btn"></i>
</message>
<message id="Lms.PlayQueue.template.shuffle-btn">
<i class="fa fa-random Lms-playqueue-btn"></i>
<i class="fa fa-random Lms-playqueue-btn Lms-control-btn"></i>
</message>
<message id="Lms.PlayQueue.template.repeat-btn">
<i class="fa fa-repeat Lms-playqueue-btn"></i>
<i class="fa fa-repeat Lms-playqueue-btn Lms-control-btn"></i>
</message>
<message id="Lms.PlayQueue.template.radio-btn">
<i class="fa fa-rss Lms-playqueue-btn"></i>
<i class="fa fa-rss Lms-playqueue-btn Lms-control-btn"></i>
</message>
<message id="Lms.PlayQueue.template">
<div class="page-header">
<h2>${tr:Lms.PlayQueue.playqueue}</h2>
${clear-btn}${shuffle-btn}${repeat-btn}${radio-btn}
<h4><small>${nb-tracks}</small></h4>
</div>
${entries}
<div class="row">
<div class="col-xs-12 Lms-horizontal-center">
${show-more class="btn-primary Lms-show-more"}
<div class="col-lg-8">
<div class="page-header">
<h2>${tr:Lms.PlayQueue.playqueue}</h2>
${clear-btn}${shuffle-btn}${repeat-btn}${radio-btn}
<h4><small>${nb-tracks}</small></h4>
</div>
${entries}
<div class="row">
<div class="col-xs-12 Lms-horizontal-center">
${show-more class="btn-primary Lms-show-more"}
</div>
</div>
</div>
</div>
</message>
<message id="Lms.PlayQueue.template.play-btn">
<i class="fa fa-play-circle Lms-playqueue-btn"></i>
<i class="fa fa-play-circle Lms-playqueue-btn Lms-control-btn"></i>
</message>
<message id="Lms.PlayQueue.template.delete-btn">
<i class="fa fa-times-circle Lms-playqueue-btn"></i>
<i class="fa fa-times-circle Lms-playqueue-btn Lms-control-btn"></i>
</message>
<message id="Lms.PlayQueue.template.entry">
<div class="row Lms-playqueue-entry Lms-vertical-align">
<div class="row Lms-playqueue-entry Lms-entry-hoverable Lms-vertical-align">
<div class="col-xs-9 Lms-playqueue-entry-name">
<h4>${name}</h4>
<h4><div class="Lms-trackname text-primary">${name}</div></h4>
${<if-has-artists-or-release>}
${<if-has-release>}<small>${release class="Lms-explore-releasename"}</small>${</if-has-release>}
${<if-has-artists>}<small>${artists}</small>${</if-has-artists>}
${<if-has-release>}<small>${release class="Lms-releasename text-primary"}</small>${</if-has-release>}
${<if-has-artists>}${artists}${</if-has-artists>}
${</if-has-artists-or-release>}
</div>
<div class="col-xs-3">
<div class="Lms-playqueue-entry-controls">
${play-btn}${del-btn}
</div>
<div class="Lms-playqueue-entry-duration">
<div class="Lms-playqueue-entry-duration text-muted">
${duration}
</div>
</div>
@@ -61,7 +65,7 @@
</message>
<message id="Lms.PlayQueue.template.entry-artist">
${artist class="Lms-explore-artistname"}
<small>${artist class="Lms-artistname text-muted"}</small>
</message>
</messages>