mirror of
https://git.joinsharkey.org/Sharkey/Sharkey.git
synced 2024-11-27 07:53:08 +02:00
🎨
This commit is contained in:
parent
140249172c
commit
2fa82bde16
3 changed files with 52 additions and 3 deletions
|
@ -4,6 +4,9 @@
|
||||||
<div class="main">
|
<div class="main">
|
||||||
<header>
|
<header>
|
||||||
<router-link class="name" :to="note.user | userPage" v-user-preview="note.userId">{{ note.user | userName }}</router-link>
|
<router-link class="name" :to="note.user | userPage" v-user-preview="note.userId">{{ note.user | userName }}</router-link>
|
||||||
|
<span class="is-admin" v-if="note.user.isAdmin">admin</span>
|
||||||
|
<span class="is-bot" v-if="note.user.isBot">bot</span>
|
||||||
|
<span class="is-cat" v-if="note.user.isCat">cat</span>
|
||||||
<span class="username"><mk-acct :user="note.user"/></span>
|
<span class="username"><mk-acct :user="note.user"/></span>
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<span class="mobile" v-if="note.viaMobile">%fa:mobile-alt%</span>
|
<span class="mobile" v-if="note.viaMobile">%fa:mobile-alt%</span>
|
||||||
|
@ -68,7 +71,6 @@ root(isDark)
|
||||||
align-items baseline
|
align-items baseline
|
||||||
margin-bottom 2px
|
margin-bottom 2px
|
||||||
white-space nowrap
|
white-space nowrap
|
||||||
line-height 21px
|
|
||||||
|
|
||||||
> .name
|
> .name
|
||||||
display block
|
display block
|
||||||
|
@ -84,6 +86,20 @@ root(isDark)
|
||||||
&:hover
|
&:hover
|
||||||
text-decoration underline
|
text-decoration underline
|
||||||
|
|
||||||
|
> .is-admin
|
||||||
|
> .is-bot
|
||||||
|
> .is-cat
|
||||||
|
margin 0 0.5em 0 0
|
||||||
|
padding 1px 5px
|
||||||
|
font-size 10px
|
||||||
|
color isDark ? #758188 : #aaa
|
||||||
|
border solid 1px isDark ? #57616f : #ddd
|
||||||
|
border-radius 3px
|
||||||
|
|
||||||
|
&.is-admin
|
||||||
|
border-color isDark ? #d42c41 : #f56a7b
|
||||||
|
color isDark ? #d42c41 : #f56a7b
|
||||||
|
|
||||||
> .username
|
> .username
|
||||||
margin 0 .5em 0 0
|
margin 0 .5em 0 0
|
||||||
color isDark ? #606984 : #d1d8da
|
color isDark ? #606984 : #d1d8da
|
||||||
|
|
|
@ -1,9 +1,13 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="sub">
|
<div class="sub" :class="{ smart: $store.state.device.postStyle == 'smart' }">
|
||||||
<mk-avatar class="avatar" :user="note.user"/>
|
<mk-avatar class="avatar" :user="note.user" v-if="$store.state.device.postStyle != 'smart'"/>
|
||||||
<div class="main">
|
<div class="main">
|
||||||
<header>
|
<header>
|
||||||
|
<mk-avatar class="avatar" :user="note.user" v-if="$store.state.device.postStyle == 'smart'"/>
|
||||||
<router-link class="name" :to="note.user | userPage">{{ note.user | userName }}</router-link>
|
<router-link class="name" :to="note.user | userPage">{{ note.user | userName }}</router-link>
|
||||||
|
<span class="is-admin" v-if="note.user.isAdmin">admin</span>
|
||||||
|
<span class="is-bot" v-if="note.user.isBot">bot</span>
|
||||||
|
<span class="is-cat" v-if="note.user.isCat">cat</span>
|
||||||
<span class="username"><mk-acct :user="note.user"/></span>
|
<span class="username"><mk-acct :user="note.user"/></span>
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<span class="mobile" v-if="note.viaMobile">%fa:mobile-alt%</span>
|
<span class="mobile" v-if="note.viaMobile">%fa:mobile-alt%</span>
|
||||||
|
@ -42,6 +46,13 @@ root(isDark)
|
||||||
@media (min-width 600px)
|
@media (min-width 600px)
|
||||||
padding 24px 32px
|
padding 24px 32px
|
||||||
|
|
||||||
|
&.smart
|
||||||
|
> .main
|
||||||
|
width 100%
|
||||||
|
|
||||||
|
> header
|
||||||
|
align-items center
|
||||||
|
|
||||||
&:after
|
&:after
|
||||||
content ""
|
content ""
|
||||||
display block
|
display block
|
||||||
|
@ -73,6 +84,13 @@ root(isDark)
|
||||||
margin-bottom 2px
|
margin-bottom 2px
|
||||||
white-space nowrap
|
white-space nowrap
|
||||||
|
|
||||||
|
> .avatar
|
||||||
|
flex-shrink 0
|
||||||
|
margin-right 8px
|
||||||
|
width 18px
|
||||||
|
height 18px
|
||||||
|
border-radius 100%
|
||||||
|
|
||||||
> .name
|
> .name
|
||||||
display block
|
display block
|
||||||
margin 0 0.5em 0 0
|
margin 0 0.5em 0 0
|
||||||
|
@ -88,6 +106,20 @@ root(isDark)
|
||||||
&:hover
|
&:hover
|
||||||
text-decoration underline
|
text-decoration underline
|
||||||
|
|
||||||
|
> .is-admin
|
||||||
|
> .is-bot
|
||||||
|
> .is-cat
|
||||||
|
margin 0 0.5em 0 0
|
||||||
|
padding 1px 5px
|
||||||
|
font-size 10px
|
||||||
|
color isDark ? #758188 : #aaa
|
||||||
|
border solid 1px isDark ? #57616f : #ddd
|
||||||
|
border-radius 3px
|
||||||
|
|
||||||
|
&.is-admin
|
||||||
|
border-color isDark ? #d42c41 : #f56a7b
|
||||||
|
color isDark ? #d42c41 : #f56a7b
|
||||||
|
|
||||||
> .username
|
> .username
|
||||||
text-align left
|
text-align left
|
||||||
margin 0
|
margin 0
|
||||||
|
|
|
@ -290,6 +290,7 @@ root(isDark)
|
||||||
padding 16px 32px
|
padding 16px 32px
|
||||||
|
|
||||||
.avatar
|
.avatar
|
||||||
|
flex-shrink 0
|
||||||
display inline-block
|
display inline-block
|
||||||
width 20px
|
width 20px
|
||||||
height 20px
|
height 20px
|
||||||
|
|
Loading…
Reference in a new issue