🎨
This commit is contained in:
parent
3a5f55c471
commit
4a93dadc1c
4 changed files with 24 additions and 22 deletions
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="mk-note-detail" tabindex="-1">
|
||||
<div class="mk-note-detail" tabindex="-1" :class="{ shadow: $store.state.device.useShadow }">
|
||||
<button
|
||||
class="more"
|
||||
v-if="appearNote.reply && appearNote.reply.replyId && conversation.length == 0"
|
||||
|
@ -165,10 +165,12 @@ export default Vue.extend({
|
|||
text-align left
|
||||
background var(--face)
|
||||
border-radius 8px
|
||||
box-shadow 0 4px 16px rgba(#000, 0.1)
|
||||
|
||||
@media (min-width 500px)
|
||||
box-shadow 0 8px 32px rgba(#000, 0.1)
|
||||
&.shadow
|
||||
box-shadow 0 4px 16px rgba(#000, 0.1)
|
||||
|
||||
@media (min-width 500px)
|
||||
box-shadow 0 8px 32px rgba(#000, 0.1)
|
||||
|
||||
> .fetching
|
||||
padding 64px 0
|
||||
|
@ -180,7 +182,7 @@ export default Vue.extend({
|
|||
width 100%
|
||||
font-size 1em
|
||||
text-align center
|
||||
color #999
|
||||
color var(--text)
|
||||
cursor pointer
|
||||
background var(--subNoteBg)
|
||||
outline none
|
||||
|
@ -289,7 +291,7 @@ export default Vue.extend({
|
|||
> .location
|
||||
margin 4px 0
|
||||
font-size 12px
|
||||
color #ccc
|
||||
color var(--text)
|
||||
|
||||
> .map
|
||||
width 100%
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="ivaojijs">
|
||||
<div class="ivaojijs" :class="{ shadow: $store.state.device.useShadow }">
|
||||
<div class="empty" v-if="notes.length == 0 && !fetching && inited">{{ $t('@.no-notes') }}</div>
|
||||
|
||||
<mk-error v-if="!fetching && !inited" @retry="init()"/>
|
||||
|
@ -192,10 +192,12 @@ export default Vue.extend({
|
|||
overflow hidden
|
||||
background var(--face)
|
||||
border-radius 8px
|
||||
box-shadow 0 4px 16px rgba(#000, 0.1)
|
||||
|
||||
@media (min-width 500px)
|
||||
box-shadow 0 8px 32px rgba(#000, 0.1)
|
||||
&.shadow
|
||||
box-shadow 0 4px 16px rgba(#000, 0.1)
|
||||
|
||||
@media (min-width 500px)
|
||||
box-shadow 0 8px 32px rgba(#000, 0.1)
|
||||
|
||||
> .empty
|
||||
padding 16px
|
||||
|
@ -239,13 +241,7 @@ export default Vue.extend({
|
|||
padding 32px
|
||||
max-width 400px
|
||||
text-align center
|
||||
color #999
|
||||
|
||||
> [data-icon]
|
||||
display block
|
||||
margin-bottom 16px
|
||||
font-size 3em
|
||||
color #ccc
|
||||
color var(--text)
|
||||
|
||||
> footer
|
||||
text-align center
|
||||
|
@ -258,7 +254,7 @@ export default Vue.extend({
|
|||
margin 0
|
||||
padding 16px
|
||||
width 100%
|
||||
color #ccc
|
||||
color var(--text)
|
||||
|
||||
@media (min-width 500px)
|
||||
padding 20px
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="header" ref="root">
|
||||
<div class="header" ref="root" :class="{ shadow: $store.state.device.useShadow }">
|
||||
<p class="warn" v-if="env != 'production'">{{ $t('@.do-not-use-in-production') }} <a href="/assets/flush.html?force">Flush</a></p>
|
||||
<div class="main" ref="main">
|
||||
<div class="backdrop"></div>
|
||||
|
@ -47,7 +47,9 @@ export default Vue.extend({
|
|||
z-index 1024
|
||||
width calc(100% + 16px)
|
||||
padding 0 8px
|
||||
box-shadow 0 0px 8px rgba(0, 0, 0, 0.25)
|
||||
|
||||
&.shadow
|
||||
box-shadow 0 0px 8px rgba(0, 0, 0, 0.25)
|
||||
|
||||
&, *
|
||||
user-select none
|
||||
|
|
|
@ -59,7 +59,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<nav v-if="$route.name == 'user'">
|
||||
<nav v-if="$route.name == 'user'" :class="{ shadow: $store.state.device.useShadow }">
|
||||
<div class="nav-container">
|
||||
<a :data-active="page == 'home'" @click="page = 'home'"><fa icon="home"/> {{ $t('overview') }}</a>
|
||||
<a :data-active="page == 'notes'" @click="page = 'notes'"><fa :icon="['far', 'comment-alt']"/> {{ $t('timeline') }}</a>
|
||||
|
@ -315,10 +315,12 @@ export default Vue.extend({
|
|||
position -webkit-sticky
|
||||
position sticky
|
||||
top 47px
|
||||
box-shadow 0 4px 4px var(--mobileUserPageHeaderShadow)
|
||||
background-color $bg
|
||||
z-index 2
|
||||
|
||||
&.shadow
|
||||
box-shadow 0 4px 4px var(--mobileUserPageHeaderShadow)
|
||||
|
||||
> .nav-container
|
||||
display flex
|
||||
justify-content center
|
||||
|
|
Loading…
Reference in a new issue