Added AudioBubble scafolding, stoped till grid system is implemented

CHANGELOG.md

@@ -4,7 +4,7 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
-## [Unreleased]
+## [Future]
 - Add a screen to chose the community to see.
 - "private" messages add a profile image.
 - Add a chat bubble to see users join and leave threads.
@@ -13,7 +13,12 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 - Add thread name to the header of threads.
 - Add a leave thread, maybe in header?
 - Overhaul textbox in threads.
-- Display correctly special syntax flavor [B]old [I]talic [C]enter [U]nderline [S]trikeout
+- Display correctly special syntax flavor [B]old [I]talic [C]enter [U]nderline [S]trikeout.
+- Migrate chat bubbles from float based to grid.
+- Move chat bubble elements to his own components.
+
+## [Unreleased]
+
 
 ## [1.0.6] - 2018-06-21
 ### Added

src/renderer/components/ChatBubble.tsx

@@ -2,6 +2,7 @@ import { IAminoMessage } from "aminoclient/dist/AminoTypes";
 import { Component } from "inferno";
 import { style } from "typestyle";
 import moment from "moment";
+// import AudioBubble from "./bubbles/AudioBubble";
 
 const classMain = style({
     width: "100%",
@@ -162,6 +163,8 @@ export default class ChatBubble extends Component<any, any> {
                 case 110:
                     // ToDo - Add style from https://codepen.io/gregh/pen/NdVvbm
                     ctx.push(<audio controls><source src={this.props.aminoMessage.mediaValue} type="audio/aac" /></audio>);
+                    // Stoped AudioBubble development till grid system is implemented
+                    // ctx.push(<AudioBubble src={this.props.aminoMessage.mediaValue} />);
                     break;
             }
         }

src/renderer/components/bubbles/AudioBubble.tsx

@@ -0,0 +1,24 @@
+import { Component } from "inferno";
+import { style } from "typestyle";
+
+const classMain = style({
+    height: 50
+});
+
+interface IAudioBubble {
+    src: string;
+}
+
+export default class ChatBubble extends Component<any, any> {
+    constructor(props: IAudioBubble, context) {
+        super(props, context);
+    }
+
+    public render() {
+        return (
+            <div class={classMain}>
+
+            </div >
+        );
+    }
+}