windate3411

var grammar = '#JSGF V1.0; grammar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thistle | tomato | turquoise | violet | white | yellow ;'
var recognition = new SpeechRecognition();
var speechRecognitionList = new SpeechGrammarList();
speechRecognitionList.addFromString(grammar, 1);
recognition.grammars = speechRecognitionList;
//recognition.continuous = false;
recognition.lang = 'en-US';
recognition.interimResults = false;
recognition.maxAlternatives = 1;

windate3411

// index.html
<svg class="img-container" height="250" width="200">
      <!-- the hanger -->
      <line x1="60" y1="20" x2="140" y2="20"></line>
      <line x1="140" y1="20" x2="140" y2="50"></line>
      <line x1="60" y1="20" x2="60" y2="230"></line>
      <line x1="20" y1="230" x2="100" y2="230"></line>

      <!-- Head -->
      <circle cx="140" cy="70" r="20" class="body-parts"></circle>

windate3411

// src/components/LineChart.vue

<script>
import { Line } from 'vue-chartjs'

export default {
  extends: Line,
  props: ['chartdata', 'options'],
  mounted() {
    this.renderChart(this.chartdata, this.options)

windate3411

src/components/BarChart.vue

<script>
import { Bar } from 'vue-chartjs'

export default {
  extends: Bar,
  mounted() {
    this.renderChart({
      labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],

windate3411

options: {
        responsive: true,
        maintainAspectRatio: false
      }

windate3411

 lineChartData: {
        labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
        datasets: [
          {
            label: 'Weight track',
            backgroundColor: "transparent",
            data: [75, 75.6, 77.8, 78.1, 79.1, 80, 78.5],
            borderColor: "rgba(1, 116, 188, 0.50)",
            pointBackgroundColor: "rgba(171, 71, 188, 1)"
          }

windate3411

import Vue from 'vue'
import VueRouter from 'vue-router'
import NotFound from '../views/NotFound.vue'

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    name: 'home',

windate3411

<template>
  <div>
    <div class="containers d-flex flex-column align-items-center justify-content-center">
      <h1>
        4
        <span></span>
        4
      </h1>
      <p>The page you are looking for might have been remove had it's name changed or its temporaily unavailable</p>
      <router-link to="/" class="btn btn-primary">

windate3411

//deploy.sh
set -e

npm run build

cd dist

git init
git add -A
git commit -m 'deploy'

windate3411

//vue.config.js 
module.exports = {
  publicPath: process.env.NODE_ENV === 'production'
    ? '/vue-calculator/'
    : '/'
}