Package com.oorian.html.layout

Class HeroLayout

java.lang.Object
com.oorian.html.Element<HeroLayout>
com.oorian.html.VisualElement<HeroLayout>
com.oorian.html.StyledElement<HeroLayout>
com.oorian.html.layout.PageLayout<HeroLayout>
com.oorian.html.layout.HeroLayout
public class HeroLayout extends PageLayout<HeroLayout>
A layout with a prominent hero section followed by content sections.

HeroLayout is designed for landing pages and marketing sites where a large, attention-grabbing hero section leads into additional content sections below.

Structure:

 ┌──────────────────────────────────────┐
 │                                      │
 │              Hero                    │
 │         (Full Width)                 │
 │                                      │
 ├──────────────────────────────────────┤
 │           Content Section 1          │
 ├──────────────────────────────────────┤
 │           Content Section 2          │
 ├──────────────────────────────────────┤
 │              ...                     │
 └──────────────────────────────────────┘

Features:

  • Full-width or viewport-height hero section
  • Centered hero content option
  • Multiple content sections below hero
  • Background image/color support for hero
  • Overlay support for hero text readability

Usage:


 // Basic hero layout
 HeroLayout page = new HeroLayout();
 page.hero(heroContent)
     .addSection(featuresSection)
     .addSection(testimonialsSection)
     .addSection(ctaSection);

 // Full viewport hero
 HeroLayout landing = new HeroLayout();
 landing.fullViewportHero()
        .heroBackground("url('/images/hero.jpg')")
        .heroOverlay(0.5)
        .hero(heroContent);

 // Centered hero content
 landing.centerHeroContent();
Since:
2025
Version:
1.0
Author:
Marvin P. Warble Jr.
See Also:

  • Constructor Details

    • HeroLayout

      public HeroLayout()
      Constructs a HeroLayout with default configuration.

  • Method Details

    • initialize

      protected void initialize()
      Builds the element tree for the layout.
      Overrides:
      initialize in class StyledElement<HeroLayout>

    • hero

      public HeroLayout hero(Element<?> content)
      Sets the hero section content.
      Parameters:
      content - the hero content element
      Returns:
      this HeroLayout for method chaining

    • addSection

      public HeroLayout addSection(Element<?> section)
      Adds a content section below the hero.
      Parameters:
      section - the section element to add
      Returns:
      this HeroLayout for method chaining

    • fullViewportHero

      public HeroLayout fullViewportHero()
      Makes the hero section fill the full viewport height.
      Returns:
      this HeroLayout for method chaining

    • setHeroHeight

      public HeroLayout setHeroHeight(int height)
      Sets a specific height for the hero section.
      Parameters:
      height - the height in pixels
      Returns:
      this HeroLayout for method chaining

    • setHeroHeight

      public HeroLayout setHeroHeight(String height)
      Sets a specific height for the hero section.
      Parameters:
      height - the height value (e.g., "500px", "60vh", "80%")
      Returns:
      this HeroLayout for method chaining

    • setHeroMinHeight

      public HeroLayout setHeroMinHeight(String minHeight)
      Sets a minimum height for the hero section.
      Parameters:
      minHeight - the minimum height value (e.g., "400px", "50vh")
      Returns:
      this HeroLayout for method chaining

    • centerHeroContent

      public HeroLayout centerHeroContent()
      Centers the hero content both horizontally and vertically.
      Returns:
      this HeroLayout for method chaining

    • setHeroBackground

      public HeroLayout setHeroBackground(String color)
      Sets a background color for the hero section.
      Parameters:
      color - the background color
      Returns:
      this HeroLayout for method chaining

    • setHeroBackgroundImage

      public HeroLayout setHeroBackgroundImage(String imageUrl)
      Sets a background image for the hero section.
      Parameters:
      imageUrl - the background image URL (e.g., "url('/images/hero.jpg')")
      Returns:
      this HeroLayout for method chaining

    • setHeroOverlay

      public HeroLayout setHeroOverlay(double opacity)
      Adds a dark overlay to the hero for better text readability.
      Parameters:
      opacity - the overlay opacity (0.0 to 1.0)
      Returns:
      this HeroLayout for method chaining

    • setHeroOverlayColor

      public HeroLayout setHeroOverlayColor(String color)
      Adds a colored overlay to the hero.
      Parameters:
      color - the overlay color (e.g., "rgba(0, 0, 0, 0.5)")
      Returns:
      this HeroLayout for method chaining

    • setHeroPadding

      public HeroLayout setHeroPadding(int padding)
      Sets padding for the hero content area.
      Parameters:
      padding - the padding in pixels
      Returns:
      this HeroLayout for method chaining

    • setHeroPadding

      public HeroLayout setHeroPadding(String padding)
      Sets padding for the hero content area.
      Parameters:
      padding - the padding value (e.g., "2rem", "48px")
      Returns:
      this HeroLayout for method chaining

    • getHeroSection

      public Div getHeroSection()
      Returns the hero section element for advanced customization.
      Returns:
      the hero section div

    • getHeroContent

      public Div getHeroContent()
      Returns the hero content element for advanced customization.
      Returns:
      the hero content div

    • getHeroOverlay

      public Div getHeroOverlay()
      Returns the hero overlay element for advanced customization.
      Returns:
      the hero overlay div

    • getContentArea

      public Div getContentArea()
      Returns the content area element for advanced customization.
      Returns:
      the content area div

    • lightOverlay

      public HeroLayout lightOverlay()
      Applies a light overlay (30% opacity black).
      Returns:
      this HeroLayout for method chaining

    • mediumOverlay

      public HeroLayout mediumOverlay()
      Applies a medium overlay (50% opacity black).
      Returns:
      this HeroLayout for method chaining

    • darkOverlay

      public HeroLayout darkOverlay()
      Applies a dark overlay (70% opacity black).
      Returns:
      this HeroLayout for method chaining

    • setHeroGradient

      public HeroLayout setHeroGradient(String fromColor, String toColor)
      Sets a gradient background for the hero section.
      Parameters:
      fromColor - the starting color
      toColor - the ending color
      Returns:
      this HeroLayout for method chaining

    • setHeroVerticalGradient

      public HeroLayout setHeroVerticalGradient(String fromColor, String toColor)
      Sets a vertical gradient background for the hero section.
      Parameters:
      fromColor - the starting color (top)
      toColor - the ending color (bottom)
      Returns:
      this HeroLayout for method chaining

    • fullscreenCentered

      public HeroLayout fullscreenCentered()
      Configures a full viewport hero with centered content.

      Combines fullViewportHero() and centerHeroContent() for common landing page pattern.

      Returns:
      this HeroLayout for method chaining

    • halfViewportHero

      public HeroLayout halfViewportHero()
      Configures a half-viewport hero (50vh).
      Returns:
      this HeroLayout for method chaining

    • smallHero

      public HeroLayout smallHero()
      Applies a small hero height (300px).
      Returns:
      this HeroLayout for method chaining

    • mediumHero

      public HeroLayout mediumHero()
      Applies a medium hero height (500px).
      Returns:
      this HeroLayout for method chaining

    • largeHero

      public HeroLayout largeHero()
      Applies a large hero height (700px).
      Returns:
      this HeroLayout for method chaining

    • sections

      public HeroLayout sections(Element<?>... sections)
      Adds multiple content sections at once.
      Parameters:
      sections - the section elements to add
      Returns:
      this HeroLayout for method chaining