A lot of progress

frontend/app/components/windows/MainMenuWindow.vue

@@ -24,9 +24,9 @@ function CreateCampaignWindow(){
 
 function RefreshCampaigns(){
     Server().get('/campaign/list').then((response) => {
-        console.log(response.data);
-        response.data.forEach((camp) => {
-            campaings.value.push(camp.campaign);
+        if(response.data.status !== "ok") return;
+        response.data.campaigns.forEach((camp) => {
+            campaings.value.push(camp);
         });
     });
 }
@@ -34,7 +34,7 @@ function RefreshCampaigns(){
 onMounted(() => {
     Top(wrapper);
     SetupHandle(id, handle);
-    SetSize(id, {width: 580, height: 760});
+    SetSize(id, {width: 880, height: 760});
     ResetPosition(id, "center");
 
     RefreshCampaigns();
@@ -46,21 +46,38 @@ onMounted(() => {
     <div class="window-wrapper" :id="'window-wrapper-' + id" ref="wrapper">
         <WindowHandle :window="id" ref="handle"></WindowHandle>
 
-        <EditUserPartial></EditUserPartial>
-        <!-- Body -->
-        <div class="vert-expand">
-            <div class="vert top">
-                <h1>{{ $t("main-menu.main-menu")}}</h1>
-
-                <!-- HERE -->
-                 <div class="campaign-list">
-                    <CampaignEntry v-for="camp in myCampaigns" :key="camp._id" :data="camp"></CampaignEntry>
+        <div class="two-column">
+            <div class="vert-expand secondary">
+                <div class="image-container">
+                    <img alt="Dragonroll logo" src="/img/logo-splash.png" draggable="false" width="100%">
                 </div>
+                <div class="patch-notes-container">
+                    <h1>Welcome to dragonroll!</h1>
+                    <h2>Version 0.1</h2>
+                    <p>This is totally under construction. This is a review of how the patch notes will be displayed.</p>
+                    <p>There is also a lot of heavy development here.</p>
+                </div>
+                <VersionRender></VersionRender>
             </div>
-            
-            <div class="vert bot">
-                <div class="button-container">
-                    <button class="btn-primary button-expand sound-click" v-on:click="CreateCampaignWindow" ref="campaignButton">{{ $t("main-menu.create-campaign") }}</button>
+
+            <div class="vert-expand" style="max-width: 450px;">
+                <EditUserPartial></EditUserPartial>
+                <!-- Body -->
+                <div class="vert-expand">
+                    <div class="vert top">
+                        <h1>{{ $t("main-menu.main-menu")}}</h1>
+
+                        <!-- HERE -->
+                        <div class="campaign-list">
+                            <CampaignEntry v-for="camp in campaings" :key="camp._id" :data="camp"></CampaignEntry>
+                        </div>
+                    </div>
+                    
+                    <div class="vert bot">
+                        <div class="button-container">
+                            <button class="btn-primary button-expand sound-click" v-on:click="CreateCampaignWindow" ref="campaignButton">{{ $t("main-menu.create-campaign") }}</button>
+                        </div>
+                    </div>
                 </div>
             </div>
         </div>
@@ -72,6 +89,29 @@ onMounted(() => {
 h1 {
     margin-top: 20px;
     font-family: MrEavesRemake;
+    text-align: center;
+}
+
+h2, h3 {
+    font-family: MrEavesRemake;
+}
+
+.patch-notes-container {
+    margin: 10px;
+    padding: 10px;
+    border-radius: 5px;
+    flex-grow: 1;
+}
+
+.two-column {
+    display: flex;
+    flex-direction: row;
+    width: 100%;
+    height: 100%;
+}
+
+.secondary {
+    background-color: var(--color-background-soft);
 }
 
 .expand {
@@ -89,7 +129,8 @@ h1 {
     display: flex;
     flex-direction: column;
     justify-content: space-between;
-    height: 100%;
+    flex-grow: 1;
+    width: 100%;
 }
 
 
@@ -99,8 +140,7 @@ h1 {
 
 .button-container {
     display: flex;
-    width: 100%;
-    padding: 20px;
+    margin: 20px;
 
     flex-direction: column;
 }