profile e feeed

LiamTX · Oct 2, 2020 · 42e9a3a · 42e9a3a
1 parent 400b7e4
commit 42e9a3a
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 19 deletions.
diff --git a/src/components/cpmDialogProfile.vue b/src/components/cpmDialogProfile.vue
@@ -1,8 +1,10 @@
 <template>
   <v-row class="ac">
     <v-dialog v-model="dialog" persistent max-width="600px">
-      <template v-slot:activator="{ on, attrs }">
-        <v-btn v-bind="attrs" v-on="on">EDITAR</v-btn>
+      <template class="d-flex align-center" v-slot:activator="{ on, attrs }">
+
+        <v-btn class="mr-auto ml-auto" v-bind="attrs" v-on="on">EDITAR</v-btn>
+
       </template>
       <v-card>
         <v-card-title>

diff --git a/src/views/private/Feed.vue b/src/views/private/Feed.vue
@@ -1,7 +1,17 @@
 <template>
     <div>
         <ToolBar />
-        <v-progress-linear v-if="loading" class="progress mx-auto" indeterminate color="purple"></v-progress-linear>
+
+        <v-container v-if="loading" style="height: 400px;">
+            <v-row class="fill-height" align-content="center" justify="center">
+                <v-col class="subtitle-1 text-center" cols="12">
+                    Carregando eventos...
+                </v-col>
+                <v-col cols="6">
+                    <v-progress-linear color="deep-purple accent-4" indeterminate rounded height="6"></v-progress-linear>
+                </v-col>
+            </v-row>
+        </v-container>
 
         <section v-else>
             <h1 class="alg-txt-c headline mt-3">Feed</h1>
@@ -19,10 +29,8 @@
                     </div>
 
                 </v-card>
-
             </div>
         </section>
-
     </div>
 </template>
 

diff --git a/src/views/private/Profile.vue b/src/views/private/Profile.vue
@@ -1,14 +1,14 @@
 <template>
-  <div>
+  <div class="mx-auto d-flex flex-column">
     <Toolbar />
 
-    <h1 class="alg-txt-c">SUAS INFORMAÇÔES</h1>
+    <h1 class="alg-txt-c headline ma-4">Perfil</h1>
 
-    <div>
-      <v-card class="p10 ac" max-width="600">
-        <v-card class="mx-auto" max-width="600">
+    <v-card flat class="mx-auto">
+      <v-card max-width="600" class="d-flex flex-column">
+        <v-card flat class="mx-auto d-flex flex-column" max-width="600">
           <v-list-item three-line>
-            <v-list-item-content>
+            <v-list-item-content class="mt-3">
               <!-- <div class="overline mb-4">OVERLINE</div> -->
               <v-list-item-title class="headline mb-1">{{user_data.name}}</v-list-item-title>
               <hr />
@@ -29,7 +29,7 @@
           </v-card-actions>
         </v-card>
 
-        <h2 class="alg-txt-s mt-5">SEUS EVENTOS</h2>
+        <h2 class="alg-txt-s mt-5 headline mx-auto">Meus Eventos</h2>
 
         <div class="mt-5" v-if="events == false">
           <h5 class="alg-txt-c">Você não tem eventos cadastrados</h5>
@@ -49,17 +49,18 @@
           </v-row>
         </div>
 
-        <div v-else v-for="event in events" :key="event.id">
-          <EventCard class="mt-4" :cardData="event" />
+        <div class="mb-6" v-else v-for="event in events" :key="event.id">
+          <EventCard class="mt-4 card" :cardData="event" />
         </div>
 
         <div>
-          <v-col class="text-center mt-7" cols="1" sm="12">
-            <v-btn align="center" class="ml-2" color="red" dark>SAIR</v-btn>
-          </v-col>
+
         </div>
       </v-card>
-    </div>
+                <v-col class="text-center mt-7" cols="1" sm="12">
+            <v-btn align="center" class="ml-2" color="red" dark>SAIR</v-btn>
+          </v-col>
+    </v-card>
   </div>
 </template>
 
@@ -132,4 +133,18 @@ export default {
     this.loadEvents();
   },
 };
-</script>
+</script>
+
+<style scoped>
+
+
+.card {
+
+    width: 500px;
+    margin-left: auto;
+    margin-right: auto;
+
+
+}
+
+</style>