recent updates

.gitignore

@@ -61,7 +61,4 @@ typings/
 .next
 
 # secrets
-secret.json
-
-# build
-build
+secret.json

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "deno.enable": false
+}

deploy.sh

@@ -21,23 +21,26 @@ elif [ $LOCAL = $REMOTE ]; then
   sed -i.bak '/before_install:/,/install:/{//p;d;}' .travis.yml
   rm .travis.yml.bak
   echo -e "${PINK}STEP 2 of 7: Encrypting secret.json${NC}"
-  travis encrypt-file secret.json --add --force
+  travis encrypt-file secret.json --add --force --pro
   echo -e "${PINK}STEP 3 of 7: Committing encrypted secret and updated Travis config to Git${NC}"
   git add secret.json.enc .travis.yml
   git commit -m "Updated secret.json"
   echo -e "${PINK}STEP 4 of 7: Bumping package version number and generating Git tag${NC}"
   npm version patch
   echo -e "${PINK}STEP 5 of 7: Pushing all previous changes to 'development' branch${NC}"
   git push
-  echo -e "${PINK}STEP 6 of 7: Bringing 'production' branch up-to-date with 'development'${NC}"
-  git checkout production
-  git pull
-  git pull origin development
-  git push
-  echo -e "${PINK}STEP 7 of 7: Navigating back to 'development'${NC}"
-  git checkout development
+  # echo -e "${PINK}STEP 6 of 7: Bringing 'production' branch up-to-date with 'development'${NC}"
+  echo -e "${PINK}STEP 6 of 7: ???"
+  # git checkout production
+  # git pull
+  # git pull origin development
+  # git push
+  # echo -e "${PINK}STEP 7 of 7: Navigating back to 'development'${NC}"
+  # git checkout development
+  echo -e "${PINK}STEP 7 of 7: Running deployment script"
+  npm run publish
   echo -e "${PINK}FINISHED LOCAL DEPLOYMENT TASKS${NC}"
-  echo -e "${PINK}Navigate to https://travis-ci.org/scvodigital/$REPO to watch your deployment in the cloud!${NC}"
+  # echo -e "${PINK}Navigate to https://travis-ci.com/github/scvodigital/$REPO to watch your deployment in the cloud!${NC}"
 elif [ $LOCAL = $BASE ]; then
   echo -e "${RED}CANNOT DEPLOY: Need to pull${NC}"
 elif [ $REMOTE = $BASE ]; then

old/common-styles.scss

@@ -19,7 +19,7 @@ $mobile-landscape-breakpoint: 959px;
 $desktop-landscape-breakpoint: 1280px;
 
 @import url('//cdnjs.cloudflare.com/ajax/libs/normalize/7.0.0/normalize.min.css');
-@import url('//fonts.googleapis.com/css?family=Montserrat:500,600,700|Open+Sans:400,500,600');
+@import url('//fonts.googleapis.com/css?family=Montserrat:500,600,700,800|Open+Sans:400,500,600');
 
 html {
   overflow-y: scroll;
@@ -763,7 +763,13 @@ a:hover {
 .provider-google.mdc-chip--selected,
 .provider-google.mdc-chip--selected:hover,
 #continue-with-google {
-  background-color: #DB3633 !important;
+  background-color: #4285F4 !important;
+}
+.chip.bg-google:focus,
+.chip.bg-google:hover,
+#continue-with-google:focus,
+#continue-with-google:hover {
+  background-color: #3367d6 !important;
 }
 .provider-twitter.mdc-chip--selected,
 .provider-twitter.mdc-chip--selected:hover,
