amechama/sharkey
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wip

Browse Source
This commit is contained in:
syuilo 2017-12-08 13:41:34 +09:00
parent 25068f12f5
commit 7f3fb90b05
11 changed files with 58 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/web/app/common/tags/signin.tag
View File

@ -24,7 +24,7 @@
display block display block
margin 12px 0 margin 12px 0
i [data-fa]
display block display block
pointer-events none pointer-events none
position absolute position absolute

2
src/web/app/common/tags/signup.tag
View File

@ -182,7 +182,7 @@
this.passwordRetypeState = null; this.passwordRetypeState = null;
this.recaptchaed = false; this.recaptchaed = false;
window.onEecaptchaed = () => { window.onRecaptchaed = () => {
this.recaptchaed = true; this.recaptchaed = true;
this.update(); this.update();
}; };

16
src/web/app/common/tags/url.tag
View File

@ -1,14 +1,20 @@
<mk-url><a href={ url } target={ opts.target }><span class="schema">{ schema }//</span><span class="hostname">{ hostname }</span><span class="port" if={ port != '' }>:{ port }</span><span class="pathname" if={ pathname != '' }>{ pathname }</span><span class="query">{ query }</span><span class="hash">{ hash }</span></a> <mk-url>
<a href={ url } target={ opts.target }>
<span class="schema">{ schema }//</span>
<span class="hostname">{ hostname }</span>
<span class="port" if={ port != '' }>:{ port }</span>
<span class="pathname" if={ pathname != '' }>{ pathname }</span>
<span class="query">{ query }</span>
<span class="hash">{ hash }</span>
%fa:external-link-square-alt%
</a>
<style> <style>
:scope :scope
word-break break-all word-break break-all
> a > a
&:after > [data-fa]
content "\f14c"
display inline-block
padding-left 2px padding-left 2px
font-family FontAwesome
font-size .9em font-size .9em
font-weight 400 font-weight 400
font-style normal font-style normal

40
src/web/app/desktop/tags/notifications.tag
View File

