This commit is contained in:
syuilo 2017-11-02 12:39:19 +09:00
parent 1d828c9784
commit e7fbf873ef
12 changed files with 80 additions and 28 deletions

View File

@ -170,6 +170,13 @@ ch:
new: "Create new channel"
channel-title: "Channel title"
mk-channel-form:
textarea: "Write here"
upload: "Upload"
drive: "Drive"
post: "Do"
posting: "Doing"
desktop:
tags:
mk-api-info:

View File

@ -170,6 +170,13 @@ ch:
new: "チャンネルを作成"
channel-title: "チャンネルのタイトル"
mk-channel-form:
textarea: "書いて"
upload: "アップロード"
drive: "ドライブ"
post: "やる"
posting: "やってます"
desktop:
tags:
mk-api-info:

View File

@ -5,8 +5,6 @@ json('../../const.json')
$theme-color = themeColor
$theme-color-foreground = themeColorForeground
@import './reset'
/*
::selection
background $theme-color
@ -14,6 +12,9 @@ $theme-color-foreground = themeColorForeground
*/
*
position relative
box-sizing border-box
background-clip padding-box !important
tap-highlight-color rgba($theme-color, 0.7)
-webkit-tap-highlight-color rgba($theme-color, 0.7)
@ -29,6 +30,9 @@ html
&, *
cursor progress !important
body
overflow-wrap break-word
#error
padding 32px
color #fff

View File

@ -1,4 +1,5 @@
@import "../base"
@import "../app"
@import "../reset"
html
background #eee

View File

@ -1,5 +1,10 @@
@import "../base"
@import "../app"
html
padding 8px
background #efefef
#wait
top auto
bottom 15px
left 15px

View File

@ -49,6 +49,9 @@
> .body
margin 8px 0 0 0
> mk-channel-form
max-width 500px
</style>
<script>
import Progress from '../../common/scripts/loading';
@ -240,20 +243,45 @@
<mk-channel-form>
<p if={ reply }><b>&gt;&gt;{ reply.index }</b> ({ reply.user.name }): <a onclick={ clearReply }>[x]</a></p>
<textarea ref="text" disabled={ wait } oninput={ update } onkeydown={ onkeydown } onpaste={ onpaste }></textarea>
<button class={ wait: wait } ref="submit" disabled={ wait || (refs.text.value.length == 0) } onclick={ post }>
{ wait ? 'やってます' : 'やる' }<mk-ellipsis if={ wait }/>
</button>
<br>
<button onclick={ drive }>ドライブ</button>
<textarea ref="text" disabled={ wait } oninput={ update } onkeydown={ onkeydown } onpaste={ onpaste } placeholder="%i18n:ch.tags.mk-channel-form.textarea%"></textarea>
<div class="actions">
<button onclick={ selectFile }><i class="fa fa-upload"></i>%i18n:ch.tags.mk-channel-form.upload%</button>
<button onclick={ drive }><i class="fa fa-cloud"></i>%i18n:ch.tags.mk-channel-form.drive%</button>
<button class={ wait: wait } ref="submit" disabled={ wait || (refs.text.value.length == 0) } onclick={ post }>
<i class="fa fa-paper-plane" if={ !wait }></i>{ wait ? '%i18n:ch.tags.mk-channel-form.posting%' : '%i18n:ch.tags.mk-channel-form.post%' }<mk-ellipsis if={ wait }/>
</button>
</div>
<mk-uploader ref="uploader"/>
<ol if={ files }>
<li each={ files }>{ name }</li>
</ol>
<input ref="file" type="file" accept="image/*" multiple="multiple" onchange={ changeFile }/>
<style>
:scope
display block
> textarea
width 100%
max-width 100%
min-width 100%
min-height 5em
> .actions
display flex
> button
> i
margin-right 0.25em
&:last-child
margin-left auto
&.wait
cursor wait
> input[type='file']
display none
</style>
<script>
import CONFIG from '../../common/scripts/config';
@ -314,6 +342,14 @@
});
};
this.changeFile = () => {
this.refs.file.files.forEach(this.upload);
};
this.selectFile = () => {
this.refs.file.click();
};
this.drive = () => {
window['cb'] = files => {
this.update({

View File

@ -1,4 +1,5 @@
@import "../base"
@import "../app"
@import "../reset"
@import "../../../../node_modules/cropperjs/dist/cropper.css"
*::input-placeholder

View File

@ -1,4 +1,5 @@
@import "../base"
@import "../app"
@import "../reset"
html
background-color #fff

View File

@ -1,4 +1,5 @@
@import "../base"
@import "../app"
@import "../reset"
#wait
top auto

View File

@ -1,16 +1,3 @@
*
position relative
box-sizing border-box
background-clip padding-box !important
html
body
margin 0
padding 0
body
overflow-wrap break-word
input:not([type])
input[type='text']
input[type='password']

View File

@ -1,4 +1,5 @@
@import "../base"
@import "../app"
@import "../reset"
html
color #456267

View File

@ -1,4 +1,5 @@
@import "../base"
@import "../app"
@import "../reset"
html
color #456267