From 2a5be0bd77b211929d873e93de674fb8783ae08e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Xenia=20Gr=C3=BCnzinger?= Date: Wed, 28 Nov 2018 14:33:31 +0100 Subject: [PATCH] few changes at the msg-component --- public/home.js | 62 ++++++++++----------------------------------- public/index.html | 10 +++----- public/message.html | 2 +- public/style.css | 11 +++----- public/style.less | 10 +++----- 5 files changed, 26 insertions(+), 69 deletions(-) diff --git a/public/home.js b/public/home.js index 0fd7a03..3675175 100644 --- a/public/home.js +++ b/public/home.js @@ -1,41 +1,41 @@ Vue.component('msg-item', { template: `
- {{ title }} + {{ subject }} -

- {{ subject }}

+ + {{ message }}

{{ tag }}

account_circle Erstellt von {{ user }}
`, - props: ['title', 'subject', 'tag', 'user'] + props: ['subject', 'message', 'tag', 'user'] }) new Vue({ - el: '#newmessages-example', + el: '#message-list', data: { messages: [ { id: 1, - title: 'Betreff_1', - subject: 'Nachricht_1', - tag: '#tag_1', + subject: 'Betreff_1', + message: 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam.', + tag: '#efi #bme #semester', user: 'user_1' }, { id: 2, - title: 'Betreff_2', - subject: 'Nachricht_2', - tag: '#tag_2', + subject: 'Betreff_2', + message: 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.', + tag: '#efi #fachschaft', user: 'user_2' }, { id: 3, - title: 'Betreff_3', - subject: 'Nachricht_3', - tag: '#tag_3', + subject: 'Betreff_3', + message: 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam.', + tag: '#efi #bei #wichtig', user: 'user_3' } ], @@ -68,38 +68,4 @@ Vue.component('home', {
` }) - -new Vue({ - el: '#sample', - data: { - private: { - messages : [ - { - message : [ - {subject : 'Betreff_1'}, - { msg : 'Nachricht_1' }, - { tags : '#tag_1' }, - { user : 'user_1' } - ] - }, - { - message : [ - {subject : 'Betreff_2'}, - { msg : 'Nachricht_2' }, - { tags : '#tag_2' }, - { user : 'user_2' } - ] - }, - { - message : [ - {subject : 'Betreff_3'}, - { msg : 'Nachricht_3' }, - { tags : '#tag_3' }, - { user : 'user_3' } - ] - } - ] - } - } -}) */ diff --git a/public/index.html b/public/index.html index 82fa3d2..41eb63b 100644 --- a/public/index.html +++ b/public/index.html @@ -26,7 +26,6 @@
-
@@ -36,16 +35,15 @@
-
-
+
+ >
diff --git a/public/message.html b/public/message.html index feaa23c..56c5fb9 100644 --- a/public/message.html +++ b/public/message.html @@ -36,7 +36,7 @@
- +
diff --git a/public/style.css b/public/style.css index 0e2c4f0..c8c78f5 100644 --- a/public/style.css +++ b/public/style.css @@ -39,16 +39,13 @@ background-color: #0046a0; color: white; } +.msg-head { + margin-top: 10px; + margin-bottom: 10px; +} .msg-head img { float: right; } -.om-user-head { - display: flex; - margin-bottom: 5%; -} -.om-user-head i { - margin-right: 2%; -} .om-user-line { display: flex; } diff --git a/public/style.less b/public/style.less index bd02109..48799e2 100644 --- a/public/style.less +++ b/public/style.less @@ -46,18 +46,14 @@ } .msg-head{ + margin-top: 10px; + margin-bottom: 10px; img{ float: right } } -.om-user-head{ - display: flex; - margin-bottom: 5%; - i{ - margin-right: 2%; - } -} + .om-user-line{ display: flex; i{