Update avatar.vue
This commit is contained in:
		
							parent
							
								
									f15878cc6f
								
							
						
					
					
						commit
						38b75ad977
					
				
					 1 changed files with 11 additions and 5 deletions
				
			
		| 
						 | 
					@ -1,14 +1,14 @@
 | 
				
			||||||
<template>
 | 
					<template>
 | 
				
			||||||
	<span class="mk-avatar" :class="{ cat }" :title="user | acct" v-if="disableLink && !disablePreview" v-user-preview="user.id" @click="onClick">
 | 
						<span class="mk-avatar" :class="{ cat, white }" :title="user | acct" v-if="disableLink && !disablePreview" v-user-preview="user.id" @click="onClick">
 | 
				
			||||||
		<span class="inner" :style="style"></span>
 | 
							<span class="inner" :style="style"></span>
 | 
				
			||||||
	</span>
 | 
						</span>
 | 
				
			||||||
	<span class="mk-avatar" :class="{ cat }" :title="user | acct" v-else-if="disableLink && disablePreview" @click="onClick">
 | 
						<span class="mk-avatar" :class="{ cat, white }" :title="user | acct" v-else-if="disableLink && disablePreview" @click="onClick">
 | 
				
			||||||
		<span class="inner" :style="style"></span>
 | 
							<span class="inner" :style="style"></span>
 | 
				
			||||||
	</span>
 | 
						</span>
 | 
				
			||||||
	<router-link class="mk-avatar" :class="{ cat }" :to="user | userPage" :title="user | acct" :target="target" v-else-if="!disableLink && !disablePreview" v-user-preview="user.id">
 | 
						<router-link class="mk-avatar" :class="{ cat, white }" :to="user | userPage" :title="user | acct" :target="target" v-else-if="!disableLink && !disablePreview" v-user-preview="user.id">
 | 
				
			||||||
		<span class="inner" :style="style"></span>
 | 
							<span class="inner" :style="style"></span>
 | 
				
			||||||
	</router-link>
 | 
						</router-link>
 | 
				
			||||||
	<router-link class="mk-avatar" :class="{ cat }" :to="user | userPage" :title="user | acct" :target="target" v-else-if="!disableLink && disablePreview">
 | 
						<router-link class="mk-avatar" :class="{ cat, white }" :to="user | userPage" :title="user | acct" :target="target" v-else-if="!disableLink && disablePreview">
 | 
				
			||||||
		<span class="inner" :style="style"></span>
 | 
							<span class="inner" :style="style"></span>
 | 
				
			||||||
	</router-link>
 | 
						</router-link>
 | 
				
			||||||
</template>
 | 
					</template>
 | 
				
			||||||
| 
						 | 
					@ -41,6 +41,9 @@ export default Vue.extend({
 | 
				
			||||||
		cat(): boolean {
 | 
							cat(): boolean {
 | 
				
			||||||
			return this.user.isCat && this.$store.state.settings.circleIcons;
 | 
								return this.user.isCat && this.$store.state.settings.circleIcons;
 | 
				
			||||||
		},
 | 
							},
 | 
				
			||||||
 | 
							white():boolean {
 | 
				
			||||||
 | 
								return this.$store.state.device.darkmode;
 | 
				
			||||||
 | 
							},
 | 
				
			||||||
		style(): any {
 | 
							style(): any {
 | 
				
			||||||
			return {
 | 
								return {
 | 
				
			||||||
				backgroundColor: this.lightmode
 | 
									backgroundColor: this.lightmode
 | 
				
			||||||
| 
						 | 
					@ -69,13 +72,16 @@ export default Vue.extend({
 | 
				
			||||||
	&.cat::before,
 | 
						&.cat::before,
 | 
				
			||||||
	&.cat::after
 | 
						&.cat::after
 | 
				
			||||||
		background #df548f
 | 
							background #df548f
 | 
				
			||||||
		border solid 4px #ffffff
 | 
							border solid 4px #202224
 | 
				
			||||||
		box-sizing border-box
 | 
							box-sizing border-box
 | 
				
			||||||
		content ''
 | 
							content ''
 | 
				
			||||||
		display inline-block
 | 
							display inline-block
 | 
				
			||||||
		height 50%
 | 
							height 50%
 | 
				
			||||||
		width 50%
 | 
							width 50%
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
							&.white
 | 
				
			||||||
 | 
								border-color #e0eefd
 | 
				
			||||||
 | 
					 
 | 
				
			||||||
	&.cat::before
 | 
						&.cat::before
 | 
				
			||||||
		border-radius 0 75% 75%
 | 
							border-radius 0 75% 75%
 | 
				
			||||||
		transform rotate(37.5deg) skew(30deg)
 | 
							transform rotate(37.5deg) skew(30deg)
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue