diff --git a/frontend/package.json b/frontend/package.json
index 5100e736a..95dcda5ec 100755
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -41,6 +41,7 @@
     "vue-clickaway": "^2.2.2",
     "vue-clipboard2": "^0.3.0",
     "vue-cookies": "^1.7.4",
+    "vue-country-flag": "^2.0.3",
     "vue-flatpickr-component": "^8.1.2",
     "vue-good-table": "^2.21.3",
     "vue-i18n": "^8.22.4",
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 925cb52f6..2756c5314 100755
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -19,11 +19,14 @@ export default {
       ParticlesBg
     },
     created () {  
+      console.log( "xx", $cookies.get("gdd_lang"))
       console.log('%cWillkommen bei Gradido %cgreen text', 'font-weight:bold', 'color: green')
       if ( $cookies.isKey("gdd_session_id") == true) {
          console.log('%cHey %c'+$cookies.get("gdd_u")+'', 'font-weight:bold', 'color: orange')
          this.$store.commit('session_id', $cookies.get("gdd_session_id"))
          this.$store.commit('email', $cookies.get("gdd_u"))
+         this.$store.commit('language', $cookies.get("gdd_lang"))
+         this.$i18n.locale = $cookies.get("gdd_lang")
          this.$router.push("overview") 
      }else {
         console.log("app.vue to Logout")
diff --git a/frontend/src/locales/de.json b/frontend/src/locales/de.json
index 4b3088866..ce500351d 100644
--- a/frontend/src/locales/de.json
+++ b/frontend/src/locales/de.json
@@ -1,13 +1,13 @@
 {
   "message": "hallo gradido !!",
   "welcome":"Willkommen!",
-  "logout":"Logout",
+  "logout":"Abmelden",
   "login":"Login",
   "signup": "Registrieren",
   "imprint":"Impressum",
   "privacy_policy":"Datenschutzerklärung",
-  "license":"Lizenz",
   "back":"zurück",
+  "sent":"Senden",
   "transactions":"Transaktionen",
   "language":"Sprachen",
   "languages":{
@@ -38,7 +38,7 @@
   },
   "site": {
     "login": {
-      "community":"Du bist die Gemeinschaft",
+      "community":"Tausend Dank, weil du bei uns bist!",
       "remember":"Passwort merken",
       "signin":"Anmelden",
       "forgot_pwd":"Passwort vergessen?",
diff --git a/frontend/src/locales/en.json b/frontend/src/locales/en.json
index e5757458c..4fb4c14d9 100644
--- a/frontend/src/locales/en.json
+++ b/frontend/src/locales/en.json
@@ -4,10 +4,10 @@
   "logout":"Logout",
   "login":"Login",
   "signup": "Sign up",
-  "imprint":"Imprint",
+  "imprint":"Legal notice",
   "privacy_policy":"Privacy policy",
-  "license":"License",
   "back":"back",
+  "sent":"Sent",
   "transactions":"transactions",
   "language":"Language",
   "languages":{
@@ -39,8 +39,8 @@
   },
   "site": {
     "login": {
-      "community":"You are the community",
-      "remember":"Remember me",
+      "community":"A thousand thanks for being with us!",
+      "remember":"Remember password",
       "signin":"Sign in",
       "forgot_pwd":"Forgot password?",
       "new_wallet":"Create new wallet"
diff --git a/frontend/src/main.js b/frontend/src/main.js
index d98768a6e..78d03e58f 100755
--- a/frontend/src/main.js
+++ b/frontend/src/main.js
@@ -14,7 +14,7 @@ import router from './routes/router';
 Vue.use(DashboardPlugin);
 Vue.config.productionTip = false;
 Vue.use(VueCookies);
-
+ 
 
 /* eslint-disable no-new */
 new Vue({
diff --git a/frontend/src/plugins/dashboard-plugin.js b/frontend/src/plugins/dashboard-plugin.js
index a903cab74..67b161292 100755
--- a/frontend/src/plugins/dashboard-plugin.js
+++ b/frontend/src/plugins/dashboard-plugin.js
@@ -37,6 +37,9 @@ import 'vue-good-table/dist/vue-good-table.css';
 
 import VueMoment from 'vue-moment';
 
+import CountryFlag from 'vue-country-flag'
+
+
 Object.keys(rules).forEach(rule => {
   extend(rule, {
     ...rules[rule], // copies rule configuration
@@ -56,6 +59,7 @@ export default {
     Vue.use(VueQrcodeReader);
     Vue.use(VueQrcode);
     Vue.use(VueFlatPickr);
+    Vue.use(CountryFlag);
     configure({
       classes: {
         valid: 'is-valid',
diff --git a/frontend/src/routes/routes.js b/frontend/src/routes/routes.js
index 4acb71d90..256758d3a 100755
--- a/frontend/src/routes/routes.js
+++ b/frontend/src/routes/routes.js
@@ -26,6 +26,11 @@ const routes = [
       {
         path: '/password',
         component: () => import('../views/Pages/Password.vue')
+      },
+      {
+        path: '/explorer',
+        name: 'Explorer',
+        component: () => import('../views/Pages/Explorer.vue'),
       }
     ]
   },
@@ -68,7 +73,7 @@ const routes = [
         meta: {
           requiresAuth: true
         }
-      }
+      }     
     ]
   }
 ];
diff --git a/frontend/src/store/store.js b/frontend/src/store/store.js
index c33fbb338..bf4b610bb 100644
--- a/frontend/src/store/store.js
+++ b/frontend/src/store/store.js
@@ -7,11 +7,13 @@ import communityAPI from '../apis/communityAPI'
 import axios from 'axios'
 //import CONFIG from '../config'
 
-
 export const store = new Vuex.Store({
   state: {
     session_id: null,
     email: null,
+    language: 'en',
+    sizeDE: 'normal',
+    sizeGB: 'big',
     user : {
       name:"",
       balance: 0,
@@ -43,6 +45,19 @@ export const store = new Vuex.Store({
   },
   // Syncronous mutation of the state
   mutations: {
+    language: (state, language) => {
+       console.log('mutation: language', language)
+      state.language = language
+      $cookies.set('gdd_lang',  language);
+      if (state.language == "de") {
+        state.sizeDE = 'big'
+        state.sizeGB = 'normal'       
+      } else {
+        state.sizeDE = 'normal'
+        state.sizeGB = 'big'
+      }
+
+    },
     email: (state, email) => {
       //console.log('mutation: email')
       state.email = email
@@ -77,12 +92,14 @@ export const store = new Vuex.Store({
      // console.log('result.data.state',result.data.state)
      // console.log('result.data.session_id',result.data.session_id)
      
-      
+    
       if( result.success){
         commit('session_id', result.result.data.session_id)
         commit('email', data.email)
         $cookies.set('gdd_session_id', result.result.data.session_id);
         $cookies.set('gdd_u',  data.email);
+        
+     
         router.push('/overview')
       } else {
         // Register failed, we perform a logout
@@ -128,6 +145,7 @@ export const store = new Vuex.Store({
       commit('email', null)  
       $cookies.remove('gdd_session_id');
       $cookies.remove('gdd_u');
+      $cookies.remove('gdd_lang');
       router.push('/Login')
     },
     ajaxCreate: async ({ dispatch, state }) => {
diff --git a/frontend/src/views/KontoOverview/GddSent.vue b/frontend/src/views/KontoOverview/GddSent.vue
index b0a153b3b..2d2a858c7 100644
--- a/frontend/src/views/KontoOverview/GddSent.vue
+++ b/frontend/src/views/KontoOverview/GddSent.vue
@@ -6,6 +6,9 @@
             <span class="btn-inner--text">{{ $t('site.overview.send_gradido') }} </span>
           </base-button>
           <b-collapse id="collapse-1" class="mt-2">
+               <b-alert variant="warning" show dismissible >
+                  <strong>Achtung!</strong> Bitte überprüfe alle deine Eingaben sehr genau. Du bist alleine Verantwortlich für deine Entscheidungen. Versendete Gradidos können nicht wieder zurück geholt werden.
+              </b-alert>
             <b-card >              
               <div  v-if="scan">
                 <b-row>                                          
@@ -28,6 +31,10 @@
                   <qrcode-drop-zone id="input-0" v-model="form.img"></qrcode-drop-zone>
                   <br>
                   <div>
+                     <b-col    class="text-left pl-6">
+                            <b-badge variant="primary">Empfänger</b-badge>
+                          </b-col>  
+                                      
                     <b-input-group
                       id="input-group-1"
                         label="Empfänger:"
@@ -36,8 +43,8 @@
                           size="lg"
                         class="mb-3"
                         >
-                          <b-input-group-prepend>                            
-                                <img src="img/icons/gradido/qr-scan-pure.png" width="80" height="auto" @click="scan=true"/>                             
+                          <b-input-group-prepend  class="p-3">                            
+                                 <b-icon icon="envelope" class="display-3"></b-icon>                            
                           </b-input-group-prepend>
                       <b-form-input 
                           id="input-1"
@@ -51,12 +58,17 @@
                   </div>
                   <br>                
                   <div>
+                    <b-col    class="text-left pl-6">
+                            <b-badge variant="primary">Betrag</b-badge>
+                          </b-col> 
+                      <b-col v-if="($store.state.user.balance == form.amount)"  class="text-right">
+                            <b-badge variant="primary">maximale anzahl GDD zum versenden erreicht!</b-badge>
+                          </b-col>   
                     <b-input-group id="input-group-2" label="Betrag:" label-for="input-2"
                       size="lg"
                       class="mb-3"> 
                         <b-input-group-prepend>
-                           
-                             <img src="img/icons/gradido/plus.png" width="80">  
+                           <div class="h3 pt-3 pr-3">GDD</div>
                            
                         </b-input-group-prepend>
                         <b-form-input  
@@ -66,24 +78,31 @@
                           placeholder="0.01" 
                           step="0.01" 
                           min="0.01" 
-                          max="1000"
+                          :max="$store.state.user.balance"
                           style="font-size: xx-large; padding-left:20px">
                         </b-form-input>
-                        
-                        <b-input-group-prepend>                           
-                            <div class="h1">GDD</div>
-                        </b-input-group-prepend>
+                        {{$store.state.user.balance}}
+                       
 
-                    </b-input-group>                           
+                    </b-input-group>  
+                     <b-col    class="text-left pl-6">
+                            <b-badge variant="primary">Nachricht für den Empfänger (optional)</b-badge>
+                          </b-col>         
+                          
                     <b-input-group>
-                      <b-input-group-prepend>                        
-                           <b-icon icon="chat-right-text" class="display-1"></b-icon>
+                      <b-input-group-prepend class="p-3">                        
+                           <b-icon icon="chat-right-text" class="display-3"></b-icon>
                       </b-input-group-prepend>
-                      <b-form-textarea v-model="form.memo"></b-form-textarea>
+                      <b-form-textarea v-model="form.memo"  class="pl-3"></b-form-textarea>
                     </b-input-group>
  
                   </div>
+                  {{$refs.observer}}
                   <br>
+                  <b-row>
+                    <b-col></b-col>
+                    <b-col></b-col>
+                  </b-row>
                   <b-button type="submit" variant="primary">{{$t('form.send_now')}}</b-button>
                   <b-button type="reset" variant="danger">{{$t('form.cancel')}}</b-button>
                   <br>
@@ -110,17 +129,21 @@ export default {
      },
   data(){
     return {
-      scan: false,
+       scan: false,
        show: true,
        form: {
           img: '',
           email: '',
           amount: '',
           memo:''     
-        }
+        },
+        sent: false,
     }
   },
   methods: {
+    sendbutton(){
+      this.sent = true
+    },
      async onDecode (decodedString) {
            console.log('onDecode JSON.parse(decodedString)',JSON.parse(decodedString) )
            const arr = JSON.parse(decodedString) 
diff --git a/frontend/src/views/KontoOverview/GddStatus.vue b/frontend/src/views/KontoOverview/GddStatus.vue
index 048e40a78..13d60fd13 100644
--- a/frontend/src/views/KontoOverview/GddStatus.vue
+++ b/frontend/src/views/KontoOverview/GddStatus.vue
@@ -4,7 +4,8 @@
         <b-col xl="6" md="6">
           <stats-card type="gradient-red"
                       sub-title="balance_gdd"
-                      class="mb-4">
+                      class="mb-4"
+                      style="font-size: -webkit-xxx-large">
               {{ $n($store.state.user.balance) }} GDD
           </stats-card>
         </b-col>
@@ -22,12 +23,6 @@
 
 <script>
 export default {
-  name: 'GddStatus',
-  data(){
-    return {
-      balance_gdd: this.$store.state.user.balance,
-      balance_gdt: this.$store.state.user.balance_gdt,
-    }
-  }
+  name: 'GddStatus'
 };
 </script>
\ No newline at end of file
diff --git a/frontend/src/views/Layout/AuthLayout.vue b/frontend/src/views/Layout/AuthLayout.vue
index 089950afd..90b519392 100755
--- a/frontend/src/views/Layout/AuthLayout.vue
+++ b/frontend/src/views/Layout/AuthLayout.vue
@@ -61,9 +61,6 @@
               <b-nav-item href="http://blog.creative-tim.com" target="_blank">
                 Datenschutzerklärung
               </b-nav-item>
-              <b-nav-item href="https://www.creative-tim.com/license" target="_blank">
-                License
-              </b-nav-item>
             </b-nav>
           </b-col>
         </b-row>
diff --git a/frontend/src/views/Layout/AuthLayout_gdd.vue b/frontend/src/views/Layout/AuthLayout_gdd.vue
index b53eb676f..4dee33b6e 100644
--- a/frontend/src/views/Layout/AuthLayout_gdd.vue
+++ b/frontend/src/views/Layout/AuthLayout_gdd.vue
@@ -2,47 +2,23 @@
   <div class="main-content">    
     <template>
       <div class="main-content">
-        <router-view></router-view>    
+        <router-view></router-view>   
+         <content-footer v-if="!$route.meta.hideFooter"></content-footer>
+          
+          
       </div>
-      <footer class="py-5" id="footer-main">
-        <b-container >
-          <b-row align-v="center" class="justify-content-xl-between">
-            <b-col xl="6">
-              <div class="copyright text-center text-xl-left text-muted">
-                © {{year}} <a href="https://gradido.net/" class="font-weight-bold ml-1" target="_blank">Gradido Wallet</a>
-              </div>
-            </b-col>
-            <b-col xl="6" class="col-xl-6">
-              <b-nav class="nav-footer justify-content-center justify-content-lg-end">
-                <b-nav-item ref="https://gradido.net/" target="_blank">
-                  Gradido
-                </b-nav-item>
-                <b-nav-item href="https://gradido.net/" target="_blank">
-                {{$t('imprint')}}
-                </b-nav-item>
-                <b-nav-item href="https://gradido.net/" target="_blank">
-                  {{$t('privacy_policy')}}
-                </b-nav-item>
-                <b-nav-item href="https://gradido.net/" target="_blank">
-                  {{$t('license')}}
-                </b-nav-item>
-              </b-nav>
-            </b-col>
-          </b-row>
-          <br>
-          <br>
-          <b-row >           
-            <b-col class="nav-link text-center"  @click.prevent="setLocale('en')">{{ $t('languages.en') }}</b-col>
-            <b-col class="nav-link text-center" @click.prevent="setLocale('de')">{{ $t('languages.de') }}</b-col>
-          </b-row>
-        </b-container>
-      </footer>
+     
+          
+       
     </template>
   </div>
 </template>
 <script>
-
+import ContentFooter from './ContentFooter.vue';
   export default { 
+     components: {
+      ContentFooter
+    },
     data() {
       return {
         year: new Date().getFullYear(),
diff --git a/frontend/src/views/Layout/ContentFooter.vue b/frontend/src/views/Layout/ContentFooter.vue
index a413121b3..fb913523e 100755
--- a/frontend/src/views/Layout/ContentFooter.vue
+++ b/frontend/src/views/Layout/ContentFooter.vue
@@ -3,7 +3,7 @@
     <b-row align-v="center" class="justify-content-lg-between">
       <b-col lg="6">
         <div class="copyright text-center text-lg-left text-muted">
-          © {{year}} <a href="https://gradido.net/" class="font-weight-bold ml-1" target="_blank">Gradido Wallet</a>
+          © {{year}} <a href="#!" to="/login" class="font-weight-bold ml-1" >Gradido Wallet</a>
         </div>
       </b-col>
       <b-col lg="6">
@@ -17,34 +17,37 @@
           <b-nav-item href="https://gradido.net/" target="_blank">
             {{$t('privacy_policy')}}
           </b-nav-item>
-          <b-nav-item href="https://gradido.net/" target="_blank">
-            {{$t('license')}}
+          <b-nav-item href="#!" to="/explorer" >
+            GDD-Explorer
           </b-nav-item>
         </b-nav>
       </b-col>
     </b-row>
       <br>
-     <br>
+     
+    
    <b-row >
-            <b-col class="nav-link text-center"  @click.prevent="setLocale('en')">{{ $t('languages.en') }}</b-col>
-            <b-col class="nav-link text-center" @click.prevent="setLocale('de')">{{ $t('languages.de') }}</b-col>
+            <b-col class="nav-link text-center"  @click.prevent="setLocale('en')"><country-flag country='gb' :size='this.$store.state.sizeGB'/>{{ $t('languages.en') }}</b-col>
+            <b-col class="nav-link text-center" @click.prevent="setLocale('de')"><country-flag country='de' :size='this.$store.state.sizeDE' />{{ $t('languages.de') }}</b-col>
         </b-row>
   </footer>
 </template>
 <script>
+import CountryFlag from 'vue-country-flag'
+
 export default {
+  comments: {
+    CountryFlag
+  },
   data() {
     return {
-      year: new Date().getFullYear()
+      year: new Date().getFullYear(),
     };
   },
   methods: {
       setLocale(locale) {
       this.$i18n.locale = locale
-      //this.$router.push({
-      //  params: { lang: locale }
-      //})
-      //this.hideDropdown()
+      this.$store.commit('language', this.$i18n.locale)
     }
   },
 };
diff --git a/frontend/src/views/Layout/DashboardLayout.vue b/frontend/src/views/Layout/DashboardLayout.vue
index a7bd82e8b..c9a5698c1 100755
--- a/frontend/src/views/Layout/DashboardLayout.vue
+++ b/frontend/src/views/Layout/DashboardLayout.vue
@@ -6,19 +6,19 @@
        
          <b-nav-item href="#!" to="/overview">
                
-              <b-nav-text class="p-0 text-lg text-muted">Senden</b-nav-text>
+              <b-nav-text class="p-0 text-lg text-muted">{{ $t('sent')}}</b-nav-text>
           </b-nav-item>
          <b-nav-item href="#!" to="/profile">
              
-              <b-nav-text class="p-0 text-lg text-muted">Profil</b-nav-text>
+              <b-nav-text class="p-0 text-lg text-muted">{{ $t('site.navbar.my-profil')}}</b-nav-text>
           </b-nav-item>
          <b-nav-item href="#!" to="/profileedit">
               
-              <b-nav-text class="p-0 text-lg text-muted">Settings</b-nav-text>
+              <b-nav-text class="p-0 text-lg text-muted">{{ $t('site.navbar.settings') }}</b-nav-text>
           </b-nav-item>
          <b-nav-item href="#!" to="/activity">
              
-              <b-nav-text class="p-0 text-lg text-muted">Activity</b-nav-text>
+              <b-nav-text class="p-0 text-lg text-muted">{{ $t('site.navbar.activity') }}</b-nav-text>
           </b-nav-item>
           
       </template>
diff --git a/frontend/src/views/Pages/Explorer.vue b/frontend/src/views/Pages/Explorer.vue
new file mode 100644
index 000000000..edd6dbcc0
--- /dev/null
+++ b/frontend/src/views/Pages/Explorer.vue
@@ -0,0 +1,28 @@
+<template>
+  <div>
+    <!-- Header -->
+    <div class="header bg-gradient-info py-7 py-lg-3 pt-lg-2">
+      <b-container>
+        <div class="header-body text-center mb-7"> 
+          <p class="h1">GDD</p>
+          <p class="h4">Explorer</p>
+          
+        </div>
+      </b-container>
+      <div class="separator separator-bottom separator-skew zindex-100">
+        <svg x="0" y="0" viewBox="0 0 2560 100" preserveAspectRatio="none" version="1.1" xmlns="http://www.w3.org/2000/svg">
+          <polygon class="fill-default" points="2560 0 2560 100 0 100"></polygon>
+        </svg>
+      </div>
+    </div>
+    <!-- Page content -->
+  
+    <div>
+      <b-card>
+        <b-card-body>
+          This is some text within a card body.
+        </b-card-body>
+      </b-card>
+    </div>
+  </div>
+</template>
diff --git a/frontend/src/views/Pages/Login.vue b/frontend/src/views/Pages/Login.vue
index 71c1616f6..e8515debc 100755
--- a/frontend/src/views/Pages/Login.vue
+++ b/frontend/src/views/Pages/Login.vue
@@ -6,7 +6,7 @@
         <div class="text-center mb-7">
           <b-row class="justify-content-center">
             <b-col xl="5" lg="6" md="8" class="px-5">
-              <h1>Gradido Wallet</h1>
+              <h1>Gradido</h1>
               <p class="text-lead">{{ $t('site.login.community')}}</p>
             </b-col>
           </b-row>
diff --git a/frontend/src/views/Pages/Password.vue b/frontend/src/views/Pages/Password.vue
index dc18a1cc7..9b0c02813 100644
--- a/frontend/src/views/Pages/Password.vue
+++ b/frontend/src/views/Pages/Password.vue
@@ -27,9 +27,10 @@
                     name="Email"
                     :rules="{required: true, email: true}"
                     v-model="model.email">
-                  </base-input>                  
+                  </base-input>  
+                    {{form}}
                   <div class="text-center">
-                    <b-button type="submit" variant="primary" class="mt-4">{{ $t('site.password.reset_now')}}</b-button>
+                    <b-button type="submit" variant="primary" class="mt-4" :disabled="disable">{{ $t('site.password.reset_now')}}</b-button>
                   </div>
                 </b-form>
               </validation-observer>
@@ -48,6 +49,7 @@
     name: 'password',
     data() {
       return {
+        disable: 'disabled',
         model: {
           email: ''        
         }
diff --git a/frontend/src/views/Pages/Register.vue b/frontend/src/views/Pages/Register.vue
index d6592addd..a286ecf05 100755
--- a/frontend/src/views/Pages/Register.vue
+++ b/frontend/src/views/Pages/Register.vue
@@ -99,6 +99,7 @@
           lastname: '',
           email: '',
           password: '',
+          password2: '',
           agree: false          
         }
       }
diff --git a/frontend/src/views/Pages/UserProfileActivity.vue b/frontend/src/views/Pages/UserProfileActivity.vue
index f7ec2c8e1..236116f39 100644
--- a/frontend/src/views/Pages/UserProfileActivity.vue
+++ b/frontend/src/views/Pages/UserProfileActivity.vue
@@ -12,7 +12,9 @@
         </b-container>
       </b-container>
     </div>
-
+    
+    
+    
     <b-container fluid class="mt--6">
       <b-row>
         <b-col xl="4" class="order-xl-2 mb-5">
@@ -24,6 +26,28 @@
           <gdd-table></gdd-table>
         </b-col>
       </b-row>
+        <b-row>
+        <b-col xl="6"  S>
+          <div class="chart">
+            <line-chart
+              :height="350"
+              :chart-data="bigLineChart.chartData"
+            >
+            </line-chart>
+          </div>
+          
+        </b-col>
+        <b-col xl="6"  >
+          <div class="chart">
+            <line-chart
+              :height="350"
+              :chart-data="bigLineChart.chartData"
+            >
+            </line-chart>
+          </div>
+           
+        </b-col>
+      </b-row>
     </b-container>
   </div>
 </template>
@@ -32,10 +56,39 @@
   import GddWorkTable from '../../views/KontoOverview/GddWorkTable.vue';
    
 
+  import * as chartConfigs from '@/components/Charts/config';
+  import LineChart from '@/components/Charts/LineChart';
+  //import BarChart from '@/components/Charts/BarChart';
+
   export default {
     components: {
       GddTable,
-     GddWorkTable
+     GddWorkTable,
+    LineChart,
+    //BarChart
+    },
+    data(){
+      return {
+        bigLineChart: {
+          allData: [
+            [0, 20, 10, 30, 15, 40, 20, 60, 60],
+            [0, 20, 5, 25, 10, 30, 35, 60, 40],
+            [0, 2, 5, 7, 10, 30, 15, 9, 10],
+            [0, 2, 5, 7, 10, 14, 29, 78, 120]
+          ],
+          activeIndex: 0,
+          chartData: {
+            datasets: [
+              {
+                label: 'Performance',
+                data: [0, 20, 10, 30, 15, 40, 20, 60, 60],
+              }
+            ],
+            labels: ['May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
+          },
+          extraOptions: chartConfigs.blueChartOptions,
+        },
+      }
     }
   };
 </script>
diff --git a/frontend/src/views/Starter/SampleFooter.vue b/frontend/src/views/Starter/SampleFooter.vue
deleted file mode 100644
index 7786a507c..000000000
--- a/frontend/src/views/Starter/SampleFooter.vue
+++ /dev/null
@@ -1,37 +0,0 @@
-<template>
-  <footer class="footer px-4 mx-2">
-    <b-row align-v="center" class="justify-content-lg-between">
-      <b-col lg="6">
-        <div class="copyright text-center text-lg-left text-muted">
-          © {{year}} <a href="https://www.creative-tim.com" class="font-weight-bold ml-1" target="_blank">Creative Tim</a>
-        </div>
-      </b-col>
-      <b-col lg="6">
-        <b-nav class="nav-footer justify-content-center justify-content-lg-end">
-          <b-nav-item ref="https://www.creative-tim.com" target="_blank">
-            Creative Tim
-          </b-nav-item>
-          <b-nav-item href="https://www.creative-tim.com/presentation" target="_blank">
-           About Us
-          </b-nav-item>
-          <b-nav-item href="http://blog.creative-tim.com" target="_blank">
-            Blog
-          </b-nav-item>
-          <b-nav-item href="https://www.creative-tim.com/license" target="_blank">
-            License
-          </b-nav-item>
-        </b-nav>
-      </b-col>
-    </b-row>
-  </footer>
-</template>
-<script>
-  export default {
-    data() {
-      return {
-        year: new Date().getFullYear()
-      };
-    }
-  };
-</script>
-<style></style>
diff --git a/frontend/src/views/Starter/SampleLayout.vue b/frontend/src/views/Starter/SampleLayout.vue
deleted file mode 100755
index 5b3d69f21..000000000
--- a/frontend/src/views/Starter/SampleLayout.vue
+++ /dev/null
@@ -1,77 +0,0 @@
-<template>
-  <div class="wrapper">
-    <notifications></notifications>
-    <side-bar>
-      <template slot-scope="" slot="links">
-        <sidebar-item
-          :link="{
-            name: 'Dashboards',
-            icon: 'ni ni-shop text-primary',
-          }"
-        >
-          <sidebar-item :link="{ name: 'Dashboard', path: '/dashboard' }"></sidebar-item>
-        </sidebar-item>
-      </template>
-    </side-bar>
-    <div class="main-content">
-      <dashboard-navbar></dashboard-navbar>
-
-      <div @click="$sidebar.displaySidebar(false)">
-        <fade-transition :duration="200" origin="center top" mode="out-in">
-          <!-- your content here -->
-          <router-view></router-view>
-        </fade-transition>
-      </div>
-      <content-footer v-if="!$route.meta.hideFooter"></content-footer>
-    </div>
-  </div>
-</template>
-<script>
-/* eslint-disable no-new */
-import PerfectScrollbar from 'perfect-scrollbar';
-import 'perfect-scrollbar/css/perfect-scrollbar.css';
-
-function hasElement(className) {
-  return document.getElementsByClassName(className).length > 0;
-}
-
-function initScrollbar(className) {
-  if (hasElement(className)) {
-    new PerfectScrollbar(`.${className}`);
-  } else {
-    // try to init it later in case this component is loaded async
-    setTimeout(() => {
-      initScrollbar(className);
-    }, 100);
-  }
-}
-
-import DashboardNavbar from './SampleNavbar.vue';
-import ContentFooter from './SampleFooter.vue';
-import DashboardContent from '../Layout/Content.vue';
-import { FadeTransition } from 'vue2-transitions';
-
-export default {
-  props: [],
-  components: {
-    DashboardNavbar,
-    ContentFooter,
-    //DashboardContent,
-    FadeTransition,
-  },
-  methods: {
-    initScrollbar() {
-      let docClasses = document.body.classList;
-      let isWindows = navigator.platform.startsWith('Win');
-      if (isWindows) {
-        // if we are on windows OS we activate the perfectScrollbar function
-        initScrollbar('scrollbar-inner');
-
-        docClasses.add('perfect-scrollbar-on');
-      } else {
-        docClasses.add('perfect-scrollbar-off');
-      }
-    }
-  }
-};
-</script>
diff --git a/frontend/src/views/Starter/SampleNavbar.vue b/frontend/src/views/Starter/SampleNavbar.vue
deleted file mode 100644
index 859f4464b..000000000
--- a/frontend/src/views/Starter/SampleNavbar.vue
+++ /dev/null
@@ -1,137 +0,0 @@
-<template>
-  <base-nav
-    container-classes="container-fluid"
-    class="navbar-top border-bottom navbar-expand"
-    :class="$route.meta.navbarClasses ? $route.meta.navbarClasses : 'bg-success navbar-dark'"
-    type=""
-  >
-    <!-- Search form -->
-    <b-form class="navbar-search form-inline mr-sm-3"
-          :class="$route.meta.searchClasses ? $route.meta.searchClasses : 'navbar-search-light'"
-          id="navbar-search-main">
-      <b-form-group class="mb-0">
-        <b-input-group class="input-group-alternative input-group-merge">
-          <div class="input-group-prepend">
-            <span class="input-group-text"><i class="fas fa-search"></i></span>
-          </div>
-          <b-form-input placeholder="Search" type="text"></b-form-input>
-        </b-input-group>
-      </b-form-group>
-      <button type="button" class="close" data-action="search-close" data-target="#navbar-search-main" aria-label="Close">
-        <span aria-hidden="true">×</span>
-      </button>
-    </b-form>
-    <!-- Navbar links -->
-    <b-navbar-nav class="align-items-center ml-md-auto">
-      <!-- This item dont have <b-nav-item> becouse they add class 'nav-link' which is not needed here -->
-      <li class="nav-item d-xl-none">
-        <!-- Sidenav toggler -->
-        <div class="pr-3 sidenav-toggler sidenav-toggler-dark"
-             @click="toggleSidebar">
-          <div class="sidenav-toggler-inner">
-            <i class="sidenav-toggler-line"></i>
-            <i class="sidenav-toggler-line"></i>
-            <i class="sidenav-toggler-line"></i>
-          </div>
-        </div>
-      </li>
-      <!-- This item dont have <b-nav-item> because item have data-action/data-target on tag <a>, wich we cant add -->
-      <li class="nav-item d-sm-none">
-        <a class="nav-link" href="#" data-action="search-show" data-target="#navbar-search-main">
-          <i class="ni ni-zoom-split-in"></i>
-        </a>
-      </li>
-    </b-navbar-nav>
-    <b-navbar-nav class="align-items-center ml-auto ml-md-0">
-      <b-nav-item-dropdown right>
-        <b-dropdown-item  class="pr-0" href="#" >
-          <b-media no-body class="align-items-center">
-                  <span class="avatar avatar-sm">
-                    <b-img alt="Image placeholder" rounded="circle" src="img/theme/team-4.jpg" />
-                  </span>
-            <b-media-body class="ml-2 d-none d-lg-block">
-              <span class="mb-0 text-sm  font-weight-bold">John Snow</span>
-            </b-media-body>
-          </b-media>
-        </b-dropdown-item>
-        <b-dropdown>
-          <b-dropdown-header class="noti-title">
-            <h6 class="text-overflow m-0">Welcome!</h6>
-          </b-dropdown-header >
-          <b-dropdown-item href="#!">
-            <i class="ni ni-single-02"></i>
-            <span>My profile</span>
-          </b-dropdown-item>
-          <b-dropdown-item href="#!">
-            <i class="ni ni-settings-gear-65"></i>
-            <span>Settings</span>
-          </b-dropdown-item>
-          <b-dropdown-item href="#!">
-            <i class="ni ni-calendar-grid-58"></i>
-            <span>Activity</span>
-          </b-dropdown-item>
-          <b-dropdown-item href="#!">
-            <i class="ni ni-support-16"></i>
-            <span>Support</span>
-          </b-dropdown-item>
-          <div class="dropdown-divider"></div>
-          <b-dropdown-item href="#!">
-            <i class="ni ni-user-run"></i>
-            <span>Logout</span>
-          </b-dropdown-item>
-        </b-dropdown>
-      </b-nav-item-dropdown>
-    </b-navbar-nav>
-  </base-nav>
-</template>
-<script>
-  import { CollapseTransition } from 'vue2-transitions';
-  import { BaseNav, Modal } from '@/components';
-
-  export default {
-    components: {
-      //CollapseTransition,
-      BaseNav,
-      //Modal
-    },
-    computed: {
-      routeName() {
-        const { name } = this.$route;
-        return this.capitalizeFirstLetter(name);
-      },
-      isRTL() {
-        return this.$rtl.isRTL;
-      }
-    },
-    data() {
-      return {
-        activeNotifications: false,
-        showMenu: false,
-        searchModalVisible: false,
-        searchQuery: ''
-      };
-    },
-    methods: {
-      capitalizeFirstLetter(string) {
-        return string.charAt(0).toUpperCase() + string.slice(1);
-      },
-      toggleNotificationDropDown() {
-        this.activeNotifications = !this.activeNotifications;
-      },
-      closeDropDown() {
-        this.activeNotifications = false;
-      },
-      toggleSidebar() {
-        this.$sidebar.displaySidebar(!this.$sidebar.showSidebar);
-      },
-      hideSidebar() {
-        this.$sidebar.displaySidebar(false);
-      }
-    }
-  };
-</script>
-<style scoped>
-  .top-navbar {
-    top: 0px;
-  }
-</style>
diff --git a/frontend/src/views/Starter/SamplePage.vue b/frontend/src/views/Starter/SamplePage.vue
deleted file mode 100755
index e0dee359f..000000000
--- a/frontend/src/views/Starter/SamplePage.vue
+++ /dev/null
@@ -1,95 +0,0 @@
-<template>
-  <div>
-    <base-header class="pb-6">
-      <b-row align-v="center" class="py-4">
-        <b-col lg="6" cols="7">
-          <h6 class="h2 text-white d-inline-block mb-0">Default</h6>
-          <nav aria-label="breadcrumb" class="d-none d-md-inline-block ml-md-4">
-            <route-bread-crumb></route-bread-crumb>
-          </nav>
-        </b-col>
-        <b-col lg="6" cols="5" class="text-right">
-          <base-button size="sm" type="neutral">New</base-button>
-          <base-button size="sm" type="neutral">Filters</base-button>
-        </b-col>
-      </b-row>
-      <!-- Card stats -->
-      <b-row >
-        <b-col xl="3" md="6" >
-          <stats-card title="Total traffic"
-                      type="gradient-red"
-                      sub-title="350,897"
-                      icon="ni ni-active-40">
-
-            <template slot="footer">
-              <span class="text-success mr-2"><i class="fa fa-arrow-up"></i> 3.48%</span>
-              <span class="text-nowrap">Since last month</span>
-            </template>
-          </stats-card>
-        </b-col>
-        <b-col md="6" xl="3">
-          <stats-card title="Total traffic"
-                      type="gradient-orange"
-                      sub-title="2,356"
-                      icon="ni ni-chart-pie-35">
-
-            <template slot="footer">
-              <span class="text-success mr-2"><i class="fa fa-arrow-up"></i> 12.18%</span>
-              <span class="text-nowrap">Since last month</span>
-            </template>
-          </stats-card>
-        </b-col>
-        <b-col md="6" xl="3">
-          <stats-card title="Sales"
-                      type="gradient-green"
-                      sub-title="924"
-                      icon="ni ni-money-coins">
-
-            <template slot="footer">
-              <span class="text-danger mr-2"><i class="fa fa-arrow-down"></i> 5.72%</span>
-              <span class="text-nowrap">Since last month</span>
-            </template>
-          </stats-card>
-
-        </b-col>
-        <b-col md="6" xl="3">
-          <stats-card title="Performance"
-                      type="gradient-info"
-                      sub-title="49,65%"
-                      icon="ni ni-chart-bar-32">
-
-            <template slot="footer">
-              <span class="text-success mr-2"><i class="fa fa-arrow-up"></i> 54.8%</span>
-              <span class="text-nowrap">Since last month</span>
-            </template>
-          </stats-card>
-        </b-col>
-      </b-row>
-    </base-header>
-    <b-container fluid class="mt--6">
-      <b-row class="starter-page">
-        Sample page
-      </b-row>
-    </b-container>
-  </div>
-</template>
-<script>
-  import RouteBreadCrumb from '@/components/Breadcrumb/RouteBreadcrumb';
-  import StatsCard from '@/components/Cards/StatsCard';
-
-  export default {
-    name: 'starter-page',
-    components: {
-      StatsCard,
-      RouteBreadCrumb
-    },
-    data() {
-      return {};
-    }
-  };
-</script>
-<style>
-  .starter-page {
-    min-height: calc(100vh - 380px);
-  }
-</style>
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
index 06586d16a..aecec84d1 100644
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
@@ -9626,6 +9626,11 @@ vue-cookies@^1.7.4:
   resolved "https://registry.yarnpkg.com/vue-cookies/-/vue-cookies-1.7.4.tgz#d241d0a0431da0795837651d10b4d73e7c8d3e8d"
   integrity sha512-mOS5Btr8V9zvAtkmQ7/TfqJIropOx7etDAgBywPCmHjvfJl2gFbH2XgoMghleLoyyMTi5eaJss0mPN7arMoslA==
 
+vue-country-flag@^2.0.3:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/vue-country-flag/-/vue-country-flag-2.0.3.tgz#f644d8f5150a97f473f0c13e04622c6ede37d1de"
+  integrity sha512-QZM3hNNhnGU+G1qnpq1BiICE4Zh91UA++/UpM0go8XbxkVxTiPy4asWY07vL/3PtW8M69YqWVbhwG13rzvNwkA==
+
 vue-eslint-parser@^2.0.3:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-2.0.3.tgz#c268c96c6d94cfe3d938a5f7593959b0ca3360d1"