Fix centering of timeline and search

Signed-off-by: Julius Härtl <jus@bitgrid.net>

src/components/Composer.vue

@@ -35,14 +35,16 @@
 				<div v-contenteditable:post.dangerousHTML="canType" ref="composerInput" class="message"
 					placeholder="Share a thought…" @keyup.enter="keyup" />
 			</vue-tribute>
-			<emoji-picker :search="search" class="emoji-picker-wrapper" @emoji="insert">
+			<emoji-picker ref="emojiPicker" :search="search" class="emoji-picker-wrapper"
+				@emoji="insert">
 				<a v-tooltip="'Insert emoji'" slot="emoji-invoker" slot-scope="{ events }"
 					class="emoji-invoker" tabindex="0" v-on="events"
 					@keyup.enter="events.click" @keyup.space="events.click" />
 				<div slot="emoji-picker" slot-scope="{ emojis, insert, display }" class="emoji-picker popovermenu">
 					<div>
 						<div>
-							<input v-focus-on-create v-model="search" type="text">
+							<input v-focus-on-create v-model="search" type="text"
+								@keyup.enter="insert(emojis)">
 						</div>
 						<div>
 							<div v-for="(emojiGroup, category) in emojis" :key="category">
@@ -445,9 +447,15 @@ export default {
 	},
 	methods: {
 		insert(emoji) {
+			if (typeof emoji === 'object') {
+				let category = Object.keys(emoji)[0]
+				let emojis = emoji[category]
+				let firstEmoji = Object.keys(emojis)[0]
+				emoji = emojis[firstEmoji]
+			}
 			this.post += this.$twemoji.parse(emoji) + ' '
-			this.$refs.composerInput.innerHTML = this.post
+			this.$refs.composerInput.innerHTML += this.$twemoji.parse(emoji) + ' '
-			this.hidePopoverMenu()
+			this.$refs.emojiPicker.hide()
 		},
 		togglePopoverMenu() {
 			this.menuOpened = !this.menuOpened

src/components/Search.vue

@@ -21,7 +21,7 @@
   -->
 
 <template>
-	<div class="social__container">
+	<div class="social__wrapper">
 		<div v-if="results.length < 1" id="emptycontent" :class="{'icon-loading': loading}">
 			<div v-if="!loading" class="icon-search" />
 			<h2 v-if="!loading">{{ t('social', 'No accounts found') }}</h2>

src/components/TimelineEntry.vue

@@ -92,8 +92,10 @@ export default {
 		flex-shrink: 0;
 	}
 
-	.timestamp {
+	.post-timestamp {
-		float: right;
+		width: 120px;
+		text-align: right;
+		flex-shrink: 0;
 	}
 
 	span {

src/views/Timeline.vue

@@ -1,5 +1,5 @@
 <template>
-	<div class="social__container">
+	<div class="social__wrapper">
 		<transition name="slide-fade">
 			<div v-if="showInfo" class="social__welcome">
 				<a class="close icon-close" href="#" @click="hideInfo()"><span class="hidden-visually">Close</span></a>