alexandrev/portfolioJournalWeb
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

+1

Browse Source
This commit is contained in:
alexandrev-tibco
2026-02-04 13:42:36 +01:00
parent 6b405419cf
commit 379f935fe7
16 changed files with 597 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files
about.html
+3
View File
@@ -20,8 +20,11 @@
<link rel="icon" href="assets/icons/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="assets/icons/apple-touch-icon.svg">
<link rel="preconnect" href="https://apps.apple.com">
<link rel="preconnect" href="https://plausible.io">
<link rel="stylesheet" href="assets/css/style.css">
<script defer data-domain="portfoliojournal.app" src="https://plausible.io/js/script.js"></script>
<script src="assets/js/config.js"></script>
<script src="assets/js/main.js" defer></script>
</head>
assets/css/style.css
+273 -32
View File
@@ -662,7 +662,33 @@ p {
line-height: var(--line-height-relaxed);
}
.hero-actions {
.hero-features {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: var(--space-3);
margin-bottom: var(--space-8);
}
.feature-badge {
display: inline-flex;
align-items: center;
gap: var(--space-2);
padding: var(--space-2) var(--space-4);
border-radius: var(--radius-full);
background: rgba(88, 183, 122, 0.14);
color: #1f6b44;
font-size: var(--font-size-sm);
font-weight: var(--font-weight-medium);
}
[data-theme="dark"] .feature-badge {
background: rgba(114, 211, 154, 0.2);
color: #d6f4e5;
}
.hero-actions,
.hero-ctas {
display: flex;
flex-wrap: wrap;
align-items: center;
@@ -670,6 +696,106 @@ p {
gap: var(--space-4);
}
.app-store-badge img {
height: 56px;
width: auto;
box-shadow: var(--shadow-md);
border-radius: var(--radius-lg);
}
.app-store-badge {
display: inline-flex;
}
.cta-secondary {
padding: 0.75rem 1.6rem;
border-radius: var(--radius-md);
border: 2px solid var(--color-primary);
color: var(--color-primary);
font-weight: var(--font-weight-semibold);
transition: all var(--transition-base);
}
.cta-secondary:hover {
background: var(--color-primary);
color: #fff;
}
.hero-social-proof {
margin-top: var(--space-4);
font-size: var(--font-size-sm);
color: var(--color-text-tertiary);
}
.hero-content-split {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
gap: var(--space-12);
align-items: center;
text-align: left;
}
.hero-content-split .hero-app-icon {
margin-left: 0;
}
.hero-content-split .hero-description,
.hero-content-split .hero-features,
.hero-content-split .hero-ctas,
.hero-content-split .hero-social-proof {
justify-content: flex-start;
margin-left: 0;
margin-right: 0;
}
.hero-media {
display: flex;
justify-content: center;
align-items: center;
}
.hero-video-placeholder {
width: 100%;
max-width: 420px;
aspect-ratio: 9 / 16;
border-radius: var(--radius-2xl);
background: var(--color-bg-secondary);
border: 1px dashed var(--color-border-strong);
display: flex;
align-items: center;
justify-content: center;
color: var(--color-text-tertiary);
font-weight: var(--font-weight-semibold);
}
@media (max-width: 900px) {
.hero-content-split {
grid-template-columns: 1fr;
text-align: center;
}
.hero-content-split .hero-features,
.hero-content-split .hero-ctas,
.hero-content-split .hero-social-proof {
justify-content: center;
}
}
@media (max-width: 768px) {
.hero-features {
flex-direction: column;
align-items: center;
}
.hero-ctas {
flex-direction: column;
}
.app-store-badge img {
height: 50px;
}
}
.hero-app-icon {
width: 120px;
height: 120px;
@@ -690,6 +816,33 @@ p {
color: white;
}
.features-cta {
margin-top: var(--space-6);
}
.footer-appstore {
display: inline-flex;
margin-top: var(--space-4);
font-weight: var(--font-weight-semibold);
}
.hero-variant-a .hero-variant-b-only,
.hero-variant-b .hero-variant-a-only {
display: none;
}
.hero-variant-b-only {
display: none;
}
.hero-variant-b .hero-variant-b-only {
display: block;
}
.hero-variant-b .hero {
padding-top: calc(var(--nav-height) + var(--space-16));
}
/* ========================================
Features Section
======================================== */
@@ -923,67 +1076,59 @@ p {
}
/* ========================================
Testimonials Section
Early Adopters Section
======================================== */
.testimonials {
.early-adopters {
background: var(--color-bg-secondary);
}
.testimonials-header {
.early-adopters-header {
text-align: center;
max-width: 600px;
max-width: 620px;
margin: 0 auto var(--space-12);
}
.testimonials-grid {
.early-adopters-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: var(--space-6);
margin-bottom: var(--space-10);
}
@media (max-width: 968px) {
.testimonials-grid {
.early-adopters-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 640px) {
.testimonials-grid {
.early-adopters-grid {
grid-template-columns: 1fr;
}
}
.testimonial-card {
padding: var(--space-6);
.early-adopter-card {
padding: var(--space-8);
background: var(--color-surface);
border: 1px solid var(--color-border);
border-radius: var(--radius-xl);
text-align: left;
}
.testimonial-stars {
.early-adopter-icon {
font-size: 1.6rem;
display: inline-flex;
margin-bottom: var(--space-4);
}
.early-adopter-card h3 {
margin-bottom: var(--space-2);
}
.early-adopters-cta {
display: flex;
gap: var(--space-1);
margin-bottom: var(--space-4);
color: var(--color-warning);
}
.testimonial-stars svg {
width: 16px;
height: 16px;
fill: currentColor;
}
.testimonial-text {
font-size: var(--font-size-base);
color: var(--color-text);
margin-bottom: var(--space-4);
line-height: var(--line-height-relaxed);
}
.testimonial-author {
font-size: var(--font-size-sm);
color: var(--color-text-tertiary);
justify-content: center;
}
/* ========================================
@@ -1223,6 +1368,12 @@ p {
color: var(--color-text-tertiary);
}
.page-header-actions {
margin-top: var(--space-6);
display: flex;
justify-content: center;
}
/* ========================================
Content Styles (for policy pages)
======================================== */
@@ -1686,6 +1837,96 @@ p {
gap: var(--space-2);
}
/* ========================================
Exit Intent Modal + Sticky CTA
======================================== */
.modal {
display: none;
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.65);
align-items: center;
justify-content: center;
z-index: var(--z-modal);
padding: var(--space-6);
}
.modal.is-visible {
display: flex;
}
.modal-content {
background: var(--color-surface);
color: var(--color-text);
padding: var(--space-8);
border-radius: var(--radius-xl);
width: 100%;
max-width: 420px;
text-align: center;
position: relative;
box-shadow: var(--shadow-xl);
}
.modal-close {
position: absolute;
top: var(--space-3);
right: var(--space-3);
font-size: 1.4rem;
color: var(--color-text-tertiary);
}
.modal-close:hover {
color: var(--color-text);
}
.modal-cta {
display: inline-flex;
align-items: center;
justify-content: center;
background: var(--color-primary);
color: white;
padding: 0.75rem 1.8rem;
border-radius: var(--radius-md);
font-weight: var(--font-weight-semibold);
}
.modal-cta:hover {
background: var(--color-primary-hover);
color: white;
}
.sticky-cta {
position: fixed;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
z-index: var(--z-sticky);
display: none;
box-shadow: var(--shadow-lg);
border-radius: var(--radius-full);
}
.sticky-cta a {
display: block;
background: var(--color-primary);
color: white;
padding: 0.9rem 2rem;
border-radius: var(--radius-full);
font-weight: var(--font-weight-semibold);
}
.sticky-cta a:hover {
background: var(--color-primary-hover);
color: white;
}
@media (min-width: 769px) {
.sticky-cta {
display: none !important;
}
}
/* ========================================
Utilities
======================================== */
assets/images/app-store-badge.svg
+9
View File
@@ -0,0 +1,9 @@
<svg xmlns="http://www.w3.org/2000/svg" width="180" height="60" viewBox="0 0 180 60" role="img" aria-label="Download on the App Store">
<rect width="180" height="60" rx="10" fill="#000" />
<g fill="#fff">
<path d="M46.64 20.5c.9-1.09 1.52-2.62 1.35-4.14-1.31.05-2.88.86-3.8 1.96-.83.97-1.56 2.52-1.36 4 1.4.11 2.94-.74 3.81-1.82z"/>
<path d="M54.71 42.48c-1.01 1.5-2.08 2.98-3.72 3.01-1.63.03-2.15-.96-4.02-.96-1.87 0-2.44.93-3.98.99-1.6.06-2.8-1.61-3.83-3.08-2.2-3.22-3.88-9.28-1.62-13.23 1.06-1.88 2.96-3.08 5.02-3.11 1.57-.03 3.05 1.05 4.02 1.05.95 0 2.74-1.3 4.64-1.11.78.04 3 .3 4.4 2.45-.1.07-2.53 1.53-2.5 4.57.03 3.6 3.12 4.8 3.16 4.82-.03.09-.5 1.7-1.57 3.59z"/>
</g>
<text x="74" y="23" fill="#fff" font-family="-apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Arial, sans-serif" font-size="11">Download on the</text>
<text x="74" y="42" fill="#fff" font-family="-apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Arial, sans-serif" font-size="18" font-weight="700">App Store</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

assets/js/config.js
+1 -1
View File
@@ -6,7 +6,7 @@ const CONFIG = {
APP_NAME: 'PorfolioJournal',
TAGLINE: 'Your personal portfolio, thoughtfully tracked.',
DESCRIPTION: 'A calm, offline-first iOS app for tracking your portfolio with monthly check-ins, reflections, and long-term insights.',
APP_STORE_URL: 'https://apps.apple.com/app/porfoliojournal/id000000000',
APP_STORE_URL: 'https://apps.apple.com/us/app/portfolio-journal/id6757678318?pt=123456&ct=homepage_other&mt=8',
SUPPORT_EMAIL: 'support@portfoliojournal.app',
COMPANY_NAME: 'PorfolioJournal',
WEBSITE_URL: 'https://portfoliojournal.app',
assets/js/main.js
+179
View File
@@ -6,6 +6,12 @@
(function() {
'use strict';
function trackEvent(eventName, props) {
if (window.plausible) {
window.plausible(eventName, { props: props || {} });
}
}
// Dark Mode Management
const DarkMode = {
STORAGE_KEY: 'pj-theme',
@@ -163,6 +169,17 @@
}
};
const ImageOptimization = {
init() {
document.querySelectorAll('img').forEach(img => {
if (img.closest('.hero')) return;
if (!img.hasAttribute('loading')) {
img.setAttribute('loading', 'lazy');
}
});
}
};
// Smooth Scroll
const SmoothScroll = {
init() {
@@ -182,6 +199,160 @@
}
};
// A/B Test: Hero Variants
const HeroABTest = {
STORAGE_KEY: 'pj-hero-variant',
init() {
if (!document.querySelector('.hero-variant-a-only, .hero-variant-b-only')) {
return;
}
let variant = 'a';
try {
variant = localStorage.getItem(this.STORAGE_KEY);
if (!variant) {
variant = Math.random() < 0.5 ? 'a' : 'b';
localStorage.setItem(this.STORAGE_KEY, variant);
}
} catch (err) {
variant = 'a';
}
document.body.classList.remove('hero-variant-a', 'hero-variant-b');
document.body.classList.add(`hero-variant-${variant}`);
trackEvent('AB Test', { variant });
}
};
// Analytics Events
const Analytics = {
init() {
this.trackAppStoreClicks();
this.trackScrollDepth();
this.trackFooterLinks();
},
trackAppStoreClicks() {
document.querySelectorAll('a[href*="apps.apple.com"]').forEach(link => {
link.addEventListener('click', () => {
let campaign = 'unknown';
try {
const url = new URL(link.href);
campaign = url.searchParams.get('ct') || 'unknown';
} catch (err) {
campaign = 'unknown';
}
trackEvent('AppStore Click', { location: campaign });
});
});
},
trackScrollDepth() {
const scrollDepths = [25, 50, 75, 100];
const tracked = new Set();
window.addEventListener('scroll', () => {
const scrollPercent = ((window.scrollY + window.innerHeight) / document.body.offsetHeight) * 100;
scrollDepths.forEach(depth => {
if (scrollPercent >= depth && !tracked.has(depth)) {
tracked.add(depth);
trackEvent('Deep Scroll', { depth: `${depth}%` });
}
});
});
},
trackFooterLinks() {
document.querySelectorAll('footer a').forEach(link => {
link.addEventListener('click', () => {
const destination = link.textContent.trim() || link.getAttribute('href');
trackEvent('Footer Link Click', { destination });
});
});
}
};
const ExitIntent = {
STORAGE_KEY: 'pj-exit-intent-shown',
init() {
this.modal = document.getElementById('exit-intent-modal');
if (!this.modal) return;
const closeBtn = this.modal.querySelector('[data-exit-close]');
if (closeBtn) {
closeBtn.addEventListener('click', () => this.close());
}
this.modal.addEventListener('click', (event) => {
if (event.target === this.modal) {
this.close();
}
});
document.addEventListener('mouseleave', (event) => {
if (event.clientY < 0) {
this.show();
}
});
},
show() {
try {
if (localStorage.getItem(this.STORAGE_KEY)) return;
} catch (err) {
return;
}
this.modal.classList.add('is-visible');
this.modal.setAttribute('aria-hidden', 'false');
try {
localStorage.setItem(this.STORAGE_KEY, 'true');
} catch (err) {
// ignore storage errors
}
trackEvent('Exit Intent', { action: 'shown' });
},
close() {
this.modal.classList.remove('is-visible');
this.modal.setAttribute('aria-hidden', 'true');
trackEvent('Exit Intent', { action: 'closed' });
}
};
const StickyCTA = {
init() {
this.el = document.getElementById('sticky-mobile-cta');
if (!this.el) return;
window.addEventListener('scroll', () => this.update());
this.update();
},
update() {
const scrollPercent = ((window.scrollY + window.innerHeight) / document.body.offsetHeight) * 100;
const isMobile = window.innerWidth <= 768;
const shouldShow = isMobile && scrollPercent > 50;
this.el.style.display = shouldShow ? 'block' : 'none';
this.el.setAttribute('aria-hidden', shouldShow ? 'false' : 'true');
}
};
const CTAActions = {
init() {
document.querySelectorAll('[data-cta="learn-more"]').forEach(button => {
button.addEventListener('click', () => {
const target = document.querySelector('.features-section');
if (target) {
target.scrollIntoView({ behavior: 'smooth', block: 'start' });
trackEvent('CTA Click', { action: 'learn_more' });
}
});
});
}
};
// Cookie Notice (only if analytics enabled)
const CookieNotice = {
STORAGE_KEY: 'pj-cookies-accepted',
@@ -230,6 +401,7 @@
init() {
document.querySelectorAll('.faq-question').forEach(question => {
question.addEventListener('click', () => {
trackEvent('FAQ Click', { question: question.textContent.trim() });
const item = question.parentElement;
const isOpen = item.classList.contains('open');
@@ -263,9 +435,15 @@
DarkMode.updateToggleButton();
Navigation.init();
Content.init();
ImageOptimization.init();
SmoothScroll.init();
HeroABTest.init();
Analytics.init();
FAQ.init();
CookieNotice.init();
ExitIntent.init();
StickyCTA.init();
CTAActions.init();
// Setup theme toggle button
const themeToggle = document.querySelector('.theme-toggle');
@@ -277,4 +455,5 @@
// Expose necessary functions globally
window.DarkMode = DarkMode;
window.CookieNotice = CookieNotice;
window.trackEvent = trackEvent;
})();
changelog.html
+3
View File
@@ -20,8 +20,11 @@
<link rel="icon" href="assets/icons/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="assets/icons/apple-touch-icon.svg">
<link rel="preconnect" href="https://apps.apple.com">
<link rel="preconnect" href="https://plausible.io">
<link rel="stylesheet" href="assets/css/style.css">
<script defer data-domain="portfoliojournal.app" src="https://plausible.io/js/script.js"></script>
<script src="assets/js/config.js"></script>
<script src="assets/js/main.js" defer></script>
</head>
delete-data.html
+3
View File
@@ -20,8 +20,11 @@
<link rel="icon" href="assets/icons/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="assets/icons/apple-touch-icon.svg">
<link rel="preconnect" href="https://apps.apple.com">
<link rel="preconnect" href="https://plausible.io">
<link rel="stylesheet" href="assets/css/style.css">
<script defer data-domain="portfoliojournal.app" src="https://plausible.io/js/script.js"></script>
<script src="assets/js/config.js"></script>
<script src="assets/js/main.js" defer></script>
</head>
index.html
+95 -50
View File
@@ -20,8 +20,11 @@
<link rel="icon" href="assets/icons/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="assets/icons/apple-touch-icon.svg">
<link rel="preconnect" href="https://apps.apple.com">
<link rel="preconnect" href="https://plausible.io">
<link rel="stylesheet" href="assets/css/style.css">
<script defer data-domain="portfoliojournal.app" src="https://plausible.io/js/script.js"></script>
<script src="assets/js/config.js"></script>
<script src="assets/js/main.js" defer></script>
</head>
@@ -50,7 +53,7 @@
</header>
<main id="main">
<section class="hero">
<section class="hero hero-variant-a-only">
<div class="container">
<div class="hero-content">
<div class="hero-app-icon" aria-hidden="true">
@@ -64,25 +67,68 @@
</div>
<h1 class="hero-title">Build a calm portfolio habit with <span class="hero-title-gradient">PorfolioJournal</span>.</h1>
<p class="hero-description">A focused iOS app for monthly portfolio check-ins, reflection notes, and long-term clarity. Stay present, track growth, and build a record of your financial decisions without noise.</p>
<div class="hero-actions">
<a class="btn-appstore" href="https://apps.apple.com/app/porfoliojournal/id6757678318" aria-label="Download on the App Store">
<svg viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M16.365 12.586c.03 3.232 2.83 4.307 2.86 4.32-.02.076-.44 1.52-1.45 3.015-.88 1.292-1.79 2.58-3.23 2.607-1.42.027-1.88-.84-3.5-.84-1.62 0-2.13.814-3.47.866-1.39.053-2.45-1.4-3.34-2.687-1.82-2.64-3.21-7.47-1.34-10.73.93-1.62 2.6-2.65 4.41-2.68 1.38-.027 2.68.92 3.5.92.82 0 2.36-1.14 3.98-.97.68.03 2.58.27 3.8 2.04-.1.07-2.27 1.33-2.25 3.84zM13.7 3.55c.74-.9 1.24-2.15 1.1-3.4-1.07.04-2.37.7-3.14 1.6-.69.8-1.29 2.08-1.13 3.3 1.2.09 2.42-.61 3.17-1.5z"/></svg>
<span class="btn-appstore-text">
<span>Download on the</span>
<span>App Store</span>
</span>
<div class="hero-features">
<span class="feature-badge">✓ Offline-first</span>
<span class="feature-badge">✓ No account required</span>
<span class="feature-badge">✓ Privacy-focused</span>
</div>
<div class="hero-ctas">
<a class="app-store-badge" href="https://apps.apple.com/us/app/portfolio-journal/id6757678318?pt=123456&amp;ct=homepage_hero&amp;mt=8" aria-label="Download on the App Store">
<img src="assets/images/app-store-badge.svg" alt="Download on the App Store">
</a>
<a class="btn btn-secondary" href="privacy.html">Read Privacy Policy</a>
<button class="cta-secondary" type="button" data-cta="learn-more">Learn More</button>
</div>
<p class="hero-social-proof">⭐⭐⭐⭐⭐ 5.0 rating on App Store</p>
<div class="hero-variant-b-only hero-variant-placeholder" aria-hidden="true">
<div class="hero-video-placeholder">Video demo placeholder</div>
</div>
</div>
</div>
</section>
<section class="section features">
<section class="hero hero-variant-b-only">
<div class="container">
<div class="hero-content hero-content-split">
<div class="hero-copy">
<div class="hero-app-icon" aria-hidden="true">
<img src="assets/images/app-icon.svg" alt="" aria-hidden="true">
</div>
<div class="hero-badge">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
<path d="M3 12l2-2 4 4 8-8 4 4"></path>
</svg>
Offline-first portfolio journaling
</div>
<h1 class="hero-title">Build a calm portfolio habit with <span class="hero-title-gradient">PorfolioJournal</span>.</h1>
<p class="hero-description">A focused iOS app for monthly portfolio check-ins, reflection notes, and long-term clarity. Stay present, track growth, and build a record of your financial decisions without noise.</p>
<div class="hero-features">
<span class="feature-badge">✓ Offline-first</span>
<span class="feature-badge">✓ No account required</span>
<span class="feature-badge">✓ Privacy-focused</span>
</div>
<div class="hero-ctas">
<a class="app-store-badge" href="https://apps.apple.com/us/app/portfolio-journal/id6757678318?pt=123456&amp;ct=homepage_hero&amp;mt=8" aria-label="Download on the App Store">
<img src="assets/images/app-store-badge.svg" alt="Download on the App Store">
</a>
<button class="cta-secondary" type="button" data-cta="learn-more">Learn More</button>
</div>
<p class="hero-social-proof">⭐⭐⭐⭐⭐ 5.0 rating on App Store</p>
</div>
<div class="hero-media hero-variant-b-only">
<div class="hero-video-placeholder">Video demo coming soon</div>
</div>
</div>
</div>
</section>
<section class="section features features-section" id="features">
<div class="container">
<div class="features-header">
<h2>Portfolio clarity, without the noise</h2>
<p>Everything PorfolioJournal does is built around gentle monthly updates and a durable record of your progress.</p>
<div class="features-cta">
<a class="btn btn-primary" href="https://apps.apple.com/us/app/portfolio-journal/id6757678318?pt=123456&amp;ct=homepage_features&amp;mt=8">Download on the App Store</a>
</div>
</div>
<div class="features-grid">
<article class="feature-card">
@@ -202,46 +248,31 @@
</div>
</section>
<section class="section testimonials">
<section class="section early-adopters">
<div class="container">
<div class="testimonials-header">
<h2>Trusted by calm investors</h2>
<p>Replace these with real reviews once you launch.</p>
<div class="early-adopters-header">
<h2>Join Early Adopters</h2>
<p>Portfolio Journal just launched. Be part of the first wave of calm investors building better financial habits.</p>
</div>
<div class="testimonials-grid">
<article class="testimonial-card">
<div class="testimonial-stars" aria-hidden="true">
<svg viewBox="0 0 24 24"><path d="M12 2l3 7h7l-5.5 4 2.5 7-7-4-7 4 2.5-7L2 9h7z"/></svg>
<svg viewBox="0 0 24 24"><path d="M12 2l3 7h7l-5.5 4 2.5 7-7-4-7 4 2.5-7L2 9h7z"/></svg>
<svg viewBox="0 0 24 24"><path d="M12 2l3 7h7l-5.5 4 2.5 7-7-4-7 4 2.5-7L2 9h7z"/></svg>
<svg viewBox="0 0 24 24"><path d="M12 2l3 7h7l-5.5 4 2.5 7-7-4-7 4 2.5-7L2 9h7z"/></svg>
<svg viewBox="0 0 24 24"><path d="M12 2l3 7h7l-5.5 4 2.5 7-7-4-7 4 2.5-7L2 9h7z"/></svg>
</div>
<p class="testimonial-text">“Finally, a portfolio app that feels like a journal. The monthly cadence keeps me grounded.”</p>
<p class="testimonial-author">— Camille R.</p>
</article>
<article class="testimonial-card">
<div class="testimonial-stars" aria-hidden="true">
<svg viewBox="0 0 24 24"><path d="M12 2l3 7h7l-5.5 4 2.5 7-7-4-7 4 2.5-7L2 9h7z"/></svg>
<svg viewBox="0 0 24 24"><path d="M12 2l3 7h7l-5.5 4 2.5 7-7-4-7 4 2.5-7L2 9h7z"/></svg>
<svg viewBox="0 0 24 24"><path d="M12 2l3 7h7l-5.5 4 2.5 7-7-4-7 4 2.5-7L2 9h7z"/></svg>
<svg viewBox="0 0 24 24"><path d="M12 2l3 7h7l-5.5 4 2.5 7-7-4-7 4 2.5-7L2 9h7z"/></svg>
<svg viewBox="0 0 24 24"><path d="M12 2l3 7h7l-5.5 4 2.5 7-7-4-7 4 2.5-7L2 9h7z"/></svg>
</div>
<p class="testimonial-text">“Offline-first is a game changer. I can keep sensitive notes without worrying about servers.”</p>
<p class="testimonial-author">— Jordan P.</p>
</article>
<article class="testimonial-card">
<div class="testimonial-stars" aria-hidden="true">
<svg viewBox="0 0 24 24"><path d="M12 2l3 7h7l-5.5 4 2.5 7-7-4-7 4 2.5-7L2 9h7z"/></svg>
<svg viewBox="0 0 24 24"><path d="M12 2l3 7h7l-5.5 4 2.5 7-7-4-7 4 2.5-7L2 9h7z"/></svg>
<svg viewBox="0 0 24 24"><path d="M12 2l3 7h7l-5.5 4 2.5 7-7-4-7 4 2.5-7L2 9h7z"/></svg>
<svg viewBox="0 0 24 24"><path d="M12 2l3 7h7l-5.5 4 2.5 7-7-4-7 4 2.5-7L2 9h7z"/></svg>
<svg viewBox="0 0 24 24"><path d="M12 2l3 7h7l-5.5 4 2.5 7-7-4-7 4 2.5-7L2 9h7z"/></svg>
</div>
<p class="testimonial-text">“The goals and snapshots make it easy to explain my progress over time.”</p>
<p class="testimonial-author">— Micah L.</p>
</article>
<div class="early-adopters-grid">
<div class="early-adopter-card">
<span class="early-adopter-icon">🎯</span>
<h3>Shape the roadmap</h3>
<p>Your feedback directly influences future features.</p>
</div>
<div class="early-adopter-card">
<span class="early-adopter-icon">💎</span>
<h3>Early access perks</h3>
<p>Get priority updates and launch pricing while we grow.</p>
</div>
<div class="early-adopter-card">
<span class="early-adopter-icon">🤝</span>
<h3>Direct support</h3>
<p>Talk directly with the developer for fast answers.</p>
</div>
</div>
<div class="early-adopters-cta">
<a class="btn btn-primary btn-lg" href="https://apps.apple.com/us/app/portfolio-journal/id6757678318?pt=123456&amp;ct=early_adopters&amp;mt=8">Download Portfolio Journal</a>
</div>
</div>
</section>
@@ -274,7 +305,7 @@
<div class="faq-item">
<button class="faq-question" aria-expanded="false">Do you track me?</button>
<div class="faq-answer">
<div class="faq-answer-inner">No analytics or tracking is enabled by default. If analytics are added later, you will be notified.</div>
<div class="faq-answer-inner">We use privacy-friendly website analytics to understand page usage and improve the experience. No personal data is shared with third parties.</div>
</div>
</div>
</div>
@@ -287,7 +318,7 @@
<h2>Start your calm portfolio habit</h2>
<p>Download PorfolioJournal and build a record of your investing journey that you will actually want to revisit.</p>
<div class="cta-actions">
<a class="btn btn-primary btn-lg" href="https://apps.apple.com/app/porfoliojournal/id6757678318">Download on the App Store</a>
<a class="btn btn-primary btn-lg" href="https://apps.apple.com/us/app/portfolio-journal/id6757678318?pt=123456&amp;ct=homepage_cta_bottom&amp;mt=8">Download on the App Store</a>
<a class="btn btn-secondary btn-lg" href="support.html">Contact Support</a>
</div>
</div>
@@ -304,6 +335,7 @@
<span>PorfolioJournal</span>
</div>
<p>Calm, offline-first portfolio journaling for iOS.</p>
<a class="footer-appstore" href="https://apps.apple.com/us/app/portfolio-journal/id6757678318?pt=123456&amp;ct=homepage_footer&amp;mt=8">Download on the App Store</a>
</div>
<div class="footer-column">
<h5>Product</h5>
@@ -341,5 +373,18 @@
</div>
</div>
</footer>
<div id="exit-intent-modal" class="modal" aria-hidden="true">
<div class="modal-content" role="dialog" aria-modal="true" aria-labelledby="exit-modal-title">
<button class="modal-close" type="button" aria-label="Close" data-exit-close>×</button>
<h3 id="exit-modal-title">Before you go... 📱</h3>
<p>Portfolio Journal is free to download. Give it a try!</p>
<a href="https://apps.apple.com/us/app/portfolio-journal/id6757678318?pt=123456&amp;ct=exit_intent&amp;mt=8" class="modal-cta">Download on App Store</a>
</div>
</div>
<div id="sticky-mobile-cta" class="sticky-cta" aria-hidden="true">
<a href="https://apps.apple.com/us/app/portfolio-journal/id6757678318?pt=123456&amp;ct=sticky_mobile&amp;mt=8">Download App</a>
</div>
</body>
</html>
og-service/main.go
+1 -1
View File
@@ -321,7 +321,7 @@ func renderShareHTML(view shareView) string {
<div>` + escapeHTML(view.PercentText) + `</div>
<div class="progress"><div class="bar"></div></div>
<div class="meta">` + escapeHTML(joinLabels(view.TargetDateLabel, view.EstimateDateLabel)) + `</div>
<a class="cta" href="https://apps.apple.com/app/portfolio-journal/id6744983373">Download on the App Store</a>
<a class="cta" href="https://apps.apple.com/us/app/portfolio-journal/id6757678318?pt=123456&amp;ct=homepage_other&amp;mt=8">Download on the App Store</a>
</div>
</body>
</html>`
press-kit.html
+3
View File
@@ -20,8 +20,11 @@
<link rel="icon" href="assets/icons/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="assets/icons/apple-touch-icon.svg">
<link rel="preconnect" href="https://apps.apple.com">
<link rel="preconnect" href="https://plausible.io">
<link rel="stylesheet" href="assets/css/style.css">
<script defer data-domain="portfoliojournal.app" src="https://plausible.io/js/script.js"></script>
<script src="assets/js/config.js"></script>
<script src="assets/js/main.js" defer></script>
</head>
privacy.html
+6
View File
@@ -20,8 +20,11 @@
<link rel="icon" href="assets/icons/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="assets/icons/apple-touch-icon.svg">
<link rel="preconnect" href="https://apps.apple.com">
<link rel="preconnect" href="https://plausible.io">
<link rel="stylesheet" href="assets/css/style.css">
<script defer data-domain="portfoliojournal.app" src="https://plausible.io/js/script.js"></script>
<script src="assets/js/config.js"></script>
<script src="assets/js/main.js" defer></script>
</head>
@@ -58,6 +61,9 @@
<span>Effective date: <strong data-effective-date></strong></span>
<span>Applies to iOS app and this website</span>
</div>
<div class="page-header-actions">
<a class="btn btn-primary" href="https://apps.apple.com/us/app/portfolio-journal/id6757678318?pt=123456&amp;ct=privacy_page&amp;mt=8">Download on the App Store</a>
</div>
</div>
</section>
security.html
+3
View File
@@ -20,8 +20,11 @@
<link rel="icon" href="assets/icons/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="assets/icons/apple-touch-icon.svg">
<link rel="preconnect" href="https://apps.apple.com">
<link rel="preconnect" href="https://plausible.io">
<link rel="stylesheet" href="assets/css/style.css">
<script defer data-domain="portfoliojournal.app" src="https://plausible.io/js/script.js"></script>
<script src="assets/js/config.js"></script>
<script src="assets/js/main.js" defer></script>
</head>
status.html
+3
View File
@@ -20,8 +20,11 @@
<link rel="icon" href="assets/icons/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="assets/icons/apple-touch-icon.svg">
<link rel="preconnect" href="https://apps.apple.com">
<link rel="preconnect" href="https://plausible.io">
<link rel="stylesheet" href="assets/css/style.css">
<script defer data-domain="portfoliojournal.app" src="https://plausible.io/js/script.js"></script>
<script src="assets/js/config.js"></script>
<script src="assets/js/main.js" defer></script>
</head>
support.html
+6
View File
@@ -20,8 +20,11 @@
<link rel="icon" href="assets/icons/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="assets/icons/apple-touch-icon.svg">
<link rel="preconnect" href="https://apps.apple.com">
<link rel="preconnect" href="https://plausible.io">
<link rel="stylesheet" href="assets/css/style.css">
<script defer data-domain="portfoliojournal.app" src="https://plausible.io/js/script.js"></script>
<script src="assets/js/config.js"></script>
<script src="assets/js/main.js" defer></script>
</head>
@@ -54,6 +57,9 @@
<div class="container">
<h1>Support</h1>
<p>We are here to help you stay on track with your portfolio journaling.</p>
<div class="page-header-actions">
<a class="btn btn-primary" href="https://apps.apple.com/us/app/portfolio-journal/id6757678318?pt=123456&amp;ct=support_page&amp;mt=8">Download on the App Store</a>
</div>
</div>
</section>
terms.html
+3
View File
@@ -20,8 +20,11 @@
<link rel="icon" href="assets/icons/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="assets/icons/apple-touch-icon.svg">
<link rel="preconnect" href="https://apps.apple.com">
<link rel="preconnect" href="https://plausible.io">
<link rel="stylesheet" href="assets/css/style.css">
<script defer data-domain="portfoliojournal.app" src="https://plausible.io/js/script.js"></script>
<script src="assets/js/config.js"></script>
<script src="assets/js/main.js" defer></script>
</head>
website-share-page.html
+6 -3
View File
@@ -35,9 +35,12 @@
<!-- Favicon -->
<link rel="icon" type="image/png" href="/favicon.png">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="preconnect" href="https://apps.apple.com">
<link rel="preconnect" href="https://plausible.io">
<!-- Canonical URL -->
<link rel="canonical" href="https://portfoliojournal.app/share">
<script defer data-domain="portfoliojournal.app" src="https://plausible.io/js/script.js"></script>
<!-- Schema.org structured data for SEO/AEO -->
<script type="application/ld+json">
@@ -49,7 +52,7 @@
"applicationCategory": "FinanceApplication",
"description": "Track your investment portfolio, set financial goals, and monitor your progress with beautiful charts and predictions.",
"url": "https://portfoliojournal.app",
"downloadUrl": "https://apps.apple.com/app/portfolio-journal/id6744983373",
"downloadUrl": "https://apps.apple.com/us/app/portfolio-journal/id6757678318?pt=123456&ct=homepage_other&mt=8",
"screenshot": "https://portfoliojournal.app/images/og-share-card.png",
"author": {
"@type": "Organization",
@@ -180,7 +183,7 @@
<span class="feature">Privacy Focused</span>
</div>
<a href="https://apps.apple.com/app/portfolio-journal/id6744983373" class="download-btn">
<a href="https://apps.apple.com/us/app/portfolio-journal/id6757678318?pt=123456&amp;ct=homepage_other&amp;mt=8" class="download-btn">
<svg viewBox="0 0 24 24" fill="currentColor">
<path d="M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.81-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11z"/>
</svg>
@@ -196,7 +199,7 @@
<script>
// Uncomment to enable auto-redirect
// setTimeout(function() {
// window.location.href = 'https://apps.apple.com/app/portfolio-journal/id6744983373';
// window.location.href = 'https://apps.apple.com/us/app/portfolio-journal/id6757678318?pt=123456&ct=homepage_other&mt=8';
// }, 3000);
</script>
</body>