baalajimaestro/personal-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Update headers and manifests

Browse source 
Signed-off-by: baalajimaestro <me@baalajimaestro.me>
This commit is contained in:
baalajimaestro 2024-07-14 18:50:08 +05:30
parent 71bc9478d0
commit 7a4335a986
Signed by: baalajimaestro
GPG key ID: F93C394FE9BBAFD5
13 changed files with 70 additions and 194 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
public/favicon.svg
View file

@ -1,29 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 128 128">
<g>
<path
d="M47.7 107.1c-5.5-5-7.2-15.7-4.9-23.4 4 4.9 9.6 6.4 15.4 7.3 8.9 1.3 17.6.8 25.9-3.2l2.8-1.7a18 18 0 0 1-7.2 20l-5.5 3.8c-5.6 3.8-7.2 8.2-5 14.7l.2.7a14 14 0 0 1-6.6-5.6 15.8 15.8 0 0 1-2.6-8.6c0-1.5 0-3-.2-4.5-.5-3.7-2.2-5.3-5.5-5.4-3.3-.1-5.9 2-6.6 5.2l-.2.7Z" />
<path
d="M16 82.4s16.5-8 33-8l12.4-38.3c.5-2 1.8-3.2 3.3-3.2 1.6 0 3 1.3 3.4 3.2l12.4 38.3c19.6 0 33 8 33 8l-28-76c-.8-2.3-2.2-3.7-4-3.7H48c-1.8 0-3.1 1.4-4 3.7l-28 76Z" />
</g>
<path fill="url(#a)"
d="M47.7 107.1c-5.5-5-7.2-15.7-4.9-23.4 4 4.9 9.6 6.4 15.4 7.3 8.9 1.3 17.6.8 25.9-3.2l2.8-1.7a18 18 0 0 1-7.2 20l-5.5 3.8c-5.6 3.8-7.2 8.2-5 14.7l.2.7a14 14 0 0 1-6.6-5.6 15.8 15.8 0 0 1-2.6-8.6c0-1.5 0-3-.2-4.5-.5-3.7-2.2-5.3-5.5-5.4-3.3-.1-5.9 2-6.6 5.2l-.2.7Z" />
<defs>
<linearGradient id="a" x1="64.7" x2="77.4" y1="119.2" y2="77.4" gradientUnits="userSpaceOnUse">
<stop stop-color="#D83333" />
<stop offset="1" stop-color="#F041FF" />
</linearGradient>
</defs>
<style>
g {
fill: #000;
}
@media (prefers-color-scheme: dark) {
g {
fill: #FFF;
}
}
</style>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 1.2 KiB

BIN
public/hero.jpg
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 4.6 KiB

BIN
public/lighthouse.jpg
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 17 KiB

BIN
public/preview.jpg
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 78 KiB

17
src/components/BaseHead.astro
View file

