Goatworks/Capital
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

✨ Simple solar network product page

Browse Source
This commit is contained in:
LittleSheep 2024-12-17 23:50:10 +08:00
parent 44572badcc
commit 2d2ec80185
6 changed files with 119 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/images/products/solar-network-alpha.webp Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 696 KiB

0
src/assets/images/product-solar-network.webp → src/assets/images/products/solar-network.webp
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.0 MiB

After

Width:  |  Height:  |  Size: 2.0 MiB

54
src/layouts/Layout.astro
View File

@ -1,13 +1,13 @@
---
import { Image } from "astro:assets";
import { Image } from 'astro:assets'
import CompanyLogo from "../assets/images/company-logo.png";
import CompanyLogo from '../assets/images/company-logo.png'
interface Props {
title?: string;
title?: string
}
const { title } = Astro.props;
const { title } = Astro.props
---
<!doctype html>
@ -16,7 +16,7 @@ const { title } = Astro.props;
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<link rel="icon" type="image/png" href="/favicon.png" />
<title>{title ? `${title} | Solsynth LLC` : "Solsynth LLC"}</title>
<title>{title ? `${title} | Solsynth LLC` : 'Solsynth LLC'}</title>
</head>
<body>
<div class="navbar backdrop-blur fixed top-0 left-0 right-0 z-10">
@ -52,6 +52,50 @@ const { title } = Astro.props;
<main class="mt-[68px]">
<slot />
</main>
<footer class="bg-neutral text-neutral-content p-10 mt-32">
<div class="container mx-auto footer">
<aside>
<Image
src={CompanyLogo}
alt="company logo"
class="h-12 w-12 p-1 bg-white rounded-lg shadow-sm"
/>
<div class="flex flex-col">
<span class="font-bold text-lg">Solsynth LLC</span>
Building wonderful software since 2019.
<span class="font-mono text-xs mt-3">Powered by RoadSign v2</span>
<a href="https://status.solsynth.dev" class="mt-4">
<img
src="https://uptime.betterstack.com/status-badges/v1/monitor/1ki5r.svg"
/>
</a>
</div>
</aside>
<nav>
<h6 class="footer-title">Services</h6>
<a class="link link-hover">Branding</a>
<a class="link link-hover">Design</a>
<a class="link link-hover">Marketing</a>
<a class="link link-hover">Advertisement</a>
</nav>
<nav>
<h6 class="footer-title">Company</h6>
<a class="link link-hover">About us</a>
<a class="link link-hover">Contact</a>
<a class="link link-hover">Jobs</a>
<a class="link link-hover">Press kit</a>
</nav>
<nav>
<h6 class="footer-title">Legal</h6>
<a class="link link-hover">Terms of use</a>
<a class="link link-hover">Privacy policy</a>
<a class="link link-hover">Cookie policy</a>
</nav>
</div>
</footer>
</body>
</html>

30
src/pages/index.astro
View File

@ -1,12 +1,12 @@
---
import { Image } from "astro:assets";
import { Icon } from "astro-icon/components";
import { Image } from 'astro:assets'
import { Icon } from 'astro-icon/components'
import Layout from "../layouts/Layout.astro";
import Layout from '../layouts/Layout.astro'
import CompanyAsideImage from "../assets/images/company-aside.webp";
import AppStoreGetImage from "../assets/images/app-store/get-it-on-black.svg";
import ProductSnPreviewImage from "../assets/images/product-solar-network.webp";
import CompanyAsideImage from '../assets/images/company-aside.webp'
import AppStoreGetImage from '../assets/images/app-store/get-it-on-black.svg'
import ProductSnPreviewImage from '../assets/images/products/solar-network.webp'
---
<Layout>
@ -33,7 +33,7 @@ import ProductSnPreviewImage from "../assets/images/product-solar-network.webp";
</div>
</div>
<div class="section-flex shadow-lg bg-base-300" id="work-featured">
<div class="section-flex py-12 shadow-lg bg-base-300" id="work-featured">
<div class="section container mx-auto grid-cols-1 lg:grid-cols-3">
<div
class="sub-section flex flex-col items-start lg:items-end justify-center lg:col-span-1"
@ -53,19 +53,26 @@ import ProductSnPreviewImage from "../assets/images/product-solar-network.webp";
Social Network, Redefined.
</blockquote>
<div class="flex gap-2 mt-4">
<a href="https://apps.apple.com/us/app/solian/id6499032345?itscg=30200&itsct=apps_box_link&mttnsubad=6499032345">
<div class="flex gap-3 mt-4 items-center text-right">
<span class="opacity-75 text-xs max-lg:order-last" style="line-height: 1">
Also supports Android, Windows, and any modern web browser
</span>
<a
href="https://apps.apple.com/us/app/solian/id6499032345?itscg=30200&itsct=apps_box_link&mttnsubad=6499032345"
>
<Image src={AppStoreGetImage} alt="get it on app store" />
</a>
</div>
<a class="link flex items-center gap-1 mt-3" href="/products/solar-network">
<a
class="link flex items-center gap-1 mt-3"
href="/products/solar-network"
>
<span>Learn more about Solar Network</span>
<Icon name="material-symbols:arrow-right-alt" />
</a>
</div>
<div class="sub-section flex items-center lg:col-span-2">
<div class="card">
<Image
src={ProductSnPreviewImage}
alt="solar network cross-platform preview"
@ -74,7 +81,6 @@ import ProductSnPreviewImage from "../assets/images/product-solar-network.webp";
</div>
</div>
</div>
</div>
</Layout>
<style>

2
src/pages/posts/[...slug].astro
View File

@ -41,7 +41,7 @@ const attachments = await fetchAttachmentMeta(data.body.attachments)
</div>
</div>
<div class="flex gap-2">
<a class="btn btn-sm" href="/products/solar-network">Get</a>
<a class="btn btn-sm" href="/products/solar-network#downloads">Get</a>
<a class="btn btn-sm" href={`https://sn.solsynth.dev/posts/${data.id}`}
>Open</a
>

46
src/pages/products/solar-network.astro
View File

@ -1,7 +1,51 @@
---
import Layout from "../../layouts/Layout.astro";
import { Image } from 'astro:assets'
import { Icon } from 'astro-icon/components'
import Layout from '../../layouts/Layout.astro'
import AppStoreGetImage from '../../assets/images/app-store/get-it-on-black.svg'
import ProductSnPreviewImage from '../../assets/images/products/solar-network-alpha.webp'
---
<Layout title="Solar Network">
<div class="container mx-auto mt-[35vh]" id="intro">
<div class="text-center">
<h1 class="text-4xl font-bold">Solar Network</h1>
<p>The next generation Social Network platform.</p>
<div class="flex justify-center gap-2 mt-5">
<a class="btn btn-primary" href="#downloads">
Download <Icon name="material-symbols:download" size={20} />
</a>
</div>
</div>
<Image
src={ProductSnPreviewImage}
alt="solar network cross-platform preview"
class="mt-5"
/>
<div id="downloads" class="mt-12">
<div class="flex flex-col text-center justify-center">
<h2 class="text-2xl font-bold">Downloads</h2>
</div>
<div class="flex items-center justify-center mt-5">
<a
href="https://apps.apple.com/us/app/solian/id6499032345?itscg=30200&itsct=apps_box_link&mttnsubad=6499032345"
>
<Image src={AppStoreGetImage} alt="get it on app store" />
</a>
</div>
</div>
</div>
</Layout>
<style>
html,
body {
scroll-behavior: smooth;
}
</style>