APEX SaaS

APEX SaaS is a software-product and developer-tool subtheme for SaaS marketing, pricing, documentation, integration, and service-status experiences built on APEX.

It combines a dark-mode default, indigo-and-cyan tokens, sans and monospace type stacks, and five Single Directory Components for bento features, pricing, code previews, partner logos, and operational status.

Product-led visual system

The theme supports generous marketing presentation alongside denser product, pricing, and documentation content. It includes status colors, code-surface tokens, a 70-character reading measure, and a light-mode adjustment while retaining the parent theme's 28 regions.

Geist, JetBrains Mono, Inter, and fallback stacks are declared but no font files are bundled. Sites must provide licensed font assets or use available fallbacks.

Five SaaS components

• Bento grid: up to eight feature cards with four span choices, optional accent, icon, image, and destination; the grid collapses responsively.
• Pricing table: up to four tiers with numeric or custom pricing, feature lists, destinations, a highlighted tier, and monthly or annual presentation state.
• Code block: filename, language, preformatted code, line-number option, and copy-button presentation.
• Integration logos: up to 16 lazy-loaded partner marks and destinations in a responsive logo strip, plus an optional marketplace destination.
• Status strip: operational, degraded, outage, or maintenance presentation with uptime period, a status-page destination, and optional last-updated time.

Container queries move bento, pricing, and logo layouts through one-, two-, four-, and eight-column arrangements. The styles include visible focus, reduced-motion, high-contrast, forced-color, and print handling; complex grids linearize for print.

The components do not provide billing, checkout, entitlements, pricing calculations, syntax highlighting, clipboard JavaScript, integration discovery, uptime monitoring, incident management, or a status backend. Their props and templates present state supplied by the site.

Current installation scope

The package contains three base stylesheets, two page wrappers, one settings override, five SDCs, eight standard optional block placements, and all 28 APEX regions. The wrappers add SaaS identity classes and delegate to the parent page template.

The planned product, pricing, and documentation landing templates and demo content do not ship. The front-page wrapper describes a bento-and-dashboard archetype but does not place components or include a dashboard. Build those integrations using real product content and approved media.

Software-product implementation guidance

1. Connect pricing to one authoritative product catalog and state currency, taxes, billing period, limits, trials, and renewal terms clearly.
2. Implement the monthly/annual control with accessible state, URL behavior, and server-rendered fallbacks.
3. Add reviewed syntax highlighting and clipboard behavior only if required.
4. Feed operational status from a monitored source with timestamps and incident details.
5. Obtain permission for customer and integration logos and avoid implying unsupported partnerships.
6. Configure documentation navigation, aliases, canonical URLs, metadata, structured data, redirects, and product analytics separately.

Requirements and installation

• Drupal 11.3 or later within Drupal 11
• PHP 8.3 or later
• APEX Theme and its declared module stack

composer require 'drupal/apex_saas:^1.0'
drush theme:enable apex_saas
drush config:set system.theme default apex_saas -y
drush cr

Accessibility, product claims, and SEO

The styles include reduced-motion, contrast, forced-colors, and print handling. Test the complete experience for focus, keyboard operation, toggle state, code scrolling, tables, link purpose, contrast in both modes, zoom, reflow, and assistive-technology output.

Search visibility depends on useful product and documentation content, stable information architecture, descriptive titles and links, canonicalization, metadata, valid product or software structured data, internal navigation, and measured performance. Keep prices, availability, compatibility, integrations, uptime, security, and performance claims current and evidenced.

Support and maintainer

Report reproducible issues through Drupal.org with the component, props, active APEX versions, Drupal/PHP versions, active color mode, browser, breakpoint, and exact steps.

APEX SaaS is created and maintained by Alaa Haddad, Drupal developer and architect at Flash Web Center, LLC.

Developed and maintained by Alaa Haddad of Flash Web Center, LLC.

AI disclosure: AI tools assisted with drafting and reviewing this project description. The maintainer verified the final content against the project source.