#1 some ui work, update to the model

src/app/event-display/event-display.component.css

@@ -0,0 +1,5 @@
+.img-responsive {
+    display: block;
+    max-width: 100%;
+    height: auto;
+}

src/app/event-display/event-display.component.html

@@ -1,10 +1,21 @@
 <div *ngIf="event">
     <app-event-header [event]="event"></app-event-header>
+
+    <hr>
+
+    <div class="row">
+        <div class="col-md-7">
+          <h2>Event informations</h2>
+          <div>Organized by ... &lt;<a href="">blabla@blabla</a>&gt;</div>
+        </div>
+        <div class="col-md-5"><img [src]="event.locationDescriptor.mapUrl" class="img-responsive"></div>
+    </div>
+
+    <hr>
 </div>
+
 <div *ngIf="tmpEvent">
-  <div>
-    <img [src]="tmpEvent.locationDescriptor.mapUrl">
-  </div>
+
   <form [formGroup]="reservationForm" (submit)="submitForm(tmpEvent.event.shortName, reservationForm.value)">
     <div>
         <ul>

src/app/event-header/event-header.component.html

@@ -1,3 +1,14 @@
-<div>
-  <img [alt]="event.displayName" [src]="event.fileBlobIdIsPresent ? ('/file/'+event.fileBlobId) : event.imageUrl">
+<div class="row">
+  <div *ngIf="event.contentLanguages.length > 1" class="col-12 text-right">
+    <ul class="language-selector">
+      <li *ngFor="let lang of event.contentLanguages">{{lang.language}}</li>
+    </ul>
+  </div>
+
+  <div class="col-12 col-sm-7 col-md-4">
+    <img class="img-responsive" [alt]="event.displayName" [src]="event.fileBlobIdIsPresent ? ('/file/'+event.fileBlobId) : event.imageUrl">
+  </div>
+  <div class="col-12 col-sm-5 col-md-8 text-center">
+    <h1>{{event.displayName}}</h1>
+  </div>
 </div>

src/app/event-header/event-header.component.scss

@@ -0,0 +1,29 @@
+.img-responsive {
+    max-height: 100px;
+    margin: auto;
+    display: block;
+    max-width: 100%;
+    height: auto;
+}
+
+h1 {
+    margin-top:20px;
+}
+
+
+.language-selector {
+    margin-top: 20px;
+    margin-bottom: 20px;
+    padding: 8px 15px;
+    list-style: none;
+}
+
+.language-selector > li {
+    display: inline-block;
+}
+
+.language-selector > li+li:before {
+    padding: 0 5px;
+    color: #ccc;
+    content: "/\00a0";
+}

src/app/model/event.ts

@@ -3,4 +3,20 @@ export class Event {
     fileBlobIdIsPresent: boolean;
     fileBlobId: string;
     imageUrl: string;
+    contentLanguages: ContentLanguage[];
+}
+
+export class ContentLanguage {
+    locale: string;
+    value: number;
+    flag: string;
+    language: string;
+    displayLanguage: string;
+}
+
+export class LocationDescriptor {
+    timeZone: string;
+    latitude: string;
+    longitude: string;
+    mapUrl: string;
 }