forked from AkkomaGang/akkoma-fe
Merge branch 'master' of ssh.gitgud.io:lambadalambda/pleroma-fe into feature/retweet
This commit is contained in:
commit
d4284686fa
21 changed files with 112 additions and 40 deletions
|
@ -4,6 +4,7 @@
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<title>Pleroma</title>
|
<title>Pleroma</title>
|
||||||
<link rel="stylesheet" href="/static/font/css/fontello.css">
|
<link rel="stylesheet" href="/static/font/css/fontello.css">
|
||||||
|
<link rel="stylesheet" href="/static/font/css/animation.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
|
|
|
@ -1,7 +1,4 @@
|
||||||
$main-color: #f58d2c;
|
@import './_variables.scss';
|
||||||
$main-background: white;
|
|
||||||
$darkened-background: whitesmoke;
|
|
||||||
|
|
||||||
#app {
|
#app {
|
||||||
background-color: $main-color;
|
background-color: $main-color;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
|
@ -225,9 +222,10 @@ status.ng-enter.ng-enter-active {
|
||||||
}
|
}
|
||||||
|
|
||||||
.fa {
|
.fa {
|
||||||
color: $main-color;
|
color: grey;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.status-actions {
|
.status-actions {
|
||||||
width: 50%;
|
width: 50%;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
6
src/_variables.scss
Normal file
6
src/_variables.scss
Normal file
|
@ -0,0 +1,6 @@
|
||||||
|
$main-color: #f58d2c;
|
||||||
|
$main-background: white;
|
||||||
|
$darkened-background: whitesmoke;
|
||||||
|
$green: #0fa00f;
|
||||||
|
$blue: #0095ff;
|
||||||
|
|
|
@ -7,8 +7,15 @@
|
||||||
|
|
||||||
<script src="./favorite_button.js" ></script>
|
<script src="./favorite_button.js" ></script>
|
||||||
|
|
||||||
<style>
|
<style lang='scss'>
|
||||||
|
@import '../../_variables.scss';
|
||||||
.favorite-button {
|
.favorite-button {
|
||||||
cursor: pointer
|
cursor: pointer;
|
||||||
|
&:hover {
|
||||||
|
color: $main-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.icon-star {
|
||||||
|
color: $main-color;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -11,11 +11,24 @@ const mediaUpload = {
|
||||||
const file = target.files[0]
|
const file = target.files[0]
|
||||||
const formData = new FormData()
|
const formData = new FormData()
|
||||||
formData.append('media', file)
|
formData.append('media', file)
|
||||||
|
|
||||||
|
self.$emit('uploading')
|
||||||
|
self.uploading = true
|
||||||
|
|
||||||
statusPosterService.uploadMedia({ store, formData })
|
statusPosterService.uploadMedia({ store, formData })
|
||||||
.then((fileData) => {
|
.then((fileData) => {
|
||||||
self.$emit('uploaded', fileData)
|
self.$emit('uploaded', fileData)
|
||||||
|
self.uploading = false
|
||||||
|
}, (error) => {
|
||||||
|
self.$emit('upload-failed')
|
||||||
|
self.uploading = false
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
},
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
uploading: false
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,7 +1,8 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="media-upload">
|
<div class="media-upload">
|
||||||
<label class="btn btn-default">
|
<label class="btn btn-default">
|
||||||
<i class="fa icon-upload"></i>
|
<i class="fa icon-spin4 animate-spin" v-if="uploading"></i>
|
||||||
|
<i class="fa icon-upload" v-if="!uploading"></i>
|
||||||
<input type=file style="position: fixed; top: -100em"></input>
|
<input type=file style="position: fixed; top: -100em"></input>
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -7,12 +7,16 @@
|
||||||
|
|
||||||
<script src="./retweet_button.js" ></script>
|
<script src="./retweet_button.js" ></script>
|
||||||
|
|
||||||
<style>
|
<style lang='scss'>
|
||||||
|
@import '../../_variables.scss';
|
||||||
.icon-retweet {
|
.icon-retweet {
|
||||||
cursor: pointer
|
cursor: pointer;
|
||||||
|
&:hover {
|
||||||
|
color: $green;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.retweeted {
|
.retweeted {
|
||||||
cursor: auto;
|
cursor: auto;
|
||||||
color: green;
|
color: $green;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -51,6 +51,7 @@
|
||||||
<script src="./status.js" ></script>
|
<script src="./status.js" ></script>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
|
@import '../../_variables.scss';
|
||||||
.status-el {
|
.status-el {
|
||||||
hyphens: auto;
|
hyphens: auto;
|
||||||
overflow-wrap: break-word;
|
overflow-wrap: break-word;
|
||||||
|
@ -71,4 +72,8 @@
|
||||||
.status-actions {
|
.status-actions {
|
||||||
padding-top: 5px;
|
padding-top: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.icon-reply:hover {
|
||||||
|
color: $blue;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -10,3 +10,12 @@ Font license info
|
||||||
Homepage: http://fortawesome.github.com/Font-Awesome/
|
Homepage: http://fortawesome.github.com/Font-Awesome/
|
||||||
|
|
||||||
|
|
||||||
|
## Fontelico
|
||||||
|
|
||||||
|
Copyright (C) 2012 by Fontello project
|
||||||
|
|
||||||
|
Author: Crowdsourced, for Fontello project
|
||||||
|
License: SIL (http://scripts.sil.org/OFL)
|
||||||
|
Homepage: http://fontello.com
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -35,6 +35,18 @@
|
||||||
"css": "upload",
|
"css": "upload",
|
||||||
"code": 59395,
|
"code": 59395,
|
||||||
"src": "fontawesome"
|
"src": "fontawesome"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"uid": "9bd60140934a1eb9236fd7a8ab1ff6ba",
|
||||||
|
"css": "spin4",
|
||||||
|
"code": 59444,
|
||||||
|
"src": "fontelico"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"uid": "2a6740fc2f9d0edea54205963f662594",
|
||||||
|
"css": "spin3",
|
||||||
|
"code": 59442,
|
||||||
|
"src": "fontelico"
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
2
static/font/css/fontello-codes.css
vendored
2
static/font/css/fontello-codes.css
vendored
|
@ -3,4 +3,6 @@
|
||||||
.icon-star:before { content: '\e801'; } /* '' */
|
.icon-star:before { content: '\e801'; } /* '' */
|
||||||
.icon-star-empty:before { content: '\e802'; } /* '' */
|
.icon-star-empty:before { content: '\e802'; } /* '' */
|
||||||
.icon-upload:before { content: '\e803'; } /* '' */
|
.icon-upload:before { content: '\e803'; } /* '' */
|
||||||
|
.icon-spin3:before { content: '\e832'; } /* '' */
|
||||||
|
.icon-spin4:before { content: '\e834'; } /* '' */
|
||||||
.icon-reply:before { content: '\f112'; } /* '' */
|
.icon-reply:before { content: '\f112'; } /* '' */
|
14
static/font/css/fontello-embedded.css
vendored
14
static/font/css/fontello-embedded.css
vendored
File diff suppressed because one or more lines are too long
2
static/font/css/fontello-ie7-codes.css
vendored
2
static/font/css/fontello-ie7-codes.css
vendored
|
@ -3,4 +3,6 @@
|
||||||
.icon-star { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
.icon-star { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||||
.icon-star-empty { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
.icon-star-empty { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||||
.icon-upload { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
.icon-upload { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||||
|
.icon-spin3 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||||
|
.icon-spin4 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||||
.icon-reply { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
.icon-reply { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
2
static/font/css/fontello-ie7.css
vendored
2
static/font/css/fontello-ie7.css
vendored
|
@ -14,4 +14,6 @@
|
||||||
.icon-star { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
.icon-star { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||||
.icon-star-empty { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
.icon-star-empty { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||||
.icon-upload { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
.icon-upload { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||||
|
.icon-spin3 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||||
|
.icon-spin4 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||||
.icon-reply { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
.icon-reply { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
16
static/font/css/fontello.css
vendored
16
static/font/css/fontello.css
vendored
|
@ -1,11 +1,11 @@
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'fontello';
|
font-family: 'fontello';
|
||||||
src: url('../font/fontello.eot?70483588');
|
src: url('../font/fontello.eot?84025004');
|
||||||
src: url('../font/fontello.eot?70483588#iefix') format('embedded-opentype'),
|
src: url('../font/fontello.eot?84025004#iefix') format('embedded-opentype'),
|
||||||
url('../font/fontello.woff2?70483588') format('woff2'),
|
url('../font/fontello.woff2?84025004') format('woff2'),
|
||||||
url('../font/fontello.woff?70483588') format('woff'),
|
url('../font/fontello.woff?84025004') format('woff'),
|
||||||
url('../font/fontello.ttf?70483588') format('truetype'),
|
url('../font/fontello.ttf?84025004') format('truetype'),
|
||||||
url('../font/fontello.svg?70483588#fontello') format('svg');
|
url('../font/fontello.svg?84025004#fontello') format('svg');
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
}
|
}
|
||||||
|
@ -15,7 +15,7 @@
|
||||||
@media screen and (-webkit-min-device-pixel-ratio:0) {
|
@media screen and (-webkit-min-device-pixel-ratio:0) {
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'fontello';
|
font-family: 'fontello';
|
||||||
src: url('../font/fontello.svg?70483588#fontello') format('svg');
|
src: url('../font/fontello.svg?84025004#fontello') format('svg');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
*/
|
*/
|
||||||
|
@ -59,4 +59,6 @@
|
||||||
.icon-star:before { content: '\e801'; } /* '' */
|
.icon-star:before { content: '\e801'; } /* '' */
|
||||||
.icon-star-empty:before { content: '\e802'; } /* '' */
|
.icon-star-empty:before { content: '\e802'; } /* '' */
|
||||||
.icon-upload:before { content: '\e803'; } /* '' */
|
.icon-upload:before { content: '\e803'; } /* '' */
|
||||||
|
.icon-spin3:before { content: '\e832'; } /* '' */
|
||||||
|
.icon-spin4:before { content: '\e834'; } /* '' */
|
||||||
.icon-reply:before { content: '\f112'; } /* '' */
|
.icon-reply:before { content: '\f112'; } /* '' */
|
|
@ -229,11 +229,11 @@ body {
|
||||||
}
|
}
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'fontello';
|
font-family: 'fontello';
|
||||||
src: url('./font/fontello.eot?93026246');
|
src: url('./font/fontello.eot?69028437');
|
||||||
src: url('./font/fontello.eot?93026246#iefix') format('embedded-opentype'),
|
src: url('./font/fontello.eot?69028437#iefix') format('embedded-opentype'),
|
||||||
url('./font/fontello.woff?93026246') format('woff'),
|
url('./font/fontello.woff?69028437') format('woff'),
|
||||||
url('./font/fontello.ttf?93026246') format('truetype'),
|
url('./font/fontello.ttf?69028437') format('truetype'),
|
||||||
url('./font/fontello.svg?93026246#fontello') format('svg');
|
url('./font/fontello.svg?69028437#fontello') format('svg');
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
}
|
}
|
||||||
|
@ -307,6 +307,8 @@ body {
|
||||||
<div title="Code: 0xe803" class="the-icons span3"><i class="demo-icon icon-upload"></i> <span class="i-name">icon-upload</span><span class="i-code">0xe803</span></div>
|
<div title="Code: 0xe803" class="the-icons span3"><i class="demo-icon icon-upload"></i> <span class="i-name">icon-upload</span><span class="i-code">0xe803</span></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
<div title="Code: 0xe832" class="the-icons span3"><i class="demo-icon icon-spin3 animate-spin"></i> <span class="i-name">icon-spin3</span><span class="i-code">0xe832</span></div>
|
||||||
|
<div title="Code: 0xe834" class="the-icons span3"><i class="demo-icon icon-spin4 animate-spin"></i> <span class="i-name">icon-spin4</span><span class="i-code">0xe834</span></div>
|
||||||
<div title="Code: 0xf112" class="the-icons span3"><i class="demo-icon icon-reply"></i> <span class="i-name">icon-reply</span><span class="i-code">0xf112</span></div>
|
<div title="Code: 0xf112" class="the-icons span3"><i class="demo-icon icon-reply"></i> <span class="i-name">icon-reply</span><span class="i-code">0xf112</span></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Binary file not shown.
|
@ -6,7 +6,7 @@
|
||||||
<font id="fontello" horiz-adv-x="1000" >
|
<font id="fontello" horiz-adv-x="1000" >
|
||||||
<font-face font-family="fontello" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
|
<font-face font-family="fontello" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
|
||||||
<missing-glyph horiz-adv-x="1000" />
|
<missing-glyph horiz-adv-x="1000" />
|
||||||
<glyph glyph-name="retweet" unicode="" d="M714 11q0-7-5-13t-13-5h-535q-5 0-8 1t-5 4-3 4-2 7 0 6v335h-107q-15 0-25 11t-11 25q0 13 8 23l179 214q11 12 27 12t28-12l178-214q9-10 9-23 0-15-11-25t-25-11h-107v-214h321q9 0 14-6l89-108q4-6 4-11z m357 232q0-13-8-23l-178-214q-12-13-28-13t-27 13l-179 214q-8 10-8 23 0 14 11 25t25 11h107v214h-322q-9 0-14 7l-89 107q-4 5-4 11 0 7 5 12t13 6h536q4 0 7-1t5-4 3-5 2-6 1-7v-334h107q14 0 25-11t10-25z" horiz-adv-x="1071.4" />
|
<glyph glyph-name="retweet" unicode="" d="M714 11q0-7-5-13t-13-5h-535q-5 0-8 1t-5 4-3 4-2 7 0 6v335h-107q-15 0-25 11t-11 25q0 13 8 23l179 214q11 12 27 12t28-12l178-214q9-10 9-23 0-15-11-25t-25-11h-107v-214h321q9 0 14-6l89-108q4-5 4-11z m357 232q0-13-8-23l-178-214q-12-13-28-13t-27 13l-179 214q-8 10-8 23 0 14 11 25t25 11h107v214h-322q-9 0-14 7l-89 107q-4 5-4 11 0 7 5 12t13 6h536q4 0 7-1t5-4 3-5 2-6 1-7v-334h107q14 0 25-11t10-25z" horiz-adv-x="1071.4" />
|
||||||
|
|
||||||
<glyph glyph-name="star" unicode="" d="M929 489q0-12-15-27l-202-197 48-279q0-4 0-12 0-11-6-19t-17-9q-10 0-22 7l-251 132-250-132q-12-7-23-7-11 0-17 9t-6 19q0 4 1 12l48 279-203 197q-14 15-14 27 0 21 31 26l280 40 126 254q11 23 27 23t28-23l125-254 280-40q32-5 32-26z" horiz-adv-x="928.6" />
|
<glyph glyph-name="star" unicode="" d="M929 489q0-12-15-27l-202-197 48-279q0-4 0-12 0-11-6-19t-17-9q-10 0-22 7l-251 132-250-132q-12-7-23-7-11 0-17 9t-6 19q0 4 1 12l48 279-203 197q-14 15-14 27 0 21 31 26l280 40 126 254q11 23 27 23t28-23l125-254 280-40q32-5 32-26z" horiz-adv-x="928.6" />
|
||||||
|
|
||||||
|
@ -14,6 +14,10 @@
|
||||||
|
|
||||||
<glyph glyph-name="upload" unicode="" d="M714 29q0 14-10 25t-25 10-25-10-11-25 11-25 25-11 25 11 10 25z m143 0q0 14-10 25t-26 10-25-10-10-25 10-25 25-11 26 11 10 25z m72 125v-179q0-22-16-38t-38-16h-821q-23 0-38 16t-16 38v179q0 22 16 38t38 15h238q12-31 39-51t62-20h143q34 0 61 20t40 51h238q22 0 38-15t16-38z m-182 361q-9-22-33-22h-143v-250q0-15-10-25t-25-11h-143q-15 0-25 11t-11 25v250h-143q-23 0-33 22-9 22 8 39l250 250q10 10 25 10t25-10l250-250q18-17 8-39z" horiz-adv-x="928.6" />
|
<glyph glyph-name="upload" unicode="" d="M714 29q0 14-10 25t-25 10-25-10-11-25 11-25 25-11 25 11 10 25z m143 0q0 14-10 25t-26 10-25-10-10-25 10-25 25-11 26 11 10 25z m72 125v-179q0-22-16-38t-38-16h-821q-23 0-38 16t-16 38v179q0 22 16 38t38 15h238q12-31 39-51t62-20h143q34 0 61 20t40 51h238q22 0 38-15t16-38z m-182 361q-9-22-33-22h-143v-250q0-15-10-25t-25-11h-143q-15 0-25 11t-11 25v250h-143q-23 0-33 22-9 22 8 39l250 250q10 10 25 10t25-10l250-250q18-17 8-39z" horiz-adv-x="928.6" />
|
||||||
|
|
||||||
|
<glyph glyph-name="spin3" unicode="" d="M494 850c-266 0-483-210-494-472-1-19 13-20 13-20l84 0c16 0 19 10 19 18 10 199 176 358 378 358 107 0 205-45 273-118l-58-57c-11-12-11-27 5-31l247-50c21-5 46 11 37 44l-58 227c-2 9-16 22-29 13l-65-60c-89 91-214 148-352 148z m409-508c-16 0-19-10-19-18-10-199-176-358-377-358-108 0-205 45-274 118l59 57c10 12 10 27-5 31l-248 50c-21 5-46-11-37-44l58-227c2-9 16-22 30-13l64 60c89-91 214-148 353-148 265 0 482 210 493 473 1 18-13 19-13 19l-84 0z" horiz-adv-x="1000" />
|
||||||
|
|
||||||
|
<glyph glyph-name="spin4" unicode="" d="M498 850c-114 0-228-39-320-116l0 0c173 140 428 130 588-31 134-134 164-332 89-495-10-29-5-50 12-68 21-20 61-23 84 0 3 3 12 15 15 24 71 180 33 393-112 539-99 98-228 147-356 147z m-409-274c-14 0-29-5-39-16-3-3-13-15-15-24-71-180-34-393 112-539 185-185 479-195 676-31l0 0c-173-140-428-130-589 31-134 134-163 333-89 495 11 29 6 50-12 68-11 11-27 17-44 16z" horiz-adv-x="1001" />
|
||||||
|
|
||||||
<glyph glyph-name="reply" unicode="" d="M1000 225q0-93-71-252-1-4-6-13t-7-17-7-12q-7-10-16-10-8 0-13 6t-5 14q0 5 1 15t2 13q3 38 3 69 0 56-10 101t-27 77-45 56-59 39-74 24-86 12-98 3h-125v-143q0-14-10-25t-26-11-25 11l-285 286q-11 10-11 25t11 25l285 286q11 10 25 10t26-10 10-25v-143h125q398 0 488-225 30-75 30-186z" horiz-adv-x="1000" />
|
<glyph glyph-name="reply" unicode="" d="M1000 225q0-93-71-252-1-4-6-13t-7-17-7-12q-7-10-16-10-8 0-13 6t-5 14q0 5 1 15t2 13q3 38 3 69 0 56-10 101t-27 77-45 56-59 39-74 24-86 12-98 3h-125v-143q0-14-10-25t-26-11-25 11l-285 286q-11 10-11 25t11 25l285 286q11 10 25 10t26-10 10-25v-143h125q398 0 488-225 30-75 30-186z" horiz-adv-x="1000" />
|
||||||
</font>
|
</font>
|
||||||
</defs>
|
</defs>
|
||||||
|
|
Before Width: | Height: | Size: 2.4 KiB After Width: | Height: | Size: 3.3 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
Loading…
Reference in a new issue