Dodanie regul i seleketa do typu karty

frontend/app/src/components/Navbar.vue

@@ -43,7 +43,7 @@
             
             <v-layout column align-center>
                 <v-flex class="mt-5">
-                    <v-avatar size ="100" color="white">
+                    <v-avatar size ="100" color="white" @click="drawer=false">
                         <img src="/cylinder-okragly.png">
                     </v-avatar>
                     <p class="white--text mt-3 subheading">Edżentelmeni</p>

frontend/app/src/components/Popup.vue

@@ -9,8 +9,15 @@
             </v-card-title>
             <v-card-text>
                 <v-form class="px-3" ref="form">
-                    <v-text-field label="title" v-model="title" prepend-icon="folder" :rules="inputRules"></v-text-field>
+                <v-select
-                    <v-textarea label="Information" v-model="content" prepend-icon="edit" :rules="inputRules"></v-textarea>
+                  :items="['pytanie', 'odpowiedź']"
+                  label="Typ karty*"
+                  required
+                  prepend-icon= folder
+                  v-model="cardType"
+                  :rules="cardTypeRules"
+                ></v-select>
+                    <v-textarea label="Treść*" v-model="cardText" prepend-icon="edit" :rules="inputRules"></v-textarea>
                     <v-spacer></v-spacer>
                     
                     <v-btn flat class="success mx-0 mt-3" @click="submit" :loading="loading">Add Project</v-btn>
@@ -26,12 +33,13 @@ import format from 'date-fns/format'
 export default {
     data(){
         return{
-            title: '',
+            cardText: '',
-            content: '',
+            cardType: '',
             due: null,
             inputRules: [
-                v => v.length >= 3 || 'Minimum length is 3 characters'
+                v => v.length >= 2 || 'Treść karty musi mieć minimum 2 znaki'
             ],//array of diferent rules
+            cardTypeRules: [ v=> v.length > 0 || 'Typ karty jest wymagany' ],
             loading: false,
             dialog: false
         }

frontend/app/src/store/store.js

@@ -7,8 +7,8 @@ export const store = new Vuex.Store({
     state: {
         links:[
             { icon: 'dashboard', text: 'Gra', route: '/'},
-            { icon: "folder", text: 'Karty', route: '/karty'},
             { icon: 'person', text: 'Dżentelmani', route: '/dzentelmani'},
+            { icon: "folder", text: 'Wszystkie Karty', route: '/karty'},
             // { icon: 'exit_to_app', text: 'Wyloguj', route: '/logout'},
             // { icon: 'get_app', text: 'Zaloguj', route: '/login'},
             // { icon: 'account_circle', text: 'Rejestracja', route: '/register'},

frontend/app/src/views/Cards.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="dashboard">
-    <h1 class="subheading grey--text">Dashboard </h1>
+    <h1 class="subheading grey--text">Wszystkie karty z bazy danych </h1>
 
     <v-container fluid class="my-5">
 

frontend/app/src/views/Game.vue

@@ -21,12 +21,13 @@
                 </v-flex>
             </v-layout>
             <v-layout row wrap>
-            <v-flex xs12 sm6 md4 lg3 v-for="card in cards" :key="card.name">
+            <v-flex xs12 sm6 md4 lg2 v-for="card in cards" :key="card.name">
-                <v-card flat class="text-xs-center ma-3">
+                <v-card flat class="text-xs-center ma-1 grey lighten-2 ">
                 <v-responsive class="pt-4">
-                    <v-card-text class="ml-5 pl-5">
+                    <v-card-text class="">
 
-                    <div class="card">
+                <!-- karty odpowiedzi  -->
+                    <div class="card" @click="chosenCard">
                         <div class="card-main">
                             <v-avatar size ="100" color="white mb-1">
                                 <img src="/moustache-black.png">
@@ -34,17 +35,8 @@
                             <p class = "pa-1">{{ card.text }}</p>
                         </div>
                     </div>
-                <!-- karty odpowiedzi  -->
                 </v-card-text>
                 </v-responsive>
-                <v-card-actions>
-                    <v-btn flat color="grey">
-                    <!-- <v-icon small left>thumb_up</v-icon> -->
-                        <!-- <v-icon small left>check</v-icon> -->
-                        <v-icon small left>thumb_up_alt</v-icon>
-                    <span>Najlepsza!</span>
-                    </v-btn>
-                </v-card-actions>
                 </v-card>
 
             </v-flex>
@@ -74,6 +66,11 @@ export default {
         questionCard: { text: 'Pracuje 80 godzin tygodniowo i nadal nie stać mnie na ...'},
 
       }
+    },
+    methods:{
+        chosenCard(){
+            console.log("Wybrano karte")
+        }
     }
 }
 </script>
@@ -89,6 +86,7 @@ export default {
 
   display: flex;                /* Children use Flexbox */
   flex-direction: column;       /* Rotate Axis */
+  background: white;
 }
 
 .cardQuestion{

frontend/app/src/views/Users.vue

@@ -13,13 +13,12 @@
               </v-responsive>
               <v-card-text>
                 <div class="subheading">{{ person.name }}</div>
-                <div class="grey--text">{{ person.role }}</div>
+                <div class="grey--text">{{ person.userDescription }}</div>
-                <div class="grey--text">Liczba wygranych partii</div>
               </v-card-text>
               <v-card-actions>
                 <v-btn flat color="grey">
-                  <v-icon small left>message</v-icon>
+                  <v-icon small left>grade</v-icon>
-                  <span>Message</span>
+                  <span>{{person.points}}</span>
                 </v-btn>
               </v-card-actions>
             </v-card>
@@ -37,11 +36,11 @@
       return{
           userAvatar: '/user-cylinder.png',
           team: [
-          { name: 'Sarenka', role: 'Web developer', avatar:'/cylinder11.jpg'},
+          { name: 'Sarenka', userDescription: 'Opis swoj uzytkownika', points: 100},
-          { name: 'Ksiezniczka', role: 'Graphic designer', avatar:'/user-cylinder.png'},
+          { name: 'Ksiezniczka', userDescription: 'Graphic designer', points: 100},
-          { name: 'Jeż', role: 'Web developer', avatar:'/test.png'},
+          { name: 'Jeż', userDescription: 'Web developer', points: 100},
-          { name: 'Miro', role: 'Social media maverick', avatar:'/user-cylinder.jpg' },
+          { name: 'Miro', userDescription: 'Social media maverick', points: 100 },
-          { name: 'Wilk', role: 'Sales guru', avatar:'/user-cylinder.jpg'},
+          { name: 'Wilk', userDescription: 'Sales guru', points: 100},
         ]
       }
     }