@ -8,7 +8,10 @@
<img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=48' } alt="avatar"/> <img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=48' } alt="avatar"/>
</a> </a>
<div class="text"> <div class="text">
<p><mk-reaction-icon reaction={ notification.reaction }/><a href={ '/' + notification.user.username } data-user-preview={ notification.user.id }>{ notification.user.name }</a></p><a class="post-ref" href={ '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a> <p><mk-reaction-icon reaction={ notification.reaction }/><a href={ '/' + notification.user.username } data-user-preview={ notification.user.id }>{ notification.user.name }</a></p>
<a class="post-ref" href={ '/' + notification.post.user.username + '/' + notification.post.id }>
%fa:quote-left%{ getPostSummary(notification.post) }%fa:quote-right%
</a>
</div> </div>
</virtual> </virtual>
<virtual if={ notification.type == 'repost' }> <virtual if={ notification.type == 'repost' }>
@ -16,7 +19,10 @@
<img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=48' } alt="avatar"/> <img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=48' } alt="avatar"/>
</a> </a>
<div class="text"> <div class="text">
<p>%fa:retweet%<a href={ '/' + notification.post.user.username } data-user-preview={ notification.post.user_id }>{ notification.post.user.name }</a></p><a class="post-ref" href={ '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post.repost) }</a> <p>%fa:retweet%<a href={ '/' + notification.post.user.username } data-user-preview={ notification.post.user_id }>{ notification.post.user.name }</a></p>
<a class="post-ref" href={ '/' + notification.post.user.username + '/' + notification.post.id }>
%fa:quote-left%{ getPostSummary(notification.post.repost) }%fa:quote-right%
</a>
</div> </div>
</virtual> </virtual>
<virtual if={ notification.type == 'quote' }> <virtual if={ notification.type == 'quote' }>
@ -24,7 +30,8 @@
<img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=48' } alt="avatar"/> <img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=48' } alt="avatar"/>
</a> </a>
<div class="text"> <div class="text">
<p>%fa:quote-left%<a href={ '/' + notification.post.user.username } data-user-preview={ notification.post.user_id }>{ notification.post.user.name }</a></p><a class="post-preview" href={ '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a> <p>%fa:quote-left%<a href={ '/' + notification.post.user.username } data-user-preview={ notification.post.user_id }>{ notification.post.user.name }</a></p>
<a class="post-preview" href={ '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a>
</div> </div>
</virtual> </virtual>
<virtual if={ notification.type == 'follow' }> <virtual if={ notification.type == 'follow' }>
@ -40,7 +47,8 @@
<img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=48' } alt="avatar"/> <img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=48' } alt="avatar"/>
</a> </a>
<div class="text"> <div class="text">
<p>%fa:reply%<a href={ '/' + notification.post.user.username } data-user-preview={ notification.post.user_id }>{ notification.post.user.name }</a></p><a class="post-preview" href={ '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a> <p>%fa:reply%<a href={ '/' + notification.post.user.username } data-user-preview={ notification.post.user_id }>{ notification.post.user.name }</a></p>
<a class="post-preview" href={ '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a>
</div> </div>
</virtual> </virtual>
<virtual if={ notification.type == 'mention' }> <virtual if={ notification.type == 'mention' }>
@ -48,7 +56,8 @@
<img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=48' } alt="avatar"/> <img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=48' } alt="avatar"/>
</a> </a>
<div class="text"> <div class="text">
<p>%fa:at%<a href={ '/' + notification.post.user.username } data-user-preview={ notification.post.user_id }>{ notification.post.user.name }</a></p><a class="post-preview" href={ '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a> <p>%fa:at%<a href={ '/' + notification.post.user.username } data-user-preview={ notification.post.user_id }>{ notification.post.user.name }</a></p>
<a class="post-preview" href={ '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a>
</div> </div>
</virtual> </virtual>
<virtual if={ notification.type == 'poll_vote' }> <virtual if={ notification.type == 'poll_vote' }>
@ -56,11 +65,17 @@
<img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=48' } alt="avatar"/> <img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=48' } alt="avatar"/>
</a> </a>
<div class="text"> <div class="text">
<p>%fa:chart-pie%<a href={ '/' + notification.user.username } data-user-preview={ notification.user.id }>{ notification.user.name }</a></p><a class="post-ref" href={ '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a> <p>%fa:chart-pie%<a href={ '/' + notification.user.username } data-user-preview={ notification.user.id }>{ notification.user.name }</a></p>
<a class="post-ref" href={ '/' + notification.post.user.username + '/' + notification.post.id }>
%fa:quote-left%{ getPostSummary(notification.post) }%fa:quote-right%
</a>
</div> </div>
</virtual> </virtual>
</div> </div>
<p class="date" if={ i != notifications.length - 1 && notification._date != notifications[i + 1]._date }><span>%fa:angle-up%{ notification._datetext }</span><span>%fa:angle-down%{ notifications[i + 1]._datetext }</span></p> <p class="date" if={ i != notifications.length - 1 && notification._date != notifications[i + 1]._date }>
<span>%fa:angle-up%{ notification._datetext }</span>
<span>%fa:angle-down%{ notifications[i + 1]._datetext }</span>
</p>
</virtual> </virtual>
</div> </div>
<button class="more { fetching: fetchingMoreNotifications }" if={ moreNotifications } onclick={ fetchMoreNotifications } disabled={ fetchingMoreNotifications }> <button class="more { fetching: fetchingMoreNotifications }" if={ moreNotifications } onclick={ fetchMoreNotifications } disabled={ fetchingMoreNotifications }>
@ -129,20 +144,13 @@
.post-ref .post-ref
color rgba(0, 0, 0, 0.7) color rgba(0, 0, 0, 0.7)
&:before, &:after [data-fa]
font-family FontAwesome
font-size 1em font-size 1em
font-weight normal font-weight normal
font-style normal font-style normal
display inline-block display inline-block
margin-right 3px margin-right 3px
&:before
content "\f10d"
&:after
content "\f10e"
&.repost, &.quote &.repost, &.quote
.text p i .text p i
color #77B255 color #77B255
@ -168,7 +176,7 @@
span span
margin 0 16px margin 0 16px
i [data-fa]
margin-right 8px margin-right 8px
> .more > .more

12
src/web/app/desktop/tags/post-detail.tag
View File

@ -124,7 +124,7 @@
margin 0 8px 0 0 margin 0 8px 0 0
border-radius 6px border-radius 6px
i [data-fa]
margin-right 4px margin-right 4px
.name .name
@ -205,16 +205,6 @@
font-size 1.5em font-size 1.5em
color #717171 color #717171
.link
&:after
content "\f14c"
display inline-block
padding-left 2px
font-family FontAwesome
font-size .9em
font-weight 400
font-style normal
> mk-url-preview > mk-url-preview
margin-top 8px margin-top 8px

14
src/web/app/desktop/tags/timeline.tag
View File

@ -23,7 +23,7 @@
span span
margin 0 16px margin 0 16px
i [data-fa]
margin-right 8px margin-right 8px
> footer > footer
@ -203,7 +203,7 @@
margin 0 8px 0 0 margin 0 8px 0 0
border-radius 6px border-radius 6px
i [data-fa]
margin-right 4px margin-right 4px
.name .name
@ -324,16 +324,6 @@
mk-url-preview mk-url-preview
margin-top 8px margin-top 8px
.link
&:after
content "\f14c"
display inline-block
padding-left 2px
font-family FontAwesome
font-size .9em
font-weight 400
font-style normal
> .channel > .channel
margin 0 margin 0

2
src/web/app/desktop/tags/ui.tag
View File

@ -678,7 +678,7 @@
font-family Meiryo, sans-serif font-family Meiryo, sans-serif
text-decoration none text-decoration none
i [data-fa]
margin-left 8px margin-left 8px
> .avatar > .avatar

15
src/web/app/mobile/tags/notification-preview.tag
View File

@ -3,14 +3,14 @@
<img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/> <img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
<div class="text"> <div class="text">
<p><mk-reaction-icon reaction={ notification.reaction }/>{ notification.user.name }</p> <p><mk-reaction-icon reaction={ notification.reaction }/>{ notification.user.name }</p>
<p class="post-ref">{ getPostSummary(notification.post) }</p> <p class="post-ref">%fa:quote-left%{ getPostSummary(notification.post) }%fa:quote-right%</p>
</div> </div>
</virtual> </virtual>
<virtual if={ notification.type == 'repost' }> <virtual if={ notification.type == 'repost' }>
<img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/> <img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
<div class="text"> <div class="text">
<p>%fa:retweet%{ notification.post.user.name }</p> <p>%fa:retweet%{ notification.post.user.name }</p>
<p class="post-ref">{ getPostSummary(notification.post.repost) }</p> <p class="post-ref">%fa:quote-left%{ getPostSummary(notification.post.repost) }%fa:quote-right%</p>
</div> </div>
</virtual> </virtual>
<virtual if={ notification.type == 'quote' }> <virtual if={ notification.type == 'quote' }>
@ -44,7 +44,7 @@
<img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/> <img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
<div class="text"> <div class="text">
<p>%fa:chart-pie%{ notification.user.name }</p> <p>%fa:chart-pie%{ notification.user.name }</p>
<p class="post-ref">{ getPostSummary(notification.post) }</p> <p class="post-ref">%fa:quote-left%{ getPostSummary(notification.post) }%fa:quote-right%</p>
</div> </div>
</virtual> </virtual>
<style> <style>
@ -82,20 +82,13 @@
.post-ref .post-ref
&:before, &:after [data-fa]
font-family FontAwesome
font-size 1em font-size 1em
font-weight normal font-weight normal
font-style normal font-style normal
display inline-block display inline-block
margin-right 3px margin-right 3px
&:before
content "\f10d"
&:after
content "\f10e"
&.repost, &.quote &.repost, &.quote
.text p i .text p i
color #77B255 color #77B255

21
src/web/app/mobile/tags/notification.tag
View File

@ -9,7 +9,9 @@
<mk-reaction-icon reaction={ notification.reaction }/> <mk-reaction-icon reaction={ notification.reaction }/>
<a href={ '/' + notification.user.username }>{ notification.user.name }</a> <a href={ '/' + notification.user.username }>{ notification.user.name }</a>
</p> </p>
<a class="post-ref" href={ '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a> <a class="post-ref" href={ '/' + notification.post.user.username + '/' + notification.post.id }>
%fa:quote-left%{ getPostSummary(notification.post) }%fa:quote-right%
</a>
</div> </div>
</virtual> </virtual>
<virtual if={ notification.type == 'repost' }> <virtual if={ notification.type == 'repost' }>
@ -21,7 +23,9 @@
%fa:retweet% %fa:retweet%
<a href={ '/' + notification.post.user.username }>{ notification.post.user.name }</a> <a href={ '/' + notification.post.user.username }>{ notification.post.user.name }</a>
</p> </p>
<a class="post-ref" href={ '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post.repost) }</a> <a class="post-ref" href={ '/' + notification.post.user.username + '/' + notification.post.id }>
%fa:quote-left%{ getPostSummary(notification.post.repost) }%fa:quote-right%
</a>
</div> </div>
</virtual> </virtual>
<virtual if={ notification.type == 'quote' }> <virtual if={ notification.type == 'quote' }>
@ -80,7 +84,9 @@
%fa:chart-pie% %fa:chart-pie%
<a href={ '/' + notification.user.username }>{ notification.user.name }</a> <a href={ '/' + notification.user.username }>{ notification.user.name }</a>
</p> </p>
<a class="post-ref" href={ '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a> <a class="post-ref" href={ '/' + notification.post.user.username + '/' + notification.post.id }>
%fa:quote-left%{ getPostSummary(notification.post) }%fa:quote-right%
</a>
</div> </div>
</virtual> </virtual>
<style> <style>
@ -132,20 +138,13 @@
.post-ref .post-ref
color rgba(0, 0, 0, 0.7) color rgba(0, 0, 0, 0.7)
&:before, &:after [data-fa]
font-family FontAwesome
font-size 1em font-size 1em
font-weight normal font-weight normal
font-style normal font-style normal
display inline-block display inline-block
margin-right 3px margin-right 3px
&:before
content "\f10d"
&:after
content "\f10e"
&.repost, &.quote &.repost, &.quote
.text p i .text p i
color #77B255 color #77B255

12
src/web/app/mobile/tags/post-detail.tag
View File

@ -126,7 +126,7 @@
margin 0 8px 0 0 margin 0 8px 0 0
border-radius 6px border-radius 6px
i [data-fa]
margin-right 4px margin-right 4px
.name .name
@ -208,16 +208,6 @@
@media (min-width 500px) @media (min-width 500px)
font-size 24px font-size 24px
.link
&:after
content "\f14c"
display inline-block
padding-left 2px
font-family FontAwesome
font-size .9em
font-weight 400
font-style normal
> mk-url-preview > mk-url-preview
margin-top 8px margin-top 8px

14
src/web/app/mobile/tags/timeline.tag
View File

@ -59,7 +59,7 @@
span span
margin 0 16px margin 0 16px
i [data-fa]
margin-right 8px margin-right 8px
> footer > footer
@ -242,7 +242,7 @@
margin 0 8px 0 0 margin 0 8px 0 0
border-radius 6px border-radius 6px
i [data-fa]
margin-right 4px margin-right 4px
.name .name
@ -361,16 +361,6 @@
> .dummy > .dummy
display none display none
.link
&:after
content "\f14c"
display inline-block
padding-left 2px
font-family FontAwesome
font-size .9em
font-weight 400
font-style normal
mk-url-preview mk-url-preview
margin-top 8px margin-top 8px