jbourdon/social-media
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add public site pages and social login

Browse Source
This commit is contained in:
Jonathan Bourdon
2026-05-04 16:13:57 -04:00
parent cd6f402d9e
commit 802668fb0b
9 changed files with 617 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files

101
frontend/src/features/landing/views/Landing.vue
View File

@@ -1,5 +1,6 @@
<script setup>
import { computed } from 'vue';
import LandingSiteMenu from '@/features/landing/components/LandingSiteMenu.vue';
const pillars = computed(() => [
{
@@ -25,37 +26,43 @@
</script>
<template>
<div class="landing-shell">
<section class="hero-card">
<div class="hero-copy">
<div class="eyebrow">Social media approval workflow</div>
<h1>Replace Drive links, scattered comments, and manual follow-up with one review system.</h1>
<p>
Socialize is being rebuilt as an agency workflow product for content review, revision tracking,
client approval, and publication readiness.
</p>
<div class="hero-actions">
<router-link to="/login">
<button class="primary">Open the app</button>
</router-link>
<router-link to="/register">
<button class="secondary">Create an internal account</button>
</router-link>
</div>
</div>
<div class="landing-page">
<LandingSiteMenu />
<div class="hero-panel">
<div class="hero-panel-title">Version 1 workflow</div>
<ol class="workflow-list">
<li
v-for="step in workflow"
:key="step"
>
{{ step }}
</li>
</ol>
</div>
</section>
<main class="landing-shell">
<section
id="products"
class="hero-card"
>
<div class="hero-copy">
<div class="eyebrow">Social media approval workflow</div>
<h1>Replace Drive links, scattered comments, and manual follow-up with one review system.</h1>
<p>
Socialize is being rebuilt as an agency workflow product for content review, revision tracking,
client approval, and publication readiness.
</p>
<div class="hero-actions">
<router-link to="/login">
<button class="primary">Open the app</button>
</router-link>
<router-link to="/register">
<button class="secondary">Create an internal account</button>
</router-link>
</div>
</div>
<div class="hero-panel">
<div class="hero-panel-title">Version 1 workflow</div>
<ol class="workflow-list">
<li
v-for="step in workflow"
:key="step"
>
{{ step }}
</li>
</ol>
</div>
</section>
<section class="pillars-grid">
<article
@@ -88,10 +95,28 @@
</div>
</div>
</section>
<section
id="pricing"
class="pricing-card"
>
<div>
<div class="eyebrow">Pricing</div>
<h2>Workspace pricing for teams that manage content approvals with clients.</h2>
</div>
<router-link to="/login">
<button class="secondary pricing-action">Open the app</button>
</router-link>
</section>
</main>
</div>
</template>
<style scoped>
.landing-page {
@apply min-h-screen w-full;
}
.landing-shell {
@apply mx-auto flex w-full max-w-7xl flex-col gap-8 px-5 py-8 md:px-8 md:py-12;
}
@@ -189,4 +214,20 @@
@apply mt-2 block text-sm leading-6;
color: #3f4d63;
}
.pricing-card {
@apply flex flex-col gap-5 rounded-[1.75rem] p-6 md:flex-row md:items-center md:justify-between md:p-8;
background: rgba(255, 255, 255, 0.84);
border: 1px solid rgba(23, 32, 51, 0.08);
box-shadow: 0 18px 40px rgba(23, 32, 51, 0.06);
}
.pricing-card h2 {
@apply mt-3 max-w-3xl text-2xl font-black leading-tight md:text-3xl;
color: #172033;
}
.pricing-action {
@apply w-full sm:w-auto;
}
</style>