Merge pull request #295 from CoderDojo/feature/covid-banner

Add covid banner to find dojo page

Author: ArayB

package.json

@@ -24,7 +24,7 @@
   "dependencies": {
     "@coderdojo/cd-common": "1.1.11",
     "bootstrap": "^3.4.1",
-    "cp-translations": "1.0.140",
+    "cp-translations": "^1.0.142",
     "font-awesome": "^4.7.0",
     "handlebars": "^4.1.0",
     "js-cookie": "^2.1.4",

src/common/cd-covid-banner.vue

@@ -0,0 +1,27 @@
+<template>
+    <div class="cd-banner">
+      <p>{{ $t('Thank you for your interest in joining the CoderDojo community!') }}</p>
+      <p>{{ $t('Due to the coronavirus pandemic, we have paused the Dojo verification process.') }}</p>
+      <p>{{ $t('In the meantime, we’re providing exciting opportunities for young people, parents, volunteers, and educators to get creative with tech through') }}
+        <a class="cd-banner-link" href="https://www.raspberrypi.org/at-home/">{{ $t('Digital Making at Home') }}</a> {{ $t('from the Raspberry Pi Foundation.') }}
+      </p>
+    </div>
+</template>
+
+<script>
+</script>
+
+<style scoped lang="less">
+  .cd-banner {
+    background-color: #63257D;
+    color: #fff;
+    margin: 0 -16px;
+    padding: 24px 32px 14px;
+  }
+
+  .cd-banner-link {
+    color: #fff;
+    text-decoration: underline;
+    font-weight: bold;
+  }
+</style>

src/dojos/cd-find-dojo.vue

@@ -1,5 +1,6 @@
 <template>
   <div v-title="title" class="cd-find-dojo">
+    <cd-covid-banner></cd-covid-banner>
     <div class="cd-find-dojo__panel" :class="{ 'cd-find-dojo__panel--reduced': searchExecuted }">
       <form class="cd-find-dojo__panel-form" :class="{ 'cd-find-dojo__panel-form--reduced': searchExecuted }" @submit.prevent="$router.push({ query: { q: searchCriteria, p: 1 } });">
         <h1 v-if="!searchExecuted" class="cd-find-dojo__panel-form-header">{{ $t('Find a Dojo to attend') }}</h1>
@@ -78,6 +79,7 @@
   import Vue from 'vue';
   import DojoList from '@/dojos/cd-dojo-list';
   import DojoMap from '@/dojos/cd-dojo-map';
+  import cdCovidBanner from '@/common/cd-covid-banner';
   import GeolocationService from '@/geolocation/service';
   import translationComponentGenerator from '@/common/cd-translation-component-generator';
   import DojosService from './service';
@@ -184,6 +186,7 @@
       DojoMap,
       NoResultsDesktop,
       NoResultsMobile,
+      cdCovidBanner,
     },
     watch: {
       $route(newRoute) {

yarn.lock

@@ -2386,10 +2386,10 @@ cosmiconfig@^2.1.0, cosmiconfig@^2.1.1:
     parse-json "^2.2.0"
     require-from-string "^1.1.0"
 
-[email protected].140:
-  version "1.0.140"
-  resolved "https://registry.yarnpkg.com/cp-translations/-/cp-translations-1.0.140.tgz#ee8b175748d224a89558abe1228e3b2049767b61"
-  integrity sha512-Fpd561fXRfzhKy3aOE2p4A7KFBLJOJjiZ8liZLPseSHv4xSK//MnqFnoE6HJMd5AqibFqDmShGPxXY5glFIdtw==
+cp-translations@^1.0.142:
+  version "1.0.142"
+  resolved "https://registry.yarnpkg.com/cp-translations/-/cp-translations-1.0.142.tgz#239cb85d190279094e384101a47618201b924b8a"
+  integrity sha512-+kayUqvZWM/qfdLYd88CF3qw0pYiTX7aHRvH4SmgP/Ir1uSMoAC0m+LE1RLw1r5gL2SZTzWr0KqheHm/iftckg==
 
 crc32-stream@^2.0.0:
   version "2.0.0"