<template>
  <v-app id="login">
    <v-toolbar color="grey lighten-2">
      <v-toolbar-items>
       <img src="   " />
    </v-toolbar-items>
  </v-toolbar>
    <v-content>
      <v-container fluid fill-height>
        <v-layout align-center justify-center>
          <v-flex xs12 sm8 md6 lg4>
              <v-toolbar color="black" dark>
         <v-spacer></v-spacer>
          
          <v-toolbar-title>Forget Password</v-toolbar-title>
          <v-spacer></v-spacer>
          
        </v-toolbar>
            <v-card class="elevation-1 pa-3">
              <v-card-text>
                <!--   <div>
                <h2 class=" primary--text mt-3 text-md-left">Forget Password</h2>
                 
                </div> -->
                <h5 class="text-md-center"> Not to Worry ! Enter to your registered Email ID. </h5>
                <h5 class="text-md-center"> We'll send you a reset,</h5>                           
                <v-form class="mt-5">
                  <!--<v-text-field append-icon="person" name="Email" label="Email" type="text" v-model="model.username"></v-text-field>-->
                  <v-text-field append-icon="person" v-validate="'required|email'" v-model="email" :error-messages="errors.collect('email')" label="E-mail" data-vv-name="email" required ></v-text-field>
                  
                </v-form>
              </v-card-text>
              <v-card-actions>
              <!--  <v-btn icon>
                  <v-icon color="blue">fa fa-facebook-square fa-lg</v-icon>
                </v-btn>
                <v-btn icon>
                  <v-icon color="red">fa fa-google fa-lg</v-icon>
                </v-btn>
                <v-btn icon>
                  <v-icon color="light-blue">fa fa-twitter fa-lg</v-icon> 
                </v-btn>-->

                
                <v-flex text-sm-center>
                    <h5> You will recieve an email to continue</h5>
                <v-btn class="mt-3" round color="black" dark large @click="login">Send Request</v-btn></v-flex>
                </v-card-actions>
            </v-card>
          </v-flex>
        </v-layout>
      </v-container>
    </v-content>
    <v-footer class="pa-4" color="grey darken-2">
  
  </v-footer>
  </v-app>
</template>
<script>
export default {
  data: () => ({
    loading: false,
    model: {
      Email: ''
      
    }
  }),

  methods: {
    login () {
      this.loading = true;
      setTimeout(() => {
        this.$router.push('/');
      }, 1000);
    }
  }

};
</script>
<style scoped lang="css">
  #login {
    height: 50%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    z-index: 0;
  }
</style>