Bookmark-Icon auf Card gepackt + Keine Nav-Zeile beim Formular

public/createMessage.js

@@ -22,7 +22,7 @@ const CreateMsgRouter = {
 				</label>
 			</div>
 		</div>
-		<button class="btn btn-default"><a href="index.html#/home">ABBRECHEN </a></button>
+		<button class="btn btn-default"><a @click="$router.go(-1)">ABBRECHEN </a></button>
 		<button type="submit" class="btn btn-raised om-btn">SENDEN</button>
 	</form>
 </div>

public/index.html

@@ -73,7 +73,7 @@
             <router-view></router-view>
         </div>
 
-        <nav class="nav nav-tabs nav-justified om-nav ">
+        <nav class="nav nav-tabs nav-justified om-nav" v-if="$route.path !=='/createMessage' ">
             <router-link to="/home" class="nav-item nav-link"><i class="material-icons">home</i></router-link>
             <router-link to="/files" class="nav-item nav-link"><i class="material-icons">folder</i></router-link>
             <router-link to="/createMessage" class="nav-item nav-link outlined"><i class="material-icons">add_circle</i></router-link>

public/msgCard.js

@@ -6,9 +6,10 @@ Vue.component('MsgCard', {
                 </h6>
                 {{ msg.message }}<br><br>
                 <a href="#">{{ msg.tag }}</a></p>
-                <div class="om-user-line">
+                <div class="om-card-footer"> <div class="om-user-line">
                 <i class="material-icons">account_circle</i>
-                Erstellt von {{ msg.user }}
+                Erstellt von {{ msg.user }}</div>
+				<i class="material-icons">bookmark_border</i>
                 </div></div>`,
     props: ['msg']
 });

public/style/style.css

@@ -35,6 +35,10 @@
   margin-bottom: 20px;
   padding: 20px;
 }
+.om-card-footer {
+  justify-content: space-between;
+  display: flex;
+}
 .om-btn {
   background-color: #0046a0;
   color: white;
@@ -48,6 +52,7 @@
 }
 .om-user-line {
   display: flex;
+  width: 80%;
 }
 .om-user-line i {
   margin-right: 2%;

public/style/style.less

@@ -40,6 +40,11 @@
     margin-bottom: 20px;
     padding: 20px;
 }
+
+.om-card-footer{
+	justify-content: space-between;
+	display: flex;
+}
 .om-btn{
     background-color: @color;
 	color: white;
@@ -53,9 +58,9 @@
 	}
 }
 
-
 .om-user-line{
     display: flex;
+	width: 80%;
     i{
         margin-right: 2%;
     }