mirror of
https://github.com/pixelfed/pixelfed.git
synced 2024-12-24 00:35:59 +00:00
Update ComposeModal
This commit is contained in:
parent
aa6afb8ca1
commit
756e91e63a
1 changed files with 12 additions and 47 deletions
|
@ -73,32 +73,21 @@
|
||||||
<input type="text" class="form-control" v-model="media[carouselCursor].license" placeholder="Optional media license">
|
<input type="text" class="form-control" v-model="media[carouselCursor].license" placeholder="Optional media license">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-6 pt-2">
|
<!-- <div class="col-6 pt-2">
|
||||||
<!-- <button class="btn btn-outline-secondary btn-sm mr-1"><i class="fas fa-map-marker-alt"></i></button>
|
<button class="btn btn-outline-secondary btn-sm mr-1"><i class="fas fa-map-marker-alt"></i></button>
|
||||||
<button class="btn btn-outline-secondary btn-sm"><i class="fas fa-tools"></i></button> -->
|
<button class="btn btn-outline-secondary btn-sm"><i class="fas fa-tools"></i></button>
|
||||||
</div>
|
</div> -->
|
||||||
<div class="col-6 text-right pt-2">
|
<div class="col-12 text-right pt-2">
|
||||||
<button class="btn btn-outline-danger btn-sm font-weight-bold mr-1" v-on:click="deleteMedia()"><i class="fas fa-trash"></i></button>
|
<button class="btn btn-outline-danger btn-sm font-weight-bold mr-1" v-on:click="deleteMedia()">Delete Photo</button>
|
||||||
<button class="btn btn-outline-secondary btn-sm font-weight-bold" v-on:click="updateMedia()">Close</button>
|
<button class="btn btn-outline-secondary btn-sm font-weight-bold" v-on:click="updateMedia()">Hide Media Toolbar</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div :class="[mediaDrawer?'glass card-body disabled':'card-body']">
|
<div :class="[mediaDrawer?'d-none':'card-body']">
|
||||||
<div class="reactions my-1">
|
|
||||||
<h3 class="far fa-heart pr-3 m-0 text-lighter" title="Like"></h3>
|
|
||||||
<h3 class="far fa-comment pr-3 m-0 text-lighter" title="Comment"></h3>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="likes font-weight-bold">
|
|
||||||
<span class="like-count">0</span> likes
|
|
||||||
</div>
|
|
||||||
<div class="caption">
|
<div class="caption">
|
||||||
<p class="mb-2 read-more" style="overflow: hidden;">
|
<p class="mb-2">
|
||||||
<span class="username font-weight-bold d-inline-block clearfix">
|
<textarea class="form-control d-inline-block" rows="3" placeholder="Add an optional caption" v-model="composeText"></textarea>
|
||||||
<bdi><a class="text-dark" :href="profile.url">{{profile.username}}</a></bdi>
|
|
||||||
</span>
|
|
||||||
<span contenteditable="" style="outline:none;" v-on:keyup="textWatcher"></span>
|
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="comments">
|
<div class="comments">
|
||||||
|
@ -112,7 +101,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div :class="[mediaDrawer?'glass card-footer':'card-footer']">
|
<div :class="[mediaDrawer?'d-none':'card-footer']">
|
||||||
<div class="d-flex justify-content-between align-items-center">
|
<div class="d-flex justify-content-between align-items-center">
|
||||||
<div>
|
<div>
|
||||||
<div class="custom-control custom-switch d-inline mr-3">
|
<div class="custom-control custom-switch d-inline mr-3">
|
||||||
|
@ -183,7 +172,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="small text-muted font-weight-bold">
|
<div class="small text-muted font-weight-bold">
|
||||||
{{composeTextLength}} / 500
|
{{composeText.length}} / 500
|
||||||
</div>
|
</div>
|
||||||
<div class="pl-md-5">
|
<div class="pl-md-5">
|
||||||
<div class="btn-group">
|
<div class="btn-group">
|
||||||
|
@ -209,15 +198,6 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style type="text/css" scoped>
|
<style type="text/css" scoped>
|
||||||
.glass {
|
|
||||||
-webkit-filter: blur(2px);
|
|
||||||
-moz-filter: blur(2px);
|
|
||||||
-o-filter: blur(2px);
|
|
||||||
-ms-filter: blur(2px);
|
|
||||||
filter: blur(2px);
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
.media-drawer-filters {
|
.media-drawer-filters {
|
||||||
overflow-x: scroll;
|
overflow-x: scroll;
|
||||||
flex-wrap:unset;
|
flex-wrap:unset;
|
||||||
|
@ -310,16 +290,6 @@ export default {
|
||||||
];
|
];
|
||||||
},
|
},
|
||||||
|
|
||||||
watch: {
|
|
||||||
composeText: function (newComposeText, oldComposeText) {
|
|
||||||
this.debouncedTextWatcher();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
created: function() {
|
|
||||||
this.debouncedTextWatcher = _.debounce(this.textWatcher, 300)
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
|
|
||||||
fetchConfig() {
|
fetchConfig() {
|
||||||
|
@ -345,11 +315,6 @@ export default {
|
||||||
el.removeAttr('disabled');
|
el.removeAttr('disabled');
|
||||||
},
|
},
|
||||||
|
|
||||||
textWatcher() {
|
|
||||||
this.composeText = event.target.innerText;
|
|
||||||
this.composeTextLength = event.target.innerText.length;
|
|
||||||
},
|
|
||||||
|
|
||||||
mediaWatcher() {
|
mediaWatcher() {
|
||||||
let self = this;
|
let self = this;
|
||||||
$(document).on('change', '.file-input', function(e) {
|
$(document).on('change', '.file-input', function(e) {
|
||||||
|
|
Loading…
Reference in a new issue