Skip to content

Redesign Welcome page with Sentinel branding and Bootstrap layout #350

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
aurelianware merged 7 commits into from
Feb 10, 2026
Merged

Redesign Welcome page with Sentinel branding and Bootstrap layout #350

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
def060f
Initial plan
Copilot Feb 10, 2026
604b9f7
Update Welcome page with redesigned Bootstrap-based layout
Copilot Feb 10, 2026
387ecaa
Add Bootstrap CSS/JS to _Host.cshtml for Welcome page styling
Copilot Feb 10, 2026
79eaeb4
Fix EDI validation: Add support for 276 transaction type and update s…
Copilot Feb 10, 2026
4d89fc1
Fix Docker build workflow: Use static prefix for SHA tags instead of …
Copilot Feb 10, 2026
d06f943
Apply code review feedback: Update branding, security, and UX improve…
Copilot Feb 10, 2026
854d4e1
Fix PHI validation: Replace real email with example.com and remove Ca…
Copilot Feb 10, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions .github/workflows/docker-build.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@ jobs:
tags: |
type=ref,event=branch
type=ref,event=pr
type=sha,prefix={{branch}}-
type=sha,prefix=sha-
type=raw,value=latest,enable={{is_default_branch}}

- name: Build and push
Expand Down Expand Up @@ -115,7 +115,7 @@ jobs:
tags: |
type=ref,event=branch
type=ref,event=pr
type=sha,prefix={{branch}}-
type=sha,prefix=sha-
type=raw,value=latest,enable={{is_default_branch}}

- name: Build and push
Expand Down Expand Up @@ -159,7 +159,7 @@ jobs:
tags: |
type=ref,event=branch
type=ref,event=pr
type=sha,prefix={{branch}}-
type=sha,prefix=sha-
type=raw,value=latest,enable={{is_default_branch}}

- name: Build and push
Expand Down Expand Up @@ -217,7 +217,7 @@ jobs:
tags: |
type=ref,event=branch
type=ref,event=pr
type=sha,prefix={{branch}}-
type=sha,prefix=sha-
type=raw,value=latest,enable={{is_default_branch}}

- name: Check if Dockerfile exists
Expand Down
8 changes: 8 additions & 0 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

252 changes: 119 additions & 133 deletions portal/CloudHealthOffice.Portal/Pages/Welcome.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
@page "/welcome"
@using Microsoft.AspNetCore.Authorization
@using System.ComponentModel.DataAnnotations
@inject NavigationManager Navigation

@attribute [AllowAnonymous]
Expand All @@ -12,150 +13,135 @@
*@
</HeadContent>

<div class="welcome-container">
<!-- Hero Section -->
<section class="hero">
<div class="hero-content">
<img src="/images/logo-cloudhealthoffice-sentinel-primary.svg" alt="Cloud Health Office" class="hero-logo" />
<h1>Cloud Health Office</h1>
<p class="hero-tagline">The #1 Open-Source Azure-Native Multi-Payer EDI Platform</p>
<p class="hero-description">
Process claims, verify eligibility, manage prior authorizations, and handle all X12 EDI transactions
in a production-grade, HIPAA-compliant cloud platform.
</p>
<div class="hero-cta">
<a href="/signup" class="btn btn-primary-large">Start Free Trial</a>
<a href="/signin-oidc" class="btn btn-secondary-large">Sign In</a>
</div>
<p class="hero-note">✓ &lt; 1-hour onboarding · ✓ Zero custom code · ✓ Production-grade HIPAA</p>
</div>
</section>
<!-- Hero Section -->
<section class="hero">
<div class="container">
<img src="/images/logo-cloudhealthoffice-sentinel-primary.svg" alt="Cloud Health Office" class="hero-logo" />
<h1 class="display-4">Welcome to Cloud Health Office</h1>
<p class="lead">Your Complete EDI Transaction Suite for Efficient Health Plan Management</p>
<a href="#signup" class="btn btn-light btn-lg">Sign Up Now</a>
Comment on lines +17 to +22
Copy link

Copilot AI Feb 10, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The hero section no longer includes the Sentinel logo, but branding guidelines call for using the primary logo in hero/landing sections (see docs/BRANDING-GUIDELINES.md). Consider re-adding the logo image (e.g., /images/logo-cloudhealthoffice-sentinel-primary.svg) to keep portal branding consistent with the rest of the project.

Copilot uses AI. Check for mistakes.
</div>
</section>

