极简模式时间显示位置异常
This commit is contained in:
parent
b34920f5c0
commit
9c6c7eb4c2
|
@ -42,14 +42,21 @@ export default defineComponent({
|
||||||
<div
|
<div
|
||||||
class={clsx(
|
class={clsx(
|
||||||
'absolute z-20 shadow-text tracking-widest font-normal transition-all ',
|
'absolute z-20 shadow-text tracking-widest font-normal transition-all ',
|
||||||
layout.isCompact ? 'text-[13px] flex z-20 items-center pointer-events-none gap-x-2' : 'h-[110px]'
|
layout.isCompact && !layout.state.simple
|
||||||
|
? 'text-[13px] flex z-20 items-center pointer-events-none gap-x-2'
|
||||||
|
: 'h-[110px]'
|
||||||
)}
|
)}
|
||||||
style={{
|
style={{
|
||||||
color: 'white',
|
color: 'white',
|
||||||
transitionDuration: '.4s',
|
transitionDuration: '.4s',
|
||||||
left: layout.isCompact ? '20px' : '50%',
|
left: layout.isCompact && !layout.state.simple ? '20px' : '50%',
|
||||||
top: layout.isCompact ? '20px' : layout.state.simple ? '100px' : '50px',
|
top:
|
||||||
transform: layout.isCompact ? '' : 'translate(-50%,0)'
|
layout.isCompact && !layout.state.simple
|
||||||
|
? '20px'
|
||||||
|
: layout.state.simple
|
||||||
|
? '100px'
|
||||||
|
: '50px',
|
||||||
|
transform: layout.isCompact && !layout.state.simple ? '' : 'translate(-50%,0)'
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Transition>
|
<Transition>
|
||||||
|
@ -58,7 +65,7 @@ export default defineComponent({
|
||||||
<div
|
<div
|
||||||
class={
|
class={
|
||||||
'transition-all ' +
|
'transition-all ' +
|
||||||
(layout.isCompact
|
(layout.isCompact && !layout.state.simple
|
||||||
? 'text-[1.2rem] leading-[1.4rem]'
|
? 'text-[1.2rem] leading-[1.4rem]'
|
||||||
: 'text-[8vh] leading-[4rem]')
|
: 'text-[8vh] leading-[4rem]')
|
||||||
}
|
}
|
||||||
|
@ -70,7 +77,7 @@ export default defineComponent({
|
||||||
<div
|
<div
|
||||||
class={
|
class={
|
||||||
'transition-all ' +
|
'transition-all ' +
|
||||||
(layout.isCompact
|
(layout.isCompact && !layout.state.simple
|
||||||
? 'text-[1.2rem] leading-[1.4rem]'
|
? 'text-[1.2rem] leading-[1.4rem]'
|
||||||
: 'text-[8vh] leading-[4rem]')
|
: 'text-[8vh] leading-[4rem]')
|
||||||
}
|
}
|
||||||
|
@ -84,26 +91,32 @@ export default defineComponent({
|
||||||
? settings.state.simpleModeShowString.includes('showDate') && (
|
? settings.state.simpleModeShowString.includes('showDate') && (
|
||||||
<div
|
<div
|
||||||
class={
|
class={
|
||||||
'flex items-center gap-4 ' + (layout.isCompact ? 'text-[1.2rem]' : 'justify-center mt-4')
|
'flex items-center gap-4 ' +
|
||||||
|
(layout.isCompact && !layout.state.simple
|
||||||
|
? 'text-[1.2rem]'
|
||||||
|
: 'justify-center mt-4')
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
{settings.state.timeOptions.includes('date') && <div>{text.value.dateStr}</div>}
|
{settings.state.timeOptions.includes('date') && <div>{text.value.dateStr}</div>}
|
||||||
<Transition>
|
<Transition>
|
||||||
{!layout.isCompact && settings.state.timeOptions.includes('week') && (
|
{!(layout.isCompact && !layout.state.simple) &&
|
||||||
|
settings.state.timeOptions.includes('week') && (
|
||||||
<div>星期{info.value.dayWeek}</div>
|
<div>星期{info.value.dayWeek}</div>
|
||||||
)}
|
)}
|
||||||
</Transition>
|
</Transition>
|
||||||
<Transition>
|
<Transition>
|
||||||
{!layout.isCompact && settings.state.timeOptions.includes('lunal') && (
|
{!(layout.isCompact && !layout.state.simple) &&
|
||||||
<div>{info.value.day}</div>
|
settings.state.timeOptions.includes('lunal') && <div>{info.value.day}</div>}
|
||||||
)}
|
|
||||||
</Transition>
|
</Transition>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
: settings.state!.showTime && (
|
: settings.state!.showTime && (
|
||||||
<div
|
<div
|
||||||
class={
|
class={
|
||||||
'flex items-center gap-4 ' + (layout.isCompact ? ' text-[1.2rem]' : 'mt-4 justify-center')
|
'flex items-center gap-4 ' +
|
||||||
|
(layout.isCompact && !layout.state.simple
|
||||||
|
? ' text-[1.2rem]'
|
||||||
|
: 'mt-4 justify-center')
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
{settings.state.timeOptions.includes('date') && <div>{text.value.dateStr}</div>}
|
{settings.state.timeOptions.includes('date') && <div>{text.value.dateStr}</div>}
|
||||||
|
|
|
@ -23,7 +23,7 @@ export default defineComponent(
|
||||||
props.isMini
|
props.isMini
|
||||||
? {}
|
? {}
|
||||||
: {
|
: {
|
||||||
top: layout.isCompact ? '50px' : layout.state.simple ? '230px' : '172px',
|
top: layout.isCompact && !layout.state.simple ? '50px' : layout.state.simple ? '230px' : '172px',
|
||||||
width: settings.state.searchWidth + 'rem'
|
width: settings.state.searchWidth + 'rem'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue