added grid for profile page

luckydiamond/src/assets/css/global.css

@@ -39,6 +39,24 @@ body, html {
     grid-gap: 10px;
 }
 
+.content__grid-profile {
+    display: grid;
+    grid-template-columns: .35fr repeat(5, 1fr) 1fr;
+    grid-template-rows: auto 0fr repeat(4, 1fr);
+    grid-auto-columns: 1fr;
+    grid-auto-flow: row;
+    grid-template-areas:
+    "menu header header header header header header"
+    "menu profile profile payments payments payments chat"
+    "menu profile profile payments payments payments chat"
+    "menu profile profile payments payments payments chat"
+    "menu profile profile payments payments payments chat"
+    "menu profile profile payments payments payments chat"
+    "menu profile profile payments payments payments chat";
+    grid-gap: 10px;
+    height: 100%;
+}
+
 
 /* /Content Grid */
 
@@ -99,4 +117,20 @@ body, html {
     width: 100%;
 }
 
-/* /GameMode */
+/* /GameMode */
+
+/* Profile */
+
+.profile {
+    grid-area: profile;
+}
+
+/* /Profile */
+
+/* Payments */
+
+.payments {
+    grid-area: payments;
+}
+
+/* /Payments */

luckydiamond/src/pages/ProfilePage.vue

@@ -6,6 +6,13 @@
 
     <header-component></header-component>
 
+    <div class="profile">
+
+    </div>
+
+    <div class="payments">
+
+    </div>
   </div>
 </template>