atash/atashdotdev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixed some wording
All checks were successful
Build and Deploy / build-and-push (push) Successful in 2m54s
Details

Browse Source
This commit is contained in:
Atridad Lahiji
2025-12-20 00:56:32 -07:00
parent 0297d0a8ef
commit 6ca843a4f8
10 changed files with 819 additions and 387 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
astro.config.mjs
View File

@@ -7,9 +7,11 @@ import node from "@astrojs/node";
import tailwindcss from "@tailwindcss/vite";
import icon from "astro-icon";
// https://astro.build/config
export default defineConfig({
integrations: [solidJs()],
integrations: [solidJs(), icon()],
adapter: node({
mode: "standalone",

3
package.json
View File

@@ -14,11 +14,14 @@
"@astrojs/solid-js": "^5.1.3",
"@tailwindcss/vite": "^4.1.18",
"astro": "^5.16.6",
"astro-icon": "^1.1.5",
"nodemailer": "^7.0.11",
"solid-heroicons": "^3.2.4",
"solid-js": "^1.9.10",
"tailwindcss": "^4.1.18"
},
"devDependencies": {
"@iconify-json/heroicons": "^1.2.3",
"@types/node": "^25.0.3",
"@types/nodemailer": "^7.0.4",
"daisyui": "^5.5.14"

769
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

4
src/components/Footer.astro
View File

@@ -25,8 +25,8 @@ import { siteConfig } from "../config/site";
</div>
<div class="border-t border-neutral-content/10 py-6">
<p class="text-center text-neutral-content/60 text-sm">
<span class="sr-only">Copyright</span>
© {new Date().getFullYear()} {siteConfig.name}. All rights reserved.
<span class="sr-only">{siteConfig.footer.copyright}</span>
© {new Date().getFullYear()} {siteConfig.name}. {siteConfig.footer.rights}
</p>
</div>
</div>

20
src/components/Header.astro
View File

@@ -1,26 +1,14 @@
---
import { siteConfig } from "../config/site";
import { Icon } from "astro-icon/components";
---
<header class="sticky top-0 z-50 backdrop-blur-lg bg-base-100/80 border-b border-base-200" role="banner">
<div class="navbar max-w-7xl mx-auto px-4 lg:px-6">
<div class="navbar-start">
<div class="dropdown">
<div tabindex="0" role="button" class="btn btn-ghost btn-circle lg:hidden">
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
aria-hidden="true"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M4 6h16M4 12h8m-8 6h16"></path>
</svg>
<div tabindex="0" role="button" class="btn btn-ghost btn-circle lg:hidden" aria-label="Open menu">
<Icon name="heroicons:bars-3-bottom-left" class="h-5 w-5" />
</div>
<ul
tabindex="0"
@@ -45,7 +33,7 @@ import { siteConfig } from "../config/site";
>
<img src="/logo.svg" alt="" class="h-8 w-8" aria-hidden="true" />
<span class="hidden sm:inline">{siteConfig.header.logo.text}</span>
<span class="sm:hidden">Atash</span>
<span class="sm:hidden">{siteConfig.header.mobileLogoText}</span>
</a>
</div>
<nav class="navbar-center hidden lg:flex" aria-label="Main navigation">

91
src/components/sections/AboutSection.astro
View File

@@ -1,52 +1,61 @@
---
import { Icon } from "astro-icon/components";
import { siteConfig } from "../../config/site";
const features = [
{
icon: "heroicons:bolt",
...siteConfig.whyUs.cards[0],
},
{
icon: "heroicons:check-circle",
...siteConfig.whyUs.cards[1],
},
{
icon: "heroicons:users",
...siteConfig.whyUs.cards[2],
},
];
---
<section id="about" class="py-20 lg:py-28">
<div class="max-w-7xl mx-auto px-6">
<div class="text-center mb-16">
<span class="badge badge-secondary badge-lg font-semibold mb-4">Why Us</span>
<span class="badge badge-secondary badge-lg font-semibold mb-4">{siteConfig.whyUs.badge}</span>
<h2 class="text-3xl lg:text-4xl font-bold text-base-content mb-4">
Why Choose Atash Consulting?
{siteConfig.whyUs.title}
</h2>
<p class="text-lg text-base-content/60 max-w-2xl mx-auto">
With over a decade of experience in the software industry, we bring deep
technical expertise and a commitment to excellence to every project.
</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<div class="group text-center p-8 rounded-2xl bg-base-100 border border-base-300/50 hover:border-primary/30 hover:shadow-xl transition-all duration-300">
<div class="w-16 h-16 bg-primary/10 rounded-2xl flex items-center justify-center mx-auto mb-6 group-hover:scale-110 transition-transform duration-300">
<svg class="w-8 h-8 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path>
</svg>
</div>
<h3 class="text-xl font-bold text-base-content mb-3">Fast Delivery</h3>
<p class="text-base-content/60 leading-relaxed">
Quick turnaround without compromising quality
</p>
</div>
<div class="group text-center p-8 rounded-2xl bg-base-100 border border-base-300/50 hover:border-secondary/30 hover:shadow-xl transition-all duration-300">
<div class="w-16 h-16 bg-secondary/10 rounded-2xl flex items-center justify-center mx-auto mb-6 group-hover:scale-110 transition-transform duration-300">
<svg class="w-8 h-8 text-secondary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
</div>
<h3 class="text-xl font-bold text-base-content mb-3">Quality Assured</h3>
<p class="text-base-content/60 leading-relaxed">
Rigorous testing and quality control processes
</p>
</div>
<div class="group text-center p-8 rounded-2xl bg-base-100 border border-base-300/50 hover:border-accent/30 hover:shadow-xl transition-all duration-300">
<div class="w-16 h-16 bg-accent/10 rounded-2xl flex items-center justify-center mx-auto mb-6 group-hover:scale-110 transition-transform duration-300">
<svg class="w-8 h-8 text-accent" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"></path>
</svg>
</div>
<h3 class="text-xl font-bold text-base-content mb-3">Expert Support</h3>
<p class="text-base-content/60 leading-relaxed">
Ongoing support and maintenance services
</p>
</div>
{
features.map((feature) => (
<div class="group text-center p-8 rounded-2xl bg-base-100 border border-base-300/50 hover:border-primary/30 hover:shadow-xl transition-all duration-300">
<div
class={`w-16 h-16 rounded-2xl flex items-center justify-center mx-auto mb-6 group-hover:scale-110 transition-transform duration-300
${feature.variant === "primary" ? "bg-primary/10" : ""}
${feature.variant === "secondary" ? "bg-secondary/10" : ""}
${feature.variant === "accent" ? "bg-accent/10" : ""}
`}
>
<Icon
name={feature.icon}
class={`w-8 h-8
${feature.variant === "primary" ? "text-primary" : ""}
${feature.variant === "secondary" ? "text-secondary" : ""}
${feature.variant === "accent" ? "text-accent" : ""}
`}
/>
</div>
<h3 class="text-xl font-bold text-base-content mb-3">
{feature.title}
</h3>
<p class="text-base-content/60 leading-relaxed">
{feature.content}
</p>
</div>
))
}
</div>
<div class="mt-20 p-8 lg:p-12 rounded-2xl bg-gradient-to-br from-neutral to-neutral/90">

122
src/components/sections/ContactSection.tsx
View File

@@ -1,5 +1,13 @@
import { createSignal, type Component } from "solid-js";
import { Show } from "solid-js/web";
import { Icon } from "solid-heroicons";
import {
xCircle,
checkCircle,
paperAirplane,
envelope,
} from "solid-heroicons/outline";
import { siteConfig } from "../../config/site";
const ContactSection: Component = () => {
const [firstName, setFirstName] = createSignal("");
@@ -64,13 +72,10 @@ ${message()}`,
<section id="contact" class="py-20 lg:py-28 bg-base-200/50">
<div class="max-w-7xl mx-auto px-6">
<div class="text-center mb-16">
<span class="badge badge-accent badge-lg font-semibold mb-4">Contact</span>
<span class="badge badge-accent badge-lg font-semibold mb-4">{siteConfig.contact.badge}</span>
<h2 class="text-3xl lg:text-4xl font-bold text-base-content mb-4">
Get In Touch
{siteConfig.contact.mainTitle}
</h2>
<p class="text-lg text-base-content/60 max-w-2xl mx-auto">
Ready to start your project? Let's discuss how we can help.
</p>
</div>
<div class="max-w-2xl mx-auto">
@@ -80,7 +85,7 @@ ${message()}`,
<div class="grid grid-cols-1 md:grid-cols-2 gap-5">
<fieldset class="fieldset">
<legend class="fieldset-legend text-sm font-semibold text-base-content">
First Name *
{siteConfig.contact.form.firstName}
</legend>
<input
type="text"
@@ -90,12 +95,12 @@ ${message()}`,
value={firstName()}
onInput={(e) => setFirstName(e.currentTarget.value)}
disabled={status() === "sending"}
placeholder="John"
placeholder={siteConfig.contact.form.placeholders.firstName}
/>
</fieldset>
<fieldset class="fieldset">
<legend class="fieldset-legend text-sm font-semibold text-base-content">
Last Name *
{siteConfig.contact.form.lastName}
</legend>
<input
type="text"
@@ -105,14 +110,14 @@ ${message()}`,
value={lastName()}
onInput={(e) => setLastName(e.currentTarget.value)}
disabled={status() === "sending"}
placeholder="Doe"
placeholder={siteConfig.contact.form.placeholders.lastName}
/>
</fieldset>
</div>
<fieldset class="fieldset">
<legend class="fieldset-legend text-sm font-semibold text-base-content">
Email Address *
{siteConfig.contact.form.email}
</legend>
<input
type="email"
@@ -122,13 +127,13 @@ ${message()}`,
value={email()}
onInput={(e) => setEmail(e.currentTarget.value)}
disabled={status() === "sending"}
placeholder="john@example.com"
placeholder={siteConfig.contact.form.placeholders.email}
/>
</fieldset>
<fieldset class="fieldset">
<legend class="fieldset-legend text-sm font-semibold text-base-content">
Company
{siteConfig.contact.form.company}
</legend>
<input
type="text"
@@ -137,59 +142,58 @@ ${message()}`,
value={company()}
onInput={(e) => setCompany(e.currentTarget.value)}
disabled={status() === "sending"}
placeholder="Your company name (optional)"
placeholder={siteConfig.contact.form.placeholders.company}
/>
</fieldset>
<div class="grid grid-cols-1 md:grid-cols-2 gap-5">
<fieldset class="fieldset">
<legend class="fieldset-legend text-sm font-semibold text-base-content">
Service Needed
{siteConfig.contact.form.service}
</legend>
<select
name="service"
aria-label="Service Needed"
class="select select-bordered w-full bg-base-100 focus:border-primary focus:outline-primary"
value={service()}
onChange={(e) => setService(e.currentTarget.value)}
disabled={status() === "sending"}
>
<option value="">Select a service...</option>
<option value="web-development">Web Development</option>
<option value="mobile-development">Mobile App Development</option>
<option value="devops">DevOps</option>
<option value="it-support">IT Support Processes</option>
<option value="consultation">General Consultation</option>
<option value="">{siteConfig.contact.form.selectPlaceholders.service}</option>
{siteConfig.contact.form.services.map((s) => (
<option value={s.value}>{s.label}</option>
))}
</select>
</fieldset>
<fieldset class="fieldset">
<legend class="fieldset-legend text-sm font-semibold text-base-content">
Project Budget
{siteConfig.contact.form.budget}
</legend>
<select
name="budget"
aria-label="Project Budget"
class="select select-bordered w-full bg-base-100 focus:border-primary focus:outline-primary"
value={budget()}
onChange={(e) => setBudget(e.currentTarget.value)}
disabled={status() === "sending"}
>
<option value="">Select budget range...</option>
<option value="under-5k">Under $5,000</option>
<option value="5k-15k">$5,000 - $15,000</option>
<option value="15k-50k">$15,000 - $50,000</option>
<option value="50k-plus">$50,000+</option>
<option value="">{siteConfig.contact.form.selectPlaceholders.budget}</option>
{siteConfig.contact.form.budgets.map((b) => (
<option value={b.value}>{b.label}</option>
))}
</select>
</fieldset>
</div>
<fieldset class="fieldset">
<legend class="fieldset-legend text-sm font-semibold text-base-content">
Project Details *
{siteConfig.contact.form.message}
</legend>
<textarea
id="project-details"
name="message"
class="textarea textarea-bordered h-36 w-full resize-none bg-base-100 focus:border-primary focus:outline-primary"
placeholder="Tell me about your project requirements, timeline, and any specific needs..."
placeholder={siteConfig.contact.form.placeholders.message}
required
value={message()}
onInput={(e) => setMessage(e.currentTarget.value)}
@@ -199,41 +203,17 @@ ${message()}`,
<Show when={status() === "error"}>
<div role="alert" class="alert alert-error">
<svg
xmlns="http://www.w3.org/2000/svg"
class="stroke-current shrink-0 h-5 w-5"
fill="none"
viewBox="0 0 24 24"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z"
/>
</svg>
<Icon path={xCircle} class="stroke-current shrink-0 h-5 w-5" />
<span class="text-sm">
{errorMessage() || "Error sending message. Please try again."}
{errorMessage() || siteConfig.contact.form.error}
</span>
</div>
</Show>
<Show when={status() === "success"}>
<div role="alert" class="alert alert-success">
<svg
xmlns="http://www.w3.org/2000/svg"
class="stroke-current shrink-0 h-5 w-5"
fill="none"
viewBox="0 0 24 24"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"
/>
</svg>
<span class="text-sm">Message sent successfully! We'll get back to you soon.</span>
<Icon path={checkCircle} class="stroke-current shrink-0 h-5 w-5" />
<span class="text-sm">{siteConfig.contact.form.success}</span>
</div>
</Show>
@@ -245,24 +225,12 @@ ${message()}`,
{status() === "sending" ? (
<>
<span class="loading loading-spinner loading-sm"></span>
Sending...
{siteConfig.contact.form.sending}
</>
) : (
<>
<svg
class="w-5 h-5"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M12 19l9 2-9-18-9 18 9-2zm0 0v-8"
></path>
</svg>
Send Message
<Icon path={paperAirplane} class="w-5 h-5" />
{siteConfig.contact.form.submit}
</>
)}
</button>
@@ -271,15 +239,13 @@ ${message()}`,
</div>
<div class="mt-10 text-center">
<p class="text-base-content/60 mb-4">Prefer to reach out directly?</p>
<p class="text-base-content/60 mb-4">{siteConfig.contact.direct.text}</p>
<a
href="mailto:contact@atash.dev"
class="link link-primary font-medium inline-flex items-center gap-2 hover:gap-3 transition-all"
href={`mailto:${siteConfig.contact.direct.email}`}
class="link font-medium inline-flex items-center gap-2 hover:gap-3 transition-all text-base-content hover:text-primary"
>
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
</svg>
contact@atash.dev
<Icon path={envelope} class="w-5 h-5" />
{siteConfig.contact.direct.email}
</a>
</div>
</div>

71
src/components/sections/HeroSection.astro
View File

@@ -1,5 +1,6 @@
---
import { siteConfig } from "../../config/site";
import { Icon } from "astro-icon/components";
---
<section class="relative overflow-hidden bg-neutral">
@@ -12,19 +13,14 @@ import { siteConfig } from "../../config/site";
<span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-success opacity-75"></span>
<span class="relative inline-flex rounded-full h-2 w-2 bg-success"></span>
</span>
Accepting new clients
{siteConfig.hero.badge}
</div>
<h1 class="text-4xl sm:text-5xl lg:text-6xl xl:text-7xl font-extrabold text-white leading-tight tracking-tight mb-6">
Building
Digital Solutions
<br class="hidden sm:block" />
That Drive Growth
<h1 class="text-4xl sm:text-5xl lg:text-6xl xl:text-7xl font-extrabold text-white leading-tight tracking-tight mb-6" set:html={siteConfig.hero.mainTitle.replace("Digital Solutions", "Digital Solutions<br class='hidden sm:block' />")}>
</h1>
<p class="text-lg sm:text-xl text-white/70 max-w-2xl mx-auto mb-10 leading-relaxed">
{siteConfig.hero.description}. Delivering reliable, scalable
solutions tailored to your business needs.
{siteConfig.hero.description}. {siteConfig.hero.subDescription}
</p>
<div class="flex flex-col sm:flex-row gap-4 justify-center items-center">
@@ -32,62 +28,33 @@ import { siteConfig } from "../../config/site";
href="#contact"
class="btn btn-accent btn-lg shadow-lg shadow-accent/25 hover:shadow-xl hover:shadow-accent/30 hover:-translate-y-0.5 transition-all duration-300 group"
>
<svg
<Icon
name="heroicons:bolt"
class="w-5 h-5 transition-transform group-hover:rotate-12"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M13 10V3L4 14h7v7l9-11h-7z"></path>
</svg>
Start Your Project
/>
{siteConfig.hero.cta}
</a>
<a
href="#services"
class="btn btn-outline btn-lg border-white/30 text-white hover:bg-white hover:text-neutral hover:border-white transition-all duration-300"
>
<svg
<Icon
name="heroicons:chevron-down"
class="w-5 h-5"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M19 9l-7 7-7-7"></path>
</svg>
Explore Services
/>
{siteConfig.hero.secondaryCta}
</a>
</div>
<div class="mt-16 pt-10">
<p class="text-white text-sm mb-6 uppercase tracking-wider font-medium">Trusted expertise in</p>
<p class="text-white text-sm mb-6 uppercase tracking-wider font-medium">{siteConfig.hero.trustedText}</p>
<div class="flex flex-wrap justify-center items-center gap-8 lg:gap-12">
<div class="flex items-center gap-2.5 text-white/80">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
</svg>
<span class="font-medium">Web Development</span>
</div>
<div class="flex items-center gap-2.5 text-white/80">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 18h.01M8 21h8a2 2 0 002-2V5a2 2 0 00-2-2H8a2 2 0 00-2 2v14a2 2 0 002 2z"></path>
</svg>
<span class="font-medium">Mobile Apps</span>
</div>
<div class="flex items-center gap-2.5 text-white/80">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z"></path>
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"></path>
</svg>
<span class="font-medium">DevOps</span>
</div>
{siteConfig.hero.features.map((feature) => (
<div class="flex items-center gap-2.5 text-white/80">
<Icon name={feature.icon} class="w-5 h-5" />
<span class="font-medium">{feature.text}</span>
</div>
))}
</div>
</div>
</div>

27
src/components/sections/ServicesSection.astro
View File

@@ -1,29 +1,20 @@
---
import { siteConfig } from "../../config/site";
const serviceIcons = [
`<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" /></svg>`,
`<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 18h.01M8 21h8a2 2 0 002-2V5a2 2 0 00-2-2H8a2 2 0 00-2 2v14a2 2 0 002 2z" /></svg>`,
`<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z" /><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" /></svg>`,
`<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18.364 5.636l-3.536 3.536m0 5.656l3.536 3.536M9.172 9.172L5.636 5.636m3.536 9.192L5.636 18.364M12 2.25a9.75 9.75 0 109.75 9.75A9.75 9.75 0 0012 2.25z" /></svg>`,
];
import { Icon } from "astro-icon/components";
---
<section id="services" class="py-20 lg:py-28 bg-base-200/50">
<div class="max-w-7xl mx-auto px-6">
<div class="text-center mb-16">
<span class="badge badge-primary badge-lg font-semibold mb-4">What We Do</span>
<span class="badge badge-primary badge-lg font-semibold mb-4">{siteConfig.services.badge}</span>
<h2 class="text-3xl lg:text-4xl font-bold text-base-content mb-4">
Our Services
{siteConfig.services.title}
</h2>
<p class="text-lg text-base-content/60 max-w-2xl mx-auto">
Comprehensive software solutions designed to drive your business forward
</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 lg:gap-8">
{
siteConfig.featureCards.cards.map((card, index) => (
siteConfig.services.cards.map((card, index) => (
<div class="group card bg-base-100 border border-base-300/50 hover:border-primary/30 shadow-sm hover:shadow-xl transition-all duration-300 hover:-translate-y-1">
<div class="card-body p-8">
<div class="flex items-start gap-5">
@@ -35,7 +26,7 @@ const serviceIcons = [
${card.variant === "accent" ? "bg-accent/10 text-accent" : ""}
`}
>
<Fragment set:html={serviceIcons[index]} />
<Icon name={card.icon} class="w-6 h-6" />
</div>
<div class="flex-1 space-y-3">
<h3 class="text-xl font-bold text-base-content group-hover:text-primary transition-colors">
@@ -44,14 +35,6 @@ const serviceIcons = [
<p class="text-base-content/60 leading-relaxed">
{card.content}
</p>
<div class="pt-2">
<a href="#contact" class="inline-flex items-center gap-2 text-primary font-medium text-sm opacity-0 group-hover:opacity-100 transition-opacity duration-300">
Learn more
<svg class="w-4 h-4 transition-transform group-hover:translate-x-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3" />
</svg>
</a>
</div>
</div>
</div>
</div>

95
src/config/site.ts
View File

@@ -35,48 +35,135 @@ export const siteConfig = {
text: "Get Started",
href: "#contact",
},
mobileLogoText: "Atash",
},
hero: {
title: "Atash Consulting",
badge: "Accepting new clients",
mainTitle: "Building Digital Solutions That Drive Growth",
description: "Software Consulting based in Edmonton, Alberta",
subDescription: "Delivering reliable, scalable solutions tailored to your business needs.",
cta: "Start Your Project",
secondaryCta: "Explore Service",
trustedText: "Trusted expertise in",
features: [
{ icon: "heroicons:computer-desktop", text: "Web Development" },
{ icon: "heroicons:device-phone-mobile", text: "Mobile Apps" },
{ icon: "heroicons:cog-6-tooth", text: "DevOps" },
],
},
featureCards: {
enabled: true,
services: {
badge: "What We Do",
title: "Our Services",
cards: [
{
title: "Web Development",
content: "Functional, accessible, and beautiful websites.",
variant: "primary",
icon: "heroicons:computer-desktop",
},
{
title: "Mobile App Development",
content: "iOS, Android, and cross-platform mobile applications.",
variant: "secondary",
icon: "heroicons:device-phone-mobile",
},
{
title: "DevOps",
content: "Anything from CI/CD to end-to-end UI testing.",
variant: "secondary",
icon: "heroicons:cog-6-tooth",
},
{
title: "IT Support Processes",
content:
"We provide expert technical support expertise, backed by over a decade of client support experience.",
"Expert technical support backed by over a decade of client support experience.",
variant: "primary",
icon: "heroicons:lifebuoy",
},
] as (Card & { icon: string })[],
},
whyUs: {
badge: "Why Us",
title: "Why Choose Atash Consulting?",
cards: [
{
title: "Fast Delivery",
content: "Quick turnaround without compromising quality",
variant: "primary",
},
{
title: "Built With Care",
content: "Rigorous testing and quality control processes",
variant: "secondary",
},
{
title: "Expert Support",
content: "Ongoing support and maintenance services",
variant: "accent",
},
] as Card[],
},
contact: {
title: "Contact Us",
description: "Ready to get started? Reach out to us for a consultation.",
cta: {
text: "Get in Touch",
href: "#contact",
ariaLabel: "Contact us for consultation",
},
badge: "Contact",
mainTitle: "Get In Touch",
form: {
firstName: "First Name *",
lastName: "Last Name *",
email: "Email Address *",
company: "Company",
service: "Service Needed",
budget: "Project Budget",
message: "Project Details *",
placeholders: {
firstName: "John",
lastName: "Doe",
email: "john@example.com",
company: "Your company name (optional)",
message:
"Tell me about your project requirements, timeline, and any specific needs...",
},
selectPlaceholders: {
service: "Select a service...",
budget: "Select budget range...",
},
services: [
{ value: "web-development", label: "Web Development" },
{ value: "mobile-development", label: "Mobile App Development" },
{ value: "devops", label: "DevOps" },
{ value: "it-support", label: "IT Support Processes" },
{ value: "consultation", label: "General Consultation" },
],
budgets: [
{ value: "under-5k", label: "Under $5,000" },
{ value: "5k-15k", label: "$5,000 - $15,000" },
{ value: "15k-50k", label: "$15,000 - $50,000" },
{ value: "50k-plus", label: "$50,000+" },
],
submit: "Send Message",
sending: "Sending...",
success: "Message sent successfully! We'll get back to you soon.",
error: "Error sending message. Please try again.",
},
direct: {
text: "Prefer to reach out directly?",
email: "contact@atash.dev",
},
},
footer: {
copyright: "Copyright",
rights: "All rights reserved.",
},
} as const;