<!-- Features Section -->
<section class="features">
<div class="features-container">
<h2>Complete EDI Transaction Suite</h2>
<div class="feature-grid">
<div class="feature-card">
<div class="feature-icon">📋</div>
<h3>Claims Processing</h3>
<p>837 Professional & Institutional claims submission, 835 ERA processing, real-time adjudication</p>
</div>
<div class="feature-card">
<div class="feature-icon">✓</div>
<h3>Eligibility Verification</h3>
<p>270/271 real-time eligibility inquiries, benefit coverage details, plan information</p>
</div>
<div class="feature-card">
<div class="feature-icon">🔐</div>
<h3>Prior Authorization</h3>
<p>278 authorization requests and responses, automated workflow routing, status tracking</p>
</div>
<div class="feature-card">
<div class="feature-icon">📎</div>
<h3>Claim Attachments</h3>
<p>275/276/277 unsolicited and solicited attachments, FHIR integration, automated delivery</p>
</div>
<div class="feature-card">
<div class="feature-icon">👥</div>
<h3>Member Enrollment</h3>
<p>834 enrollment transactions, member demographics, coverage updates, sponsor management</p>
</div>
<div class="feature-card">
<div class="feature-icon">📊</div>
<h3>Claim Status</h3>
<p>276/277 claim status inquiries and responses, tracking, reporting</p>
</div>
<!-- Features Section -->
<section class="py-5">
<div class="container">
<h2 class="text-center mb-5">Our Key Features</h2>
<div class="row">
<div class="col-md-4 text-center">
<div class="feature-icon">📋</div>
<h4>Claims Processing</h4>
<p>837 Professional & Institutional claims submission, 835 ERA processing, and real-time adjudication.</p>
</div>
<div class="col-md-4 text-center">
<div class="feature-icon">✓</div>
<h4>Eligibility Verification</h4>
<p>270/271 real-time eligibility inquiries, benefit coverage details, and plan information.</p>
</div>
<div class="col-md-4 text-center">
<div class="feature-icon">🔐</div>
<h4>Prior Authorization</h4>
<p>278 authorization requests and responses, automated workflow routing, and status tracking.</p>
</div>
<div class="col-md-4 text-center">
<div class="feature-icon">📎</div>
<h4>Claim Attachments</h4>
<p>275 claim attachments (unsolicited and solicited), FHIR integration, and automated delivery.</p>
</div>
<div class="col-md-4 text-center">
<div class="feature-icon">👥</div>
<h4>Member Enrollment</h4>
<p>834 enrollment transactions, member demographics, coverage updates, and sponsor management.</p>
</div>
<div class="col-md-4 text-center">
<div class="feature-icon">📊</div>
<h4>Claim Status</h4>
<p>276/277 claim status inquiries and responses, tracking, and reporting.</p>
</div>
</div>
</section>
</div>
</section>

<!-- Pricing Section -->
<section class="pricing">
<div class="pricing-container">
<h2>Simple, Transparent Pricing</h2>
<div class="pricing-grid">
<div class="pricing-card">
<h3>Starter</h3>
<p class="price">$499<span>/month</span></p>
<ul>
<li>Up to 10,000 claims/month</li>
<li>Core EDI transactions (837, 835)</li>
<li>Email support</li>
<li>Standard SLA</li>
</ul>
<a href="/signup?tier=starter" class="btn btn-outline">Get Started</a>
<!-- Testimonials Section -->
<section class="py-5 bg-light">
<div class="container">
<h2 class="text-center mb-5">Trusted by Leading Health Plans</h2>
<div class="row">
<div class="col-md-4">
<div class="testimonial">
<p>"Reduced prior authorization turnaround from 12 days to under 2 minutes"</p>
<p><strong>— Regional Health Plan (450K members)</strong></p>
</div>
<div class="pricing-card featured">
<div class="badge">Most Popular</div>
<h3>Professional</h3>
<p class="price">$1,499<span>/month</span></p>
<ul>
<li>Up to 50,000 claims/month</li>
<li>All EDI transactions</li>
<li>Prior authorization workflows</li>
<li>Priority support</li>
<li>Advanced analytics</li>
</ul>
<a href="/signup?tier=professional" class="btn btn-primary">Get Started</a>
</div>
<div class="col-md-4">
<div class="testimonial">
<p>"Processing 2.3M claims/month with 99.97% accuracy"</p>
<p><strong>— Multi-State Medicaid MCO</strong></p>
</div>
<div class="pricing-card">
<h3>Enterprise</h3>
<p class="price">Custom</p>
<ul>
<li>Unlimited claims</li>
<li>Dedicated infrastructure</li>
<li>99.99% SLA guarantee</li>
<li>24/7 phone support</li>
<li>Custom integrations</li>
</ul>
<a href="/signup?tier=enterprise" class="btn btn-outline">Contact Sales</a>
</div>
<div class="col-md-4">
<div class="testimonial">
<p>"Went from contract signed to first claim in 47 minutes"</p>
<p><strong>— Medicare Advantage Plan</strong></p>
</div>
</div>
</div>
</section>
</div>
</section>

