Merge pull request #2 from WorkoutLogs/update

Update
WorkoutLogs · Dec 24, 2023 · 46fc644 · 46fc644
2 parents 2f768c4 + f8536a9
commit 46fc644
Show file tree

Hide file tree

Showing 7 changed files with 95 additions and 28 deletions.
diff --git a/gatsby-config.js b/gatsby-config.js
@@ -13,5 +13,16 @@ module.exports = {
       "path": "./src/images/"
     },
     __key: "images"
+  }, {
+    resolve: `gatsby-plugin-manifest`,
+    options: {
+      name: `GatsbyJS`,
+      short_name: `GatsbyJS`,
+      start_url: `/`,
+      background_color: `#f7f0eb`,
+      theme_color: `#FF312E`,
+      display: `standalone`,
+      icon: 'src/assets/favicon.png'
+    },
   }]
 };
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -18,6 +18,7 @@
     "autoprefixer": "^10.4.16",
     "gatsby": "^5.12.4",
     "gatsby-plugin-image": "^3.12.3",
+    "gatsby-plugin-manifest": "^5.13.0",
     "gatsby-plugin-postcss": "^6.12.0",
     "gatsby-plugin-sharp": "^5.12.3",
     "gatsby-plugin-sitemap": "^6.12.3",

diff --git a/src/assets/favicon.png b/src/assets/favicon.png
diff --git a/src/html.js b/src/html.js
@@ -3,7 +3,7 @@ import PropTypes from "prop-types"
 
 export default function HTML(props) {
   return (
-    <html {...props.htmlAttributes}>
+    <html {...props.htmlAttributes} lang="en-US">
       <head>
         <meta charSet="utf-8" />
         <meta httpEquiv="x-ua-compatible" content="ie=edge" />

diff --git a/src/pages/index.js b/src/pages/index.js
@@ -2,9 +2,13 @@ import * as React from "react"
 import Layout from "../components/layout"
 import Header from "../components/header"
 import { GooglePlayButton } from 'react-mobile-app-button';
-import AppScreenshot from '../assets/app-screenshot.png';
 import Footer from "../components/footer";
 import Content from "../components/content";
+import { StaticImage } from "gatsby-plugin-image";
+
+const META_DESCRIPTION = "Get the best workout tracker android app for free";
+const TITLE = 'WorkoutLogs - Gym Tracker';
+const IMAGE = 'https://workoutlogs.github.io/icon.png';
 
 const IndexPage = () => {
   const GooglePlayUrl = "https://play.google.com/store/apps/details?id=com.reddyyz.WorkoutLogs";
@@ -29,17 +33,19 @@ const IndexPage = () => {
             </div>
           </div>
           <div className='flex-1 flex justify-center md:justify-start mt-8'>
-            <img
+            <StaticImage
               style={{
                 width: 275
               }}
               className="md:ml-8"
-              src={AppScreenshot}
+              src={'../assets/app-screenshot.png'}
+              alt='WorkoutLogs App Screenshot'
+              placeholder='blurred'
             />
           </div>
         </div>
         <div className="bg-white p-4">
-          <h1 className="text-2xl text-center mb-4 font-medium">App Functionalities</h1>
+          <h2 className="text-2xl text-center mb-4 font-medium">App Functionalities</h2>
           <p className="text-center mb-4">A simple workout tracker, developed by gym rats, for gym rats!</p>
           <ul className="list-disc list-inside self-center">
             <li>Track your workouts, record weight, reps, and RPE</li>
@@ -61,5 +67,23 @@ const IndexPage = () => {
 export default IndexPage
 
 export const Head = () => (
-  <title>WorkoutLogs - Gym Tracker</title>
+  <>
+    <title>{TITLE}</title>
+    <meta name="description" content={META_DESCRIPTION}/>
+    <link rel="canonical" href="https://workoutlogs.github.io"/>
+
+    <meta property="og:locale" content="en_US" />
+    <meta property="og:url" content="https://workoutlogs.github.io"/>
+    <meta property="og:type" content="website"/>
+    <meta property="og:title" content={TITLE} />
+    <meta property="og:description" content={META_DESCRIPTION} />
+    <meta property="og:image" content={IMAGE}/>
+
+    <meta name="twitter:card" content="summary_large_image"/>
+    <meta property="twitter:domain" content="workoutlogs.github.io"/>
+    <meta property="twitter:url" content="https://workoutlogs.github.io"/>
+    <meta name="twitter:title" content={TITLE}/>
+    <meta name="twitter:description" content={META_DESCRIPTION}/>
+    <meta name="twitter:image" content={IMAGE}/>
+  </>
 )
diff --git a/static/icon.png b/static/icon.png