@ -1,8 +1,10 @@
---
import siteConfig from '@/site-config'
import { getImage } from 'astro:assets'
import '@/styles/global.css'
import '@/styles/prose.css'
import '@/styles/dot.css'
import faviconSrc from '../images/favicon.png'
interface Props {
title?: string
@ -26,6 +28,14 @@ const resolvedImage = image?.src
}
: undefined
const appleTouchIcon = await getImage({
src: faviconSrc,
width: 180,
height: 180,
format: 'png'
})
const faviconx = await getImage({ src: faviconSrc, format: 'png' })
const canonicalURL = new URL(Astro.request.url, Astro.site)
function formatCanonicalURL(url: string | URL) {
@ -41,9 +51,14 @@ function formatCanonicalURL(url: string | URL) {
<meta name="viewport" content="width=device-width,initial-scale=1" />
<title>{title}</title>
<meta name="generator" content={Astro.generator} />
<meta name="darkreader-lock">
<!-- Low Priority Global Metadata -->
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<link rel="icon" href="/favicon.ico" sizes="32x32" />
<link rel="icon" href={faviconx.src} type="image/png" />
<link rel="apple-touch-icon" href={appleTouchIcon.src} />
<link rel="manifest" href="/manifest.json" />
<link rel="sitemap" href="/sitemap-index.xml" />
<link rel="alternate" type="application/rss+xml" href="/rss.xml" title="RSS" />

11
src/components/Header.vue
View file

@ -4,6 +4,8 @@ import { computed, onMounted, ref, unref } from 'vue'
import ThemeToggle from './ThemeToggle.vue'
import siteConfig from '@/site-config'
import { getLinkTarget } from '@/utils/link'
import { getImage } from 'astro:assets'
import faviconSrc from '../images/favicon.png'
const navLinks = siteConfig.header.navLinks || []
@ -26,6 +28,8 @@ const { y: scroll } = useWindowScroll()
const oldScroll = ref(unref(scroll))
const faviconx = await getImage({ src: faviconSrc, format: 'png' })
onMounted(() => {
const navMask = document.querySelector('.nav-drawer-mask') as HTMLElement
@ -81,7 +85,7 @@ function toggleNavDrawer() {
>
<div class="flex items-center h-full">
<a href="/" mr-6 aria-label="Header Logo Image">
<img width="32" height="32" :src="siteConfig.header.logo.src" :alt="siteConfig.header.logo.alt">
<img width="32" height="32" :src="faviconx.src" :alt="siteConfig.header.logo.alt">
</a>
<nav class="sm:flex hidden flex-wrap gap-x-6 position-initial flex-row">
<a
@ -96,11 +100,6 @@ function toggleNavDrawer() {
</div>
</div>
<div class="flex gap-x-6">
<a
v-for="link in socialLinks" :key="link.text" :aria-label="`${link.text}`" :class="link.icon" nav-link
:target="getLinkTarget(link.href)" :href="link.href"
/>
<a nav-link target="_blank" href="/rss.xml" i-ri-rss-line aria-label="RSS" />
<ThemeToggle />
</div>

1
src/components/ListPosts.vue
View file

@ -61,7 +61,6 @@ function getYear(date: Date | string | number) {
<span v-if="post.tags && post.tags.length">· {{ post.tags[0].name }}</span>
</div>
</div>
<div opacity-50 text-sm>{{ post.excerpt }}</div>
</a>
</li>
</ul>

BIN
src/images/favicon.png Executable file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1,005 KiB

1
src/layouts/BaseLayout.astro
View file

@ -12,7 +12,6 @@ const { ...head } = Astro.props
<!doctype html>
<html lang="en">
<head>
<meta name="darkreader-lock">
<BaseHead {...head} />
<ViewTransitions />
</head>

45
src/pages/manifest.json.astro Normal file
View file

@ -0,0 +1,45 @@
---
import type { APIRoute } from 'astro'
import { getImage } from 'astro:assets'
import favicon from '../images/favicon.png'
import siteConfig from '@/site-config'
const faviconPngSizes = [192, 512]
export const GET: APIRoute = async () => {
const icons = await Promise.all(
faviconPngSizes.map(async (size) => {
const image = await getImage({
src: favicon,
width: size,
height: size,
format: 'png'
})
return {
src: image.src,
type: `image/${image.options.format}`,
sizes: `${image.options.width}x${image.options.height}`
}
})
)
const manifest = {
name: siteConfig.title,
short_name: siteConfig.title.split(' ')[0],
description: siteConfig.description,
start_url: '/',
display: 'standalone',
background_color: '#ffffff',
theme_color: '#000000',
id: "https://baalajimaestro.ptr.moe/",
icons
}
return new Response(JSON.stringify(manifest), {
status: 200,
headers: {
'Content-Type': 'application/json'
}
})
}
---

88
src/pages/projects/data.ts
View file

@ -1,88 +0,0 @@
import type { ProjectData } from '@/types'
export const projectData: ProjectData = [
{
title: 'Projects Group',
projects: [
{
text: 'Project Name',
description: 'Your project description information is a long piece of text.',
icon: 'i-carbon-campsite',
href: '/',
},
{
text: 'Project Name',
description: 'Your project description information is a long piece of text.',
icon: 'i-carbon-campsite',
href: '/',
},
],
},
{
title: 'Projects Group',
projects: [
{
text: 'Project Name',
description: 'Your project description information is a long piece of text.',
icon: 'i-carbon-campsite',
href: '/',
},
{
text: 'Project Name',
description: 'Your project description information is a long piece of text.',
icon: 'i-carbon-campsite',
href: '/',
},
{
text: 'Project Name',
description: 'Your project description information is a long piece of text.',
icon: 'i-carbon-campsite',
href: '/',
},
],
},
{
title: 'Project Name',
projects: [],
},
{
title: 'Projects Group',
projects: [
{
text: 'Project Name',
description: 'Your project description information is a long piece of text.',
icon: 'i-carbon-campsite',
href: '/',
},
{
text: 'Project Name',
description: 'Your project description information is a long piece of text.',
icon: 'i-carbon-campsite',
href: '/',
},
{
text: 'Project Name',
description: 'Your project description information is a long piece of text.',
icon: 'i-carbon-campsite',
href: '/',
},
{
text: 'Project Name',
description: 'Your project description information is a long piece of text.',
icon: 'i-carbon-campsite',
href: '/',
},
],
},
{
title: 'Projects Group',
projects: [
{
text: 'Project Name',
description: 'Your project description information is a long piece of text.',
icon: 'i-carbon-campsite',
href: '/',
},
],
},
]

27
src/pages/projects/index.astro
View file

@ -1,27 +0,0 @@
---
import { projectData } from './data'
import BaseLayout from '@/layouts/BaseLayout.astro'
import ListProjects from '@/components/ListProjects.vue'
---
<BaseLayout title="Projects" description="List of projects that I am proud of">
<h1 class="mb-10 text-title">Projects</h1>
<div mb-16 sm:mb-24>
{
projectData.length > 0 && (
<div>
{projectData.map((i) => (
<div mb-10>
<h2 class="select-none relative h20 pointer-events-none">
<span class="text-3.2em color-transparent font-bold text-stroke-1.5 text-stroke-hex-aaa op35 dark:op20 absolute top-0">
{i.title}
</span>
</h2>
<ListProjects list={i.projects} />
</div>
))}
</div>
)
}
</div>
</BaseLayout>

45
src/site-config.ts
View file

@ -1,56 +1,19 @@
export const siteConfig = {
author: 'baalajimaestro',
title: 'baalajimaestro',
subtitle: 'Personal Website & Blog for baalajimaestro',
description: 'DevOps Engineer and Networking Enthusiast.',
image: {
src: '/hero.jpg',
alt: 'Website Main Image',
},
subtitle: 'DevOps Engineer and Networking Enthusiast.',
description: 'Personal Website & Blog for baalajimaestro',
email: 'baalajimaestro@ptr.moe',
socialLinks: [
{
text: 'GitHub',
href: '',
icon: 'i-simple-icons-github',
header: 'i-ri-github-line',
},
{
text: 'Twitter',
href: '',
icon: 'i-simple-icons-x',
header: 'i-ri-twitter-x-line',
},
{
text: 'Linkedin',
href: '',
icon: 'i-simple-icons-linkedin',
},
{
text: 'Instagram',
href: '',
icon: 'i-simple-icons-instagram',
},
{
text: 'Youtube',
href: '',
icon: 'i-simple-icons-youtube',
},
],
header: {
logo: {
src: '/favicon.svg',
src: '/images/favicon.png',
alt: 'Logo Image',
},
navLinks: [
{
text: 'Blog',
href: '/blog',
},
{
text: 'Projects',
href: '/projects',
},
}
],
},
page: {