graphite/Sharkey
1
0
Fork 0
mirror of https://git.joinsharkey.org/Sharkey/Sharkey.git synced 2024-11-27 14:13:07 +02:00
Code Issues Projects Releases Packages Wiki Activity

🎨

Browse source
This commit is contained in:
syuilo 2018-12-13 01:18:17 +09:00
parent f3ee63fcbe
commit 8045bbff1c
No known key found for this signature in database
GPG key ID: BDC4C49D06AB9D69
2 changed files with 45 additions and 91 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

76
src/client/app/common/views/components/ui/button.vue
View file

@ -1,7 +1,7 @@
<template>
<component class="dmtdnykelhudezerjlfpbhgovrgnqqgr"
:is="link ? 'a' : 'button'"
:class="[styl, { inline, primary }]"
:class="{ inline, primary, wait }"
:type="type"
@click="$emit('click')"
@mousedown="onMousedown"
@ -48,11 +48,11 @@ export default Vue.extend({
required: false,
default: false
},
},
data() {
return {
styl: 'fill'
};
wait: {
type: Boolean,
required: false,
default: false
},
},
mounted() {
if (this.autofocus) {
@ -121,6 +121,24 @@ export default Vue.extend({
box-shadow none
text-decoration none
user-select none
color var(--text)
background var(--buttonBg)
&:not(:disabled):hover
background var(--buttonHoverBg)
&:not(:disabled):active
background var(--buttonActiveBg)
&.primary
color var(--primaryForeground)
background var(--primary)
&:not(:disabled):hover
background var(--primaryLighten5)
&:not(:disabled):active
background var(--primaryDarken5)
*
pointer-events none
@ -152,35 +170,25 @@ export default Vue.extend({
&.primary
font-weight bold
&.fill
color var(--text)
background var(--buttonBg)
&.wait
background linear-gradient(
45deg,
var(--primaryDarken10) 25%,
var(--primary) 25%,
var(--primary) 50%,
var(--primaryDarken10) 50%,
var(--primaryDarken10) 75%,
var(--primary) 75%,
var(--primary)
)
background-size 32px 32px
animation stripe-bg 1.5s linear infinite
opacity 0.7
cursor wait
&:not(:disabled):hover
background var(--buttonHoverBg)
&:not(:disabled):active
background var(--buttonActiveBg)
&.primary
color var(--primaryForeground)
background var(--primary)
&:not(:disabled):hover
background var(--primaryLighten5)
&:not(:disabled):active
background var(--primaryDarken5)
&:not(.fill)
color var(--primary)
background none
&:not(:disabled):hover
color var(--primaryDarken5)
&:not(:disabled):active
background var(--primaryAlpha03)
@keyframes stripe-bg
from {background-position: 0 0;}
to {background-position: -64px 32px;}
> .ripples
position absolute

60
src/client/app/desktop/views/components/post-form.vue
View file

@ -16,7 +16,7 @@
<b>{{ $t('recent-tags') }}:</b>
<a v-for="tag in recentHashtags.slice(0, 5)" @click="addTag(tag)" :title="$t('click-to-tagging')">#{{ tag }}</a>
</div>
<div class="local-only" v-if="this.localOnly == true">{{ $t('local-only-message') }}</div>
<div class="local-only" v-if="localOnly == true">{{ $t('local-only-message') }}</div>
<input v-show="useCw" ref="cw" v-model="cw" :placeholder="$t('annotations')" v-autocomplete="'cw'">
<div class="textarea">
<textarea :class="{ with: (files.length != 0 || poll) }"
@ -54,9 +54,9 @@
<span v-if="visibility === 'private'"><fa icon="lock"/></span>
</button>
<p class="text-count" :class="{ over: trimmedLength(text) > maxNoteTextLength }">{{ maxNoteTextLength - trimmedLength(text) }}</p>
<button :class="{ posting }" class="submit" :disabled="!canPost" @click="post">
<ui-button primary :wait="posting" class="submit" :disabled="!canPost" @click="post">
{{ posting ? $t('posting') : submitText }}<mk-ellipsis v-if="posting"/>
</button>
</ui-button>
<input ref="file" type="file" multiple="multiple" tabindex="-1" @change="onChangeFile"/>
<div class="dropzone" v-if="draghover"></div>
</div>
@ -684,62 +684,8 @@ export default Vue.extend({
position absolute
bottom 16px
right 16px
cursor pointer
padding 0
margin 0
width 110px
height 40px
font-size 1em
color var(--primaryForeground)
background var(--primary)
outline none
border none
border-radius 4px
&:not(:disabled)
font-weight bold
&:hover:not(:disabled)
background var(--primaryLighten5)
&:active:not(:disabled)
background var(--primaryDarken5)
&:focus
&:after
content ""
pointer-events none
position absolute
top -5px
right -5px
bottom -5px
left -5px
border 2px solid var(--primaryAlpha03)
border-radius 8px
&:disabled
opacity 0.7
cursor default
&.wait
background linear-gradient(
45deg,
var(--primaryDarken10) 25%,
var(--primary) 25%,
var(--primary) 50%,
var(--primaryDarken10) 50%,
var(--primaryDarken10) 75%,
var(--primary) 75%,
var(--primary)
)
background-size 32px 32px
animation stripe-bg 1.5s linear infinite
opacity 0.7
cursor wait
@keyframes stripe-bg
from {background-position: 0 0;}
to {background-position: -64px 32px;}
> .text-count
pointer-events none