@@ -773,7 +779,18 @@ a:hover {
 .provider-facebook.mdc-chip--selected,
 .provider-facebook.mdc-chip--selected:hover,
 #continue-with-facebook {
-  background-color: #2C5797 !important;
+  background-color: #17A9FD !important;
+}
+.social .fab.fa-facebook {
+  color: #17A9FD !important;
+  line-height: 1rem;
+  font-size: 1.05rem;
+}
+.chip.bg-facebook:focus,
+.chip.bg-facebook:hover,
+#continue-with-facebook:focus,
+#continue-with-facebook:hover {
+  background-color: #0165E1 !important;
 }
 
 .noselect {
@@ -985,7 +1002,7 @@ a {
   background-color: white;
   padding: $unit/3 $unit/2;
   box-sizing: border-box;
-  border-radius: 2px;
+  border-radius: 4px;
   a .mdc-list-item__graphic {
     margin-right: $unit/2;
   }
@@ -1057,7 +1074,7 @@ a {
 .mdc-card.mini,
 .mdc-card.gist,
 .mdc-card.search-result {
-  border-radius: 2px;
+  border-radius: 7.333px;
   position: relative;
   z-index: 1;
   width: 100%;
@@ -1228,6 +1245,7 @@ a {
   box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12);
   -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
   transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
+  will-change: opacity;
 }
 .mdc-card.list:hover::after,
 .mdc-card.mini:hover::after,
@@ -1281,7 +1299,7 @@ a {
   padding: $unit*(2/3) $unit;
   color: white;
   font-weight: 600;
-  border-radius: 2px 2px 0 0;
+  border-radius: 7.333px 7.333px 0 0;
 }
 .mdc-card.mini {
   .panel-heading {
@@ -1300,7 +1318,7 @@ a {
   .panel-heading {
     margin: $unit/2 0 $unit;
     padding: $unit/2;
-    border-radius: 2px;
+    border-radius: 7.333px;
     box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12);
   }
   .mdc-card__info--content-secondary-title {
@@ -1346,7 +1364,7 @@ a {
     }
   }
   #content-primary-tab-bar {
-    border-radius: 2px 2px 0 0;
+    border-radius: 7.333px 7.333px 0 0;
     .mdc-tab {
       flex: 1;
       line-height: $header-lower-height;
@@ -1360,7 +1378,7 @@ a {
     display: block;
   }
   .content-primary-info-container {
-    border-radius: 2px;
+    border-radius: 7.333px;
     background-color: white;
     box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12);
   }
@@ -1827,7 +1845,7 @@ body.shortlist {
     padding: 0 0 $unit;
     .mdc-card__media--content-secondary {
       line-height: 1;
-      border-radius: 2px;
+      border-radius: 7.333px;
       padding: $unit/2;
       box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
     }

old/components/map.js

@@ -40,11 +40,11 @@ export class MapComponent {
       trackResize: true
     }).setView([initialLat, initialLng], initialZoom);
     var osmAttrib = 'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>';
-    L.tileLayer('https://maps.wikimedia.org/osm-intl/{z}/{x}/{y}.png', {
-      attribution: osmAttrib,
-      minZoom: 6,
-      maxZoom: 18,
-      opacity: 0.8
+    L.tileLayer('https://c.tile.openstreetmap.org/{z}/{x}/{y}.png', {
+        attribution: osmAttrib,
+        minZoom: 5,
+        maxZoom: 17,
+        opacity: 0.9
     }).addTo(this.map);
     L.control.scale().addTo(this.map);
 

old/templates/scvo-bar.hbs

@@ -1,29 +1,32 @@
 <nav class="scvo-link-bar">
   <div class="container text-right">
     <ul>
-      <li>
-        <a class="text-link{{#if (contains @root.request.url.hostname 'scvo.')}} active{{/if}}" href="{{#unless (contains @root.request.url.hostname 'scvo.')}}https://scvo.org{{else}}/{{/unless}}" title="Scottish Council for Voluntary Organisations">SCVO</a>
+      <li class="brand-scvo">
+        <a class="text-link" href="https://scvo.scot">SCVO</a>
       </li>
-      <li>
-        <a class="text-link{{#ifAny (contains @root.request.url.hostname 'fundingscotland.') (contains @root.request.url.hostname 'fs-')}} active{{/ifAny}}" href="https://fundingscotland.com" title="Funding Scotland - Find funding for your charity, community group or social enterprise">Funding Scotland</a>
+      <li class="brand-scvo">
+        <a class="text-link" href="https://scvo.scot/membership">Membership</a>
       </li>
-      <li>
-        <a class="text-link{{#if (contains @root.request.url.hostname 'goodmoves.')}} active{{/if}}" href="https://goodmoves.com" title="Goodmoves - Charity and voluntary sector recruitment">Goodmoves</a>
+      <li class="brand-gathering">
+        <a class="text-link" href="https://scvo.scot/the-gathering" title="">Gathering</a>
       </li>
-      <li>
-        <a class="text-link{{#if (contains @root.request.url.hostname 'thirdforcenews.')}} active{{/if}}" href="https://thirdforcenews.org.uk" title="Third Force News - The voice of Scotland's third sector">TFN</a>
+      <li class="brand-awards">
+        <a class="text-link" href="https://scvo.scot/scottish-charity-awards" title="">Charity Awards</a>
       </li>
-      <li>
-        <a class="text-link" href="{{#unless (contains @root.request.url.hostname 'scvo.')}}https://scvo.org{{/unless}}/scottish-charity-awards" title="Scottish Charity Awards - Celebrating the amazing work that people within charities and community groups do every day">Scottish Charity Awards</a>
+      <li class="brand-fundingscotland">
+        <a class="text-link" href="https://funding.scot">Funding Scotland</a>
       </li>
-      {{!-- <li>
-        <a class="text-link" href="{{#unless (contains @root.request.url.hostname 'scvo.')}}https://scvo.org{{/unless}}/the-gathering-2020" title="The Gathering - Scotland's largest event for charities, social enterprises and voluntary organisations">The Gathering</a>
-      </li> --}}
-      <li>
-        <a class="pull-right brand-logo no-ext no-underline" href="{{#unless (contains @root.request.url.hostname 'scvo.')}}https://scvo.org{{else}}/{{/unless}}" title="Scottish Council for Voluntary Organisations">
+      <li class="brand-goodmoves">
+        <a class="text-link{{#if (contains @root.request.url.hostname 'goodmoves.')}} active{{/if}}" href="https://goodmoves.org">Goodmoves</a>
+      </li>
+      <li class="brand-tfn">
+        <a class="text-link" href="https://tfn.scot" title="Third Force News">TFN</a>
+      </li>
+      <li class="brand-scvo l-margin r-margin-full">
+        <a class="pull-right brand-logo no-ext no-underline" href="https://scvo.scot">
           <img src="{{~>asset_url url='images/logos/scvo-secondary.svg'}}" />
         </a>
       </li>
     </ul>
   </div>
-</nav>
+</nav>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@scvo/common",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "description": "Common JS components, CSS, and Templates used across our sites",
   "main": "build/component-manager.js",
   "scripts": {
@@ -53,6 +53,7 @@
     "bristles": "0.0.24",
     "firebase": "^7.0.0",
     "jquery": "^3.4.1",
+    "jquery-deserialize": "^2.0.0-rc1",
     "json-6": "^1.0.2",
     "json-logic-js": "^1.2.2",
     "leaflet": "^1.5.1",

quick

@@ -0,0 +1,9 @@
+#!/usr/bin/env bash
+
+npm run build
+git add .
+git commit -m "$2"
+git push
+cd "../$1"
+npm i --save-dev https://github.com/scvodigital/common.git
+cd ../common

src/component-manager.ts

@@ -4,6 +4,7 @@ import { LeafletMap } from './components/leaflet-map';
 import { Typeahead } from './components/typeahead';
 import { TasksTrigger } from './components/tasks-trigger';
 import { TaskRunner } from './task-runner/task-runner';
+import { FormBackup } from './components/form-backup';
 import { Bristles } from 'bristles';
 
 require('./components.scss');
@@ -12,7 +13,8 @@ export class ComponentManager {
   components: { [name: string]: any } = {
     LeafletMap,
     Typeahead,
-    TasksTrigger
+    TasksTrigger,
+    FormBackup
   };
   componentRegistry: ComponentRegistry = {};
   clock = window.requestAnimationFrame(this.tick.bind(this));