refactor(metaInfo): added meta tags and information.

nuxt.config.js

@@ -10,10 +10,50 @@ export default {
 		meta: [
 			{ charset: 'utf-8' },
 			{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
-			{ hid: 'description', name: 'description', content: '' },
+			{
+				hid: 'description',
+				name: 'description',
+				content: 'A single page web app to help yours day-to-day tasks',
+			},
 			{ name: 'format-detection', content: 'telephone=no' },
+			// Twitter meta tags
+			{
+				hid: 'twitter:card',
+				name: 'twitter:card',
+				content: 'summary',
+			},
+			{
+				hid: 'twitter:title',
+				name: 'twitter:title',
+				content: 'ToToday',
+			},
+			{
+				hid: 'twitter:image',
+				name: 'twitter:image',
+				content: '/favicon.ico',
+			},
+			{
+				hid: 'twitter:description',
+				name: 'twitter:description',
+				content: 'A single page web app to help yours day-to-day tasks',
+			},
+			{
+				hid: 'twitter:creator',
+				name: 'twitter:creator',
+				content: '@Guz013_',
+			},
+		],
+		link: [
+			{
+				rel: 'icon',
+				type: 'image/x-icon',
+				href: '/favicon.ico',
+			},
+			{
+				rel: 'canonical',
+				href: 'https://totoday.vercel.app',
+			},
 		],
-		link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }],
 	},
 
 	// Global CSS: https://go.nuxtjs.dev/config-css
@@ -44,11 +84,24 @@ export default {
 
 	// PWA module configuration: https://go.nuxtjs.dev/pwa
 	pwa: {
+		meta: {
+			twitterCard: 'summary',
+			twitterCreator: '@Guz013_',
+		},
 		manifest: {
+			name: 'ToToday',
+			description: 'A single page web app to help yours day-to-day tasks',
+			theme_color: 'dark',
+			background_color: '#1a1826',
 			lang: 'en',
 		},
 	},
 
+	// Color Mode module configuration: https://color-mode.nuxtjs.org/
+	colorMode: {
+		preference: 'dark',
+	},
+
 	image: {
 		screens: {
 			ToTodayLogoLg: 250,

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "ToToday",
-	"version": "0.7.2",
+	"version": "0.7.3",
 	"private": true,
 	"scripts": {
 		"dev": "nuxt",

src/components/PageFooter.vue

@@ -1,14 +1,30 @@
 <template>
 	<div class="footer">
 		<p>
-			Version: {{ version }} {{ storage_updated }}
+			<span class="debugInfo">
+				Version: {{ version }} - Updated: {{ storage_updated }} -
+			</span>
 			<br />
-			<a href="http://github.com/ProjectLored/ToToday.app" target="_blank">
-				(c) 2022 Lored &bull; MIT License
+			(c) 2022
+			<a
+				href="https://github.com/LoredDev"
+				target="_blank"
+				rel="noreferrer"
+				itemtype="https://schema.org/brand"
+			>
+				Lored
 			</a>
-			<br />
-			Icons provided by
-			<a href="https://iconoir.com/" target="_blank"> Iconoir </a>
+			&bull;
+			<a
+				href="https://github.com/LoredDev/ToToday.app/blob/dev/LICENSE"
+				target="_blank"
+				rel="noreferrer"
+				itemtype="https://schema.org/license"
+			>
+				MIT License
+			</a>
+			&bull; Icons provided by
+			<a href="https://iconoir.com/" target="_blank"> Iconoir</a>
 		</p>
 	</div>
 </template>
@@ -24,7 +40,7 @@ export default Vue.extend({
 		return {
 			version: appInfo.version,
 			storage_updated: sm.get('date.updated', true)
-				? `- Storage Updated: ${sm.get('date.updated', true).day.readable} ${
+				? `${sm.get('date.updated', true).day.readable} ${
 						sm.get('date.updated', true).hour.readable
 				  }`
 				: '',
@@ -33,7 +49,7 @@ export default Vue.extend({
 	mounted() {
 		window.addEventListener('localStorage-changed', () => {
 			this.storage_updated = sm.get('date.updated', true)
-				? `- Storage Updated: ${sm.get('date.updated', true).day.readable} ${
+				? `${sm.get('date.updated', true).day.readable} ${
 						sm.get('date.updated', true).hour.readable
 				  }`
 				: '';
@@ -49,7 +65,6 @@ export default Vue.extend({
 .footer {
 	@include link;
 
-	position: fixed;
 	bottom: 0;
 	left: 0;
 	width: 100vw;
@@ -63,5 +78,9 @@ export default Vue.extend({
 	.dark-mode & {
 		color: $dark-secondary;
 	}
+
+	.debugInfo {
+		font-size: 0.8em;
+	}
 }
 </style>

src/components/ToTodayLogo.vue

@@ -1,5 +1,5 @@
 <template>
-	<picture>
+	<picture itemscope itemtype="https://schema.org/logo">
 		<nuxt-img
 			class="light-mode-element"
 			src="/images/ToToday-dark-alpha.svg"