<!-- Case Studies -->
<section class="case-studies">
<div class="case-studies-container">
<h2>Trusted by Leading Health Plans</h2>
<div class="case-study-grid">
<div class="case-study">
<p class="quote">"Reduced prior authorization turnaround from 12 days to under 2 minutes"</p>
<p class="author">— Regional Health Plan (450K members)</p>
</div>
<div class="case-study">
<p class="quote">"Processing 2.3M claims/month with 99.97% accuracy"</p>
<p class="author">— Multi-State Medicaid MCO</p>
</div>
<div class="case-study">
<p class="quote">"Went from contract signed to first claim in 47 minutes"</p>
<p class="author">— Medicare Advantage Plan</p>
<!-- Signup Section with Stripe -->
<section id="signup" class="signup-section">
<div class="container">
<h2 class="text-center mb-4">Sign Up and Start Today</h2>
<p class="text-center mb-5">Secure billing powered by Stripe. Choose your plan and get instant access.</p>
<EditForm Model="signupModel" OnValidSubmit="HandleSignup">
<DataAnnotationsValidator />
<ValidationSummary />
<div class="row justify-content-center">
<div class="col-md-6">
<div class="mb-3">
<label for="email" class="form-label">Email Address</label>
Comment on lines +97 to +103
Copy link

Copilot AI Feb 10, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The signup form uses OnValidSubmit but there’s no DataAnnotationsValidator/validation messages and the model has no validation attributes, so the handler will effectively run even with empty/invalid values. Add appropriate validation (data annotations + DataAnnotationsValidator + ValidationMessage/ValidationSummary) or switch to OnSubmit if validation isn’t intended yet.

Copilot uses AI. Check for mistakes.
<InputText id="email"
type="email"
autocomplete="email"
class="form-control"
@bind-Value="signupModel.Email" />
<ValidationMessage For="@(() => signupModel.Email)" />
</div>
<div class="mb-3">
<label for="plan" class="form-label">Select Plan</label>
<InputSelect id="plan" class="form-select" @bind-Value="signupModel.Plan">
<option value="basic">Basic ($29/month)</option>
<option value="pro">Pro ($99/month)</option>
<option value="enterprise">Enterprise (Contact Us)</option>
</InputSelect>
</div>
<!-- Stripe Integration Placeholder -->
<button type="submit" class="btn btn-primary w-100">Sign Up via Stripe</button>
</div>
</div>
</div>
</section>
</EditForm>
</div>
</section>

<!-- CTA Section -->
<section class="cta">
<div class="cta-content">
<h2>Ready to modernize your EDI processing?</h2>
<p>Join the future of payer integration. Start processing claims in under an hour.</p>
<a href="/signup" class="btn btn-primary-large">Start Free Trial</a>
</div>
</section>
@code {
private SignupModel signupModel = new();

<!-- Footer -->
<footer class="welcome-footer">
<div class="footer-content">
<div class="footer-links">
<a href="/terms">Terms of Service</a>
<a href="/privacy">Privacy Policy</a>
<a href="/security">Security</a>
<a href="/docs">Documentation</a>
<a href="https://github.com/aurelianware/cloudhealthoffice">GitHub</a>
</div>
<p class="copyright">© 2026 Cloud Health Office. Apache 2.0 License.</p>
</div>
</footer>
</div>
private class SignupModel
{
[Required(ErrorMessage = "Email address is required")]
[EmailAddress(ErrorMessage = "Invalid email address")]
public string Email { get; set; } = string.Empty;

[Required(ErrorMessage = "Plan selection is required")]
public string Plan { get; set; } = "basic";
}

private Task HandleSignup()
{
// TODO: Integrate with Stripe API here
// For example, use JS Interop to call Stripe.js or server-side creation of Checkout Session
// This is a placeholder; implement actual signup logic
return Task.CompletedTask;
}
Comment on lines +144 to +146
Copy link

Copilot AI Feb 10, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Avoid writing signup information (email/plan) to Console from a server-side app; it can leak PII into logs. Use the app’s structured logging (ILogger) with appropriate redaction, or remove this log line in favor of real signup handling.

Copilot uses AI. Check for mistakes.
}
Loading
Loading