41 lines
2.0 KiB
Vue
41 lines
2.0 KiB
Vue
<script setup lang="ts">
|
|
import { onMounted } from 'vue';
|
|
import { useSEO } from '../composables/useSEO';
|
|
import { useStructuredData } from '../composables/useStructuredData';
|
|
|
|
const { addBreadcrumbSchema } = useStructuredData();
|
|
|
|
onMounted(() => {
|
|
useSEO({
|
|
title: 'About Us - Our Mission & Story',
|
|
description: 'Learn about Spritesheet Generator, a free tool designed to help game developers and artists streamline their workflow with optimized spritesheet creation.',
|
|
url: '/about',
|
|
type: 'website',
|
|
keywords: 'about spritesheet generator, game development tools, open source sprite editor'
|
|
});
|
|
|
|
addBreadcrumbSchema([
|
|
{ name: 'Home', url: '/' },
|
|
{ name: 'About Us', url: '/about' }
|
|
]);
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div class="w-full">
|
|
<div class="bg-white/80 dark:bg-gray-900/80 backdrop-blur-md rounded-3xl shadow-2xl border border-gray-200/50 dark:border-gray-700/50 p-8 sm:p-12">
|
|
<h1 class="text-3xl sm:text-4xl font-extrabold text-gray-900 dark:text-white mb-6">About Us</h1>
|
|
<div class="space-y-6">
|
|
<p class="text-gray-700 dark:text-gray-300 leading-relaxed">Welcome to Spritesheet Generator, a tool designed to help game developers and artists streamline their workflow.</p>
|
|
<p class="text-gray-700 dark:text-gray-300 leading-relaxed">
|
|
Our mission is to provide a simple, powerful, and free tool for creating optimized spritesheets directly in your browser. Whether you are an indie developer, a hobbyist, or part of a large studio, we hope this tool makes your life easier.
|
|
</p>
|
|
<div class="space-y-3">
|
|
<h3 class="text-xl font-bold text-gray-900 dark:text-white">Our Story</h3>
|
|
<p class="text-gray-700 dark:text-gray-300 leading-relaxed">This project started as a small utility for personal game jams and has grown into a full-featured spritesheet packer. We believe in open source and community-driven development.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|