Support compact artist header (optional)
This commit is contained in:
parent
a155bacf6d
commit
497ea0f645
3 changed files with 24 additions and 12 deletions
|
@ -109,7 +109,7 @@
|
||||||
background: var(--color2);
|
background: var(--color2);
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
overflow-y: overlay;
|
overflow-y: overlay;
|
||||||
|
|
||||||
.list-group-item {
|
.list-group-item {
|
||||||
border-radius: 0px;
|
border-radius: 0px;
|
||||||
}
|
}
|
||||||
|
@ -193,11 +193,11 @@
|
||||||
|
|
||||||
.list-group-item {
|
.list-group-item {
|
||||||
padding: 12px 6px;
|
padding: 12px 6px;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
filter: brightness(1.2);
|
filter: brightness(1.2);
|
||||||
}
|
}
|
||||||
|
|
||||||
&:active {
|
&:active {
|
||||||
filter: brightness(0.8);
|
filter: brightness(0.8);
|
||||||
}
|
}
|
||||||
|
@ -210,7 +210,7 @@
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
.stylestack-editor {
|
.stylestack-editor {
|
||||||
padding-bottom: 16px;
|
padding-bottom: 16px;
|
||||||
}
|
}
|
||||||
|
@ -1233,6 +1233,10 @@
|
||||||
min-height: 80vh;
|
min-height: 80vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.animated .artist-header-compact {
|
||||||
|
min-height: 40vh;
|
||||||
|
}
|
||||||
|
|
||||||
.artist-header {
|
.artist-header {
|
||||||
//background: linear-gradient(45deg, var(--keyColor), #0e0e0e);
|
//background: linear-gradient(45deg, var(--keyColor), #0e0e0e);
|
||||||
color: white;
|
color: white;
|
||||||
|
@ -2248,7 +2252,7 @@
|
||||||
.settings-tab-content {
|
.settings-tab-content {
|
||||||
height:100%;
|
height:100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.no-sidebar {
|
&.no-sidebar {
|
||||||
.gh-header {
|
.gh-header {
|
||||||
>.row {
|
>.row {
|
||||||
|
|
|
@ -547,6 +547,14 @@
|
||||||
:disabled="app.cfg.visual.customAccentColor" switch/>
|
:disabled="app.cfg.visual.customAccentColor" switch/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="md-option-line">
|
||||||
|
<div class="md-option-segment">
|
||||||
|
{{$root.getLz('settings.option.visual.compactArtistHeader')}}
|
||||||
|
</div>
|
||||||
|
<div class="md-option-segment_auto">
|
||||||
|
<input type="checkbox" v-model="app.cfg.visual.compactArtistHeader" switch/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div class="md-option-line">
|
<div class="md-option-line">
|
||||||
<div class="md-option-segment">
|
<div class="md-option-segment">
|
||||||
{{$root.getLz('settings.option.visual.hardwareAcceleration')}}<br>
|
{{$root.getLz('settings.option.visual.hardwareAcceleration')}}<br>
|
||||||
|
@ -771,19 +779,19 @@
|
||||||
<option value='afrikaans'>Afrikaans</option>
|
<option value='afrikaans'>Afrikaans</option>
|
||||||
<option value='albanian'>Albanian</option>
|
<option value='albanian'>Albanian</option>
|
||||||
<option value='arab'>Arabic</option>
|
<option value='arab'>Arabic</option>
|
||||||
<option value='armenian'>Armenian</option>
|
<option value='armenian'>Armenian</option>
|
||||||
<option value='azerbaijani'>Azerbaijani</option>
|
<option value='azerbaijani'>Azerbaijani</option>
|
||||||
<option value='bengali'>Bengali</option>
|
<option value='bengali'>Bengali</option>
|
||||||
<option value='bosnian'>Bosnian</option>
|
<option value='bosnian'>Bosnian</option>
|
||||||
<option value='brazilian'>Brazilian</option>
|
<option value='brazilian'>Brazilian</option>
|
||||||
<option value='bulgarian'>Bulgarian</option>
|
<option value='bulgarian'>Bulgarian</option>
|
||||||
<option value='chinese'>Chinese (Simplified)</option>
|
<option value='chinese'>Chinese (Simplified)</option>
|
||||||
<option value='chinese-trad'>Chinese (Traditional)</option>
|
<option value='chinese-trad'>Chinese (Traditional)</option>
|
||||||
<option value='chinese-romaji'>Romanized Chinese</option>
|
<option value='chinese-romaji'>Romanized Chinese</option>
|
||||||
<option value='croatian'>Croatian</option>
|
<option value='croatian'>Croatian</option>
|
||||||
<option value='czech'>Czech</option>
|
<option value='czech'>Czech</option>
|
||||||
<option value='danish'>Danish</option>
|
<option value='danish'>Danish</option>
|
||||||
<option value='dutch'>Dutch</option>
|
<option value='dutch'>Dutch</option>
|
||||||
<option value='estonian'>Estonian</option>
|
<option value='estonian'>Estonian</option>
|
||||||
<option value='english'>English</option>
|
<option value='english'>English</option>
|
||||||
<option value='farsi'>Farsi</option>
|
<option value='farsi'>Farsi</option>
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<script type="text/x-template" id="cider-artist">
|
<script type="text/x-template" id="cider-artist">
|
||||||
<div class="content-inner artist-page"
|
<div class="content-inner artist-page"
|
||||||
:class="[(data.attributes.editorialVideo && (data.attributes.editorialVideo.motionArtistWide16x9 || data.attributes.editorialVideo.motionArtistFullscreen16x9) || hasHero()) ? 'animated' : '']">
|
:class="[(data.attributes.editorialVideo && (data.attributes.editorialVideo.motionArtistWide16x9 || data.attributes.editorialVideo.motionArtistFullscreen16x9) || hasHero()) ? 'animated' : '']">
|
||||||
<div class="artist-header" :key="data.id" v-observe-visibility="{callback: isHeaderVisible}">
|
<div :class="['artist-header', { 'artist-header-compact': app.cfg.visual.compactArtistHeader }]" :key="data.id" v-observe-visibility="{callback: isHeaderVisible}">
|
||||||
<animatedartwork-view
|
<animatedartwork-view
|
||||||
:priority="true"
|
:priority="true"
|
||||||
v-if="hasAnimated()"
|
v-if="hasAnimated()"
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue