justin/new-site
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(site): add TrustStrip component (legitimately-earned trust seals: SSL Labs A+, Security Headers A, Stripe PCI, TLS/HSTS, SOC 2 datacenter)

Browse source
This commit is contained in:
justin 2026-06-06 00:12:23 -05:00
parent 68333148e6
commit 60ec4599b9
1 changed files with 130 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

130
site/src/components/TrustStrip.astro Normal file
View file

@ -0,0 +1,130 @@
---
// Site-wide trust strip: ONLY signals we have legitimately earned.
// - Qualys SSL Labs A+ (verified 2026-06: live report links to ssllabs.com)
// - SecurityHeaders.com A (verified 2026-06)
// - Payments via Stripe (PCI DSS Level 1) - we process exclusively through Stripe
// - 256-bit TLS / HTTPS (Let's Encrypt, TLS 1.2/1.3, HSTS preload)
// - Hosted in a SOC 2 Type II compliant data center (infrastructure attestation)
//
// Deliberately NO government/regulator logos (CMS/NPPES/FCC/Medicare) and NO
// self-claimed certs we don't hold. Each badge is defensible and, where a public
// report exists, links to the live verification.
//
// Props let order/landing pages tighten or relax the wording without forking.
export interface Props {
variant?: "full" | "compact";
/** Show the live "Verify" links (default true). */
links?: boolean;
class?: string;
}
const { variant = "full", links = true, class: extraClass = "" } = Astro.props;
const compact = variant === "compact";
---
<section class={`pw-trust ${compact ? "pw-trust--compact" : ""} ${extraClass}`} aria-label="Security and trust">
<ul class="pw-trust__list" role="list">
<li class="pw-trust__item">
<svg class="pw-trust__icon" viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M12 1 3 5v6c0 5 3.8 9.7 9 11 5.2-1.3 9-6 9-11V5l-9-4Zm0 10.9h7c-.5 3.9-3.1 7.4-7 8.5V12H5V6.3l7-3.1v8.7Z"/></svg>
<div class="pw-trust__txt">
<span class="pw-trust__h">SSL Labs <strong>A+</strong></span>
{links && <a class="pw-trust__v" href="https://www.ssllabs.com/ssltest/analyze.html?d=performancewest.net" target="_blank" rel="noopener nofollow">Verify</a>}
</div>
</li>
<li class="pw-trust__item">
<svg class="pw-trust__icon" viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M12 1 3 5v6c0 5 3.8 9.7 9 11 5.2-1.3 9-6 9-11V5l-9-4Zm-1.2 14.4L7 11.6l1.4-1.4 2.4 2.4 4.8-4.8L17 9.2l-6.2 6.2Z"/></svg>
<div class="pw-trust__txt">
<span class="pw-trust__h">Security Headers <strong>A</strong></span>
{links && <a class="pw-trust__v" href="https://securityheaders.com/?q=performancewest.net" target="_blank" rel="noopener nofollow">Verify</a>}
</div>
</li>
<li class="pw-trust__item">
<svg class="pw-trust__icon" viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M17 8V7a5 5 0 0 0-10 0v1H5v14h14V8h-2Zm-8 0V7a3 3 0 0 1 6 0v1H9Zm3 9a2 2 0 1 1 0-4 2 2 0 0 1 0 4Z"/></svg>
<div class="pw-trust__txt">
<span class="pw-trust__h">256-bit <strong>TLS</strong></span>
<span class="pw-trust__s">HSTS preloaded</span>
</div>
</li>
<li class="pw-trust__item">
<svg class="pw-trust__icon" viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M4 5h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2Zm0 4v8h16V9H4Zm2 5h6v2H6v-2Z"/></svg>
<div class="pw-trust__txt">
<span class="pw-trust__h">Payments by <strong>Stripe</strong></span>
<span class="pw-trust__s">PCI DSS Level 1</span>
</div>
</li>
<li class="pw-trust__item">
<svg class="pw-trust__icon" viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M12 2 3 7v6c0 5 3.8 9.4 9 11 5.2-1.6 9-6 9-11V7l-9-5Zm0 4.7L17 9v4c0 3.4-2.4 6.6-5 7.7-2.6-1.1-5-4.3-5-7.7V9l5-2.3Z"/></svg>
<div class="pw-trust__txt">
<span class="pw-trust__h"><strong>SOC 2</strong> Type II</span>
<span class="pw-trust__s">Compliant data center</span>
</div>
</li>
</ul>
</section>
<style>
.pw-trust {
border-top: 1px solid #e5e7eb;
background: #f9fafb;
padding: 1rem 1.25rem;
}
.pw-trust--compact {
border: 1px solid #e5e7eb;
border-radius: 12px;
background: #fff;
padding: 0.65rem 0.9rem;
margin: 1rem 0;
}
.pw-trust__list {
list-style: none;
margin: 0 auto;
padding: 0;
max-width: 72rem;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 1.5rem 2rem;
}
.pw-trust--compact .pw-trust__list { gap: 0.75rem 1.25rem; }
.pw-trust__item {
display: flex;
align-items: center;
gap: 0.55rem;
color: #374151;
}
.pw-trust__icon {
width: 1.5rem;
height: 1.5rem;
flex: 0 0 auto;
color: #15803d; /* trust green */
}
.pw-trust--compact .pw-trust__icon { width: 1.2rem; height: 1.2rem; }
.pw-trust__txt { display: flex; flex-direction: column; line-height: 1.15; }
.pw-trust__h {
font-size: 0.82rem;
font-weight: 600;
color: #111827;
white-space: nowrap;
}
.pw-trust__h strong { color: #15803d; font-weight: 800; }
.pw-trust__s {
font-size: 0.7rem;
color: #6b7280;
white-space: nowrap;
}
.pw-trust__v {
font-size: 0.68rem;
color: #2563eb;
text-decoration: none;
font-weight: 600;
}
.pw-trust__v:hover { text-decoration: underline; }
@media (max-width: 640px) {
.pw-trust__list { gap: 1rem 1.25rem; }
.pw-trust__s { display: none; }
}
</style>