fh-matui 0.9.11__py3-none-any.whl → 0.9.13__py3-none-any.whl

fh_matui/__init__.py

@@ -1 +1 @@
-__version__ = "0.9.10"
+__version__ = "0.9.12"

fh_matui/components.py

@@ -4,7 +4,7 @@
 
 # %% auto 0
 __all__ = ['BUTTON_SPECIALS', 'ButtonT', 'ANCHOR_SPECIALS', 'AT', 'NavToggleButton', 'SpaceT', 'GridSpanT', 'GridCell', 'Grid',
-           'DivLAligned', 'DivVStacked', 'DivHStacked', 'DivRAligned', 'DivCentered', 'DivFullySpaced', 'Icon',
+           'DivHStacked', 'DivLAligned', 'DivVStacked', 'DivRAligned', 'DivCentered', 'DivFullySpaced', 'Icon',
            'NavBar', 'Modal', 'ModalButton', 'ModalCancel', 'ModalConfirm', 'ModalTitle', 'ModalBody', 'ModalFooter',
            'Field', 'LabelInput', 'FormLabel', 'CheckboxX', 'Radio', 'Switch', 'TextArea', 'Range', 'Select',
            'FormGrid', 'Progress', 'LoadingIndicator', 'Table', 'Td', 'Th', 'Thead', 'Tbody', 'Tfoot', 'TableFromLists',
@@ -29,9 +29,13 @@ from nbdev.showdoc import show_doc
 # %% ../nbs/02_components.ipynb 6
 #| code-fold: true
 def NavToggleButton(target, icon='menu', **kwargs):
-    """Create a navigation toggle button that toggles the 'max' class on the target element"""
+    """Create a navigation toggle button that toggles the 'max' class on the target element.
+    
+    Also toggles icon between 'menu' and 'menu_open' based on nav state.
+    """
     cls = kwargs.get('cls', 'circle transparent')
-    onclick = f"toggleNav('{target}'); return false;"
+    # Inline JS: toggle nav's max class AND change this button's icon
+    onclick = f"var nav=document.querySelector('{target}');if(nav){{nav.classList.toggle('max');var i=this.querySelector('i');if(i)i.textContent=nav.classList.contains('max')?'menu_open':'menu'}};return false;"
     kwargs.update({'onclick': onclick, 'cls': cls})
     return Button(I(icon), **kwargs)
 
@@ -225,19 +229,8 @@ def Grid(*cells, space=SpaceT.medium_space,
     return Div(*wrapped_cells, cls=stringify(dedupe_preserve_order(grid_cls)), **kwargs)
 
 # %% ../nbs/02_components.ipynb 16
-def DivLAligned(*c, cls='', **kwargs):
-    """MonsterUI-compatible left-aligned row using BeerCSS tokens."""
-    cls_tokens = normalize_tokens(cls)
-    tokens = ['left-align']
-    tokens.extend(cls_tokens)
-    tokens = [t for t in tokens if t]
-    return DivHStacked(*c, cls=stringify(dedupe_preserve_order(tokens)), **kwargs)
-
-
-
-# %% ../nbs/02_components.ipynb 18
-def DivVStacked(*c, responsive=True, padding=True, cls='', **kwargs):
-    """Responsive vertical stack with padding and mobile compatibility."""
+def DivHStacked(*c, responsive=True, padding=True, cls='', **kwargs):
+    """Responsive horizontal stack with padding and mobile compatibility."""
     cls_tokens = normalize_tokens(cls)
     tokens = []
     if responsive and 'responsive' not in cls_tokens:
@@ -245,7 +238,7 @@ def DivVStacked(*c, responsive=True, padding=True, cls='', **kwargs):
     if padding and 'padding' not in cls_tokens and 'no-padding' not in cls_tokens:
         tokens.append('padding')
     if 'grid' not in cls_tokens:
-        tokens.extend(['row', 'vertical'])
+        tokens.extend(['row', 'middle-align'])
     if not _has_space_token(cls_tokens):
         tokens.append(SpaceT.medium_space)
     tokens.extend(cls_tokens)
@@ -253,9 +246,20 @@ def DivVStacked(*c, responsive=True, padding=True, cls='', **kwargs):
     return Div(*c, cls=stringify(dedupe_preserve_order(tokens)), **kwargs)
 
 
-# %% ../nbs/02_components.ipynb 20
-def DivHStacked(*c, responsive=True, padding=True, cls='', **kwargs):
-    """Responsive horizontal stack with padding and mobile compatibility."""
+# %% ../nbs/02_components.ipynb 17
+def DivLAligned(*c, cls='', **kwargs):
+    """MonsterUI-compatible left-aligned row using BeerCSS tokens."""
+    cls_tokens = normalize_tokens(cls)
+    tokens = ['left-align']
+    tokens.extend(cls_tokens)
+    tokens = [t for t in tokens if t]
+    return DivHStacked(*c, cls=stringify(dedupe_preserve_order(tokens)), **kwargs)
+
+
+
+# %% ../nbs/02_components.ipynb 19
+def DivVStacked(*c, responsive=True, padding=True, cls='', **kwargs):
+    """Responsive vertical stack with padding and mobile compatibility."""
     cls_tokens = normalize_tokens(cls)
     tokens = []
     if responsive and 'responsive' not in cls_tokens:
@@ -263,7 +267,7 @@ def DivHStacked(*c, responsive=True, padding=True, cls='', **kwargs):
     if padding and 'padding' not in cls_tokens and 'no-padding' not in cls_tokens:
         tokens.append('padding')
     if 'grid' not in cls_tokens:
-        tokens.extend(['row', 'middle-align'])
+        tokens.extend(['row', 'vertical'])
     if not _has_space_token(cls_tokens):
         tokens.append(SpaceT.medium_space)
     tokens.extend(cls_tokens)
@@ -323,16 +327,52 @@ def Icon(icon: str, size: str = None, fill: bool = False, cls = (), **kwargs):
 
 # %% ../nbs/02_components.ipynb 32
 #| code-fold: true
-def NavBar(*children, brand=None, sticky=False, cls='', **kwargs):
-    """Horizontal navigation bar with optional brand and sticky positioning"""
-    nav_cls = f"{'sticky top' if sticky else ''} surface-container {cls}".strip()
+def NavBar(*children, brand=None, sticky=False, cls='', size='small',
+           hx_boost=True, hx_target='#main-content', **kwargs):
+    """Horizontal navigation bar with HTMX SPA navigation defaults.
+    
+    Args:
+        brand: Brand element (logo/title) positioned on the left
+        sticky: Whether navbar sticks to top on scroll
+        size: Navbar size - 'small' (default), 'medium', 'large', or None
+        hx_boost: Auto-enhance all <a> links for HTMX navigation (default True)
+        hx_target: Target element for boosted links (default '#main-content')
+    """
+    size_cls = size if size else ''
+    nav_cls = f"{'sticky top' if sticky else ''} surface-container {size_cls} {cls}".strip()
+    
+    # HTMX SPA optimizations
+    if hx_boost: kwargs['hx_boost'] = 'true'
+    if hx_target: kwargs['hx_target'] = hx_target
+    kwargs.setdefault('hx_push_url', 'true')
+    
+    # Use small-padding for compact navbar
+    padding_cls = 'small-padding' if size == 'small' else 'padding'
+    
     if brand:
-        return Nav(brand, Div(cls='max'), *children, cls=f"row middle-align padding {nav_cls}", **kwargs)
-    return Nav(*children, cls=f"padding {nav_cls}", **kwargs)
+        return Nav(brand, Div(cls='max'), *children, cls=f"row middle-align {padding_cls} {nav_cls}", **kwargs)
+    return Nav(*children, cls=f"{padding_cls} {nav_cls}", **kwargs)
 
 # %% ../nbs/02_components.ipynb 35
 def Modal(*c, id=None, footer=None, active=False, overlay='default', position=None, cls=(), **kwargs):
-    """BeerCSS modal dialog with position and overlay options."""
+    """BeerCSS modal dialog with position and overlay options.
+    
+    Always returns a list for consistent unpacking with *Modal(...).
+    When overlay is enabled, clicking the overlay closes the modal.
+    
+    Args:
+        *c: Modal content (title, body, etc.)
+        id: Modal ID for data-ui targeting
+        footer: Footer content (auto-wrapped in Nav if not already)
+        active: Whether modal starts active/visible
+        overlay: Overlay style - 'default' (plain), 'blur', 'small-blur', 
+                 'medium-blur', 'large-blur', or False/None (no overlay)
+        position: Position - None (center), 'left', 'right', 'top', 'bottom'
+        cls: Additional CSS classes
+    
+    Returns:
+        List of elements (overlay + dialog, or just [dialog] if no overlay)
+    """
     modal_cls = normalize_tokens(cls)
     
     # Add position class if specified
@@ -354,7 +394,7 @@ def Modal(*c, id=None, footer=None, active=False, overlay='default', position=No
     # Create the dialog
     dialog = Dialog(*children, id=id, cls=cls_str, **kwargs)
     
-    # Handle overlay
+    # Handle overlay - always return a list for consistent *Modal(...) unpacking
     if overlay and overlay not in [False, None]:
         overlay_classes = ['overlay']
         
@@ -372,14 +412,14 @@ def Modal(*c, id=None, footer=None, active=False, overlay='default', position=No
         overlay_cls = ' '.join(overlay_classes)
         if active:
             overlay_cls += " active"
-            
-        # Return as a list - both elements need to be at same DOM level
-        return [
-            Div(cls=overlay_cls),
-            dialog
-        ]
+        
+        # Overlay with data-ui to close modal on click (click-outside-to-close)
+        overlay_el = Div(cls=overlay_cls, data_ui=f"#{id}" if id else None)
+        
+        return [overlay_el, dialog]
     
-    return dialog
+    # No overlay - still return as list for consistent unpacking
+    return [dialog]
 
 def ModalButton(text: str, id: str, icon: str = None, cls=(), **kwargs):
     """Button that opens a modal via data-ui attribute."""
@@ -1055,33 +1095,76 @@ def NavSideBarLinks(*children, as_list=False, cls='', **kwargs):
         return Ul(*children, cls=list_cls, **kwargs)
     return Group(*children) if len(children) > 1 else (children[0] if children else Group())
 
-def NavSideBarContainer(*children, position='left', size='m', cls='', active=False, **kwargs):
-    """BeerCSS navigation sidebar/drawer component."""
+def NavSideBarContainer(*children, position='left', size='m', cls='', active=False,
+                        hx_boost=True, hx_target='#main-content', **kwargs):
+    """BeerCSS navigation sidebar with HTMX SPA navigation defaults.
+    
+    Args:
+        position: Sidebar position ('left' or 'right')
+        size: Sidebar size ('s', 'm', 'l')
+        active: Whether sidebar starts visible
+        hx_boost: Auto-enhance all <a> links for HTMX navigation (default True)
+        hx_target: Target element for boosted links (default '#main-content')
+    
+    Usage:
+        Routes should check `req.headers` for HX-Request and return content only for HTMX requests:
+        
+        @rt("/dashboard")
+        def dashboard(req):
+            content = dashboard_content()
+            if 'HX-Request' in req.headers: return content  # HTMX swap
+            return Layout(content)  # Full page load
+    """
     base_cls = f"{size} {position} surface-container"
     if active: base_cls += " active"
     nav_cls = f"{base_cls} {cls}".strip()
+    
+    # HTMX SPA optimizations
+    if hx_boost: kwargs['hx_boost'] = 'true'
+    if hx_target: kwargs['hx_target'] = hx_target
+    kwargs.setdefault('hx_push_url', 'true')
+    
     return Nav(*children, cls=nav_cls, **kwargs)
 
 # %% ../nbs/02_components.ipynb 107
 #| code-fold: true
 def Layout(*content, sidebar=None, sidebar_links=None, nav_bar=None, container_size=ContainerT.expand,
-           main_bg='surface', sidebar_id='app-sidebar', cls='', **kwargs):
-    """App layout wrapper with auto-toggle sidebar and sensible defaults."""
-    main_content = []
-    
-    if nav_bar:
-        if hasattr(nav_bar, 'attrs') and 'cls' in nav_bar.attrs:
-            if 'sticky' not in nav_bar.attrs['cls']: nav_bar.attrs['cls'] += ' sticky top'
-        main_content.append(nav_bar)
+           main_bg='surface', sidebar_id='app-sidebar', main_id='main-content', cls='', **kwargs):
+    """App layout with HTMX SPA navigation.
     
+    Args:
+        main_id: ID for main content area (default 'main-content') - use as hx-target
+        
+    HTMX SPA features:
+        - hx-boost on sidebar automatically enhances all <a> links
+        - hx-history-elt for back/forward button caching
+        - Routes should check `req.headers` for HX-Request and return content only for HTMX requests
+        
+    Usage:
+        @rt("/dashboard")
+        def dashboard(req):
+            content = dashboard_content()
+            if 'HX-Request' in req.headers: return content  # HTMX swap
+            return Layout(content)  # Full page load
+    """
+    # Build content wrapper with history caching
+    content_wrapper = None
     if content:
-        container_cls = stringify((container_size, 'padding', main_bg))
-        main_content.append(Main(*content, cls=container_cls))
+        content_wrapper = Div(*content, id=main_id, hx_history_elt='true')
     
+    # No sidebar - simple layout
     if not sidebar and not sidebar_links:
-        if main_content: return Div(*main_content, cls=cls, **kwargs)
-        else: return Div(cls=cls, **kwargs)
-    
+        result = []
+        if nav_bar:
+            if hasattr(nav_bar, 'attrs') and 'cls' in nav_bar.attrs:
+                if 'sticky' not in nav_bar.attrs['cls']: nav_bar.attrs['cls'] += ' sticky top'
+            result.append(nav_bar)
+        if content_wrapper:
+            container_cls = stringify((container_size, 'padding', main_bg))
+            result.append(Main(content_wrapper, cls=container_cls))
+        return Div(*result, cls=cls, **kwargs) if result else Div(cls=cls, **kwargs)
+    
+    # Sidebar layout with hx-boost
     sidebar_children = [NavSideBarHeader(NavToggleButton(f"#{sidebar_id}"))]
     
     if sidebar_links: sidebar_children.extend(sidebar_links)
@@ -1091,23 +1174,23 @@ def Layout(*content, sidebar=None, sidebar_links=None, nav_bar=None, container_s
     
     nav_rail = NavSideBarContainer(*sidebar_children, position='left', size='l', id=sidebar_id)
     
-    navbar_elem = None
-    content_items = []
-    for item in main_content:
-        if hasattr(item, 'tag') and item.tag == 'nav': navbar_elem = item
-        else: content_items.append(item)
-    
     layout_children = []
-    if navbar_elem: layout_children.append(navbar_elem)
+    
+    if nav_bar:
+        if hasattr(nav_bar, 'attrs') and 'cls' in nav_bar.attrs:
+            if 'sticky' not in nav_bar.attrs['cls']: nav_bar.attrs['cls'] += ' sticky top'
+        layout_children.append(nav_bar)
+    
     layout_children.append(nav_rail)
-    if content_items:
+    
+    if content_wrapper:
         container_cls = stringify((container_size, 'round', 'elevate', 'margin'))
-        layout_children.append(Main(*content_items, cls=container_cls))
+        layout_children.append(Main(content_wrapper, cls=container_cls))
     
     final_cls = f"surface-container {cls}".strip() if cls else "surface-container"
     return Div(*layout_children, cls=final_cls, **kwargs)
 
-# %% ../nbs/02_components.ipynb 111
+# %% ../nbs/02_components.ipynb 113
 #| code-fold: true
 class TextT(VEnum):
     """Text styles using BeerCSS typography classes."""
@@ -1139,7 +1222,7 @@ class TextPresets(VEnum):
     primary_link = 'link primary-text'
     muted_link = 'link secondary-text'
 
-# %% ../nbs/02_components.ipynb 112
+# %% ../nbs/02_components.ipynb 114
 #| code-fold: true
 def CodeSpan(*c, cls=(), **kwargs):
     """Inline code snippet."""
@@ -1195,7 +1278,7 @@ def Sup(*c, cls=(), **kwargs):
     cls_str = stringify(cls) if cls else None
     return fc.Sup(*c, cls=cls_str, **kwargs) if cls_str else fc.Sup(*c, **kwargs)
 
-# %% ../nbs/02_components.ipynb 114
+# %% ../nbs/02_components.ipynb 116
 #| code-fold: true
 def FAQItem(question: str, answer: str, question_cls: str = '', answer_cls: str = ''):
     """Collapsible FAQ item using details/summary.
@@ -1213,7 +1296,7 @@ def FAQItem(question: str, answer: str, question_cls: str = '', answer_cls: str
         Summary(Article(Nav(Div(question, cls=f"max bold {question_cls}".strip()), I("expand_more")), cls="round surface-variant border no-elevate")),
         Article(P(answer, cls=f"secondary-text {answer_cls}".strip()), cls="round border padding"))
 
-# %% ../nbs/02_components.ipynb 118
+# %% ../nbs/02_components.ipynb 120
 #| code-fold: true
 def CookiesBanner(message='We use cookies to enhance your experience. By continuing to visit this site you agree to our use of cookies.',
                   accept_text='Accept', decline_text='Decline', settings_text=None, policy_link='/cookies', policy_text='Learn more',

fh_matui/core.py

@@ -31,7 +31,7 @@ beer_hdrs = (
     Script(src=HEADER_URLS["mdc_js"], type='module'),
 )
 
-# %% ../nbs/01_core.ipynb 8
+# %% ../nbs/01_core.ipynb 7
 #| code-fold: true
 # All BeerCSS color names
 COLOR_NAMES = ['amber', 'blue', 'blue_grey', 'brown', 'cyan', 'deep_orange', 'deep_purple', 
@@ -88,7 +88,7 @@ ALL_HELPERS = (SIZES + WIDTH_HEIGHT + ELEVATES + DIRECTIONS + FORMS + MARGINS +
                POSITIONS + RESPONSIVE + ALIGNMENTS + BLURS + OPACITIES + SHADOWS + SPACES + 
                RIPPLES + SCROLLS + WAVES + ZOOMS + THEME_HELPERS + TYPOGRAPHY + TRIGGERS + COLOR_HELPERS)
 
-# %% ../nbs/01_core.ipynb 11
+# %% ../nbs/01_core.ipynb 10
 #| code-fold: true
 class _ThemeChain:
     """Internal class for building themed headers"""
@@ -142,14 +142,19 @@ class _ThemeChain:
                 }};
                 window.toggleNav = function(selector) {{
                     const nav = document.querySelector(selector);
-                    if (nav) {{ nav.classList.toggle('max'); }}
+                    if (nav) {{
+                        nav.classList.toggle('max');
+                        const isOpen = nav.classList.contains('max');
+                        const btn = nav.querySelector('button i, button .icon');
+                        if (btn) btn.textContent = isOpen ? 'menu_open' : 'menu';
+                    }}
                 }};
             ''')
             hdrs.append(theme_script)
         hdrs.append(Title(title))
         return tuple(hdrs)
 
-# %% ../nbs/01_core.ipynb 12
+# %% ../nbs/01_core.ipynb 11
 #| code-fold: true
 class _ThemeNamespace:
     """Namespace providing color properties that return _ThemeChain instances"""
@@ -208,7 +213,7 @@ class _ThemeNamespace:
 
 MatTheme = _ThemeNamespace()
 
-# %% ../nbs/01_core.ipynb 16
+# %% ../nbs/01_core.ipynb 15
 #| code-fold: true
 class BeerCssChain:
     """Base class for chaining Beer CSS helper classes together"""

fh_matui/datatable.py

@@ -452,7 +452,7 @@ class CrudContext:
     record_id: Optional[Any] = None  # ID for update/delete (None for create)
     feedback_id: Optional[str] = None  # Target div ID for HTMX swap (for override handlers)
 
-# %% ../nbs/05_datatable.ipynb 13
+# %% ../nbs/05_datatable.ipynb 14
 from typing import Callable, Optional, Any, Union
 from dataclasses import asdict, is_dataclass
 from datetime import datetime
@@ -488,11 +488,40 @@ class DataTableResource:
     - Async/sync hook support for external API integration
     - Auto-refresh table via HX-Trigger after mutations
     - Layout wrapper for full-page (non-HTMX) responses
+    - Optional `get_count` for efficient DB-level pagination
     
     **Auto-registers 3 routes:**
     - `GET {base_route}` → DataTable list view
     - `GET {base_route}/action` → FormModal for create/edit/view/delete
     - `POST {base_route}/save` → Save handler with hooks
+    
+    **DB-Level Pagination (Recommended for large datasets):**
+    
+    For efficient pagination, provide both `get_all` (returning paginated rows) 
+    and `get_count` (returning total count):
+    
+    ```python
+    def get_products(req):
+        page = int(req.query_params.get('page', 1))
+        page_size = int(req.query_params.get('page_size', 10))
+        offset = (page - 1) * page_size
+        search = req.query_params.get('search', '')
+        # SQL-level pagination
+        return list(tbl(limit=page_size, offset=offset))
+    
+    def get_product_count(req):
+        search = req.query_params.get('search', '')
+        return db.execute("SELECT COUNT(*) FROM products").scalar()
+    
+    DataTableResource(
+        get_all=get_products,      # Returns page_size rows
+        get_count=get_product_count,  # Returns total count
+        ...
+    )
+    ```
+    
+    If `get_count` is not provided, the library filters and paginates in Python
+    (requires `get_all` to return ALL rows - inefficient for large datasets).
     """
     
     def __init__(
@@ -501,8 +530,9 @@ class DataTableResource:
         base_route: str,
         columns: list[dict],
         # Data callbacks - ALL receive request as first param
-        get_all: Callable[[Any], list],                    # (req) -> list
+        get_all: Callable[[Any], list],                    # (req) -> list (can be paginated)
         get_by_id: Callable[[Any, Any], Any],              # (req, id) -> record
+        get_count: Callable[[Any], int] = None,            # (req) -> total count for pagination
         create: Callable[[Any, dict], Any] = None,         # (req, data) -> record
         update: Callable[[Any, Any, dict], Any] = None,    # (req, id, data) -> record
         delete: Callable[[Any, Any], bool] = None,         # (req, id) -> bool
@@ -529,6 +559,7 @@ class DataTableResource:
         self.columns = columns
         self.get_all = get_all
         self.get_by_id = get_by_id
+        self.get_count = get_count
         self.create_fn = create
         self.update_fn = update
         self.delete_fn = delete
@@ -704,10 +735,22 @@ class DataTableResource:
         """Handle main table route."""
         state = table_state_from_request(req, page_sizes=self.page_sizes)
         search, page, page_size = state["search"], state["page"], state["page_size"]
-        
+        # Get data from user callback
         data = self._get_filtered_data(req)
-        filtered = self._filter_by_search(data, search)
-        page_data, total, page = self._paginate(filtered, page, page_size)
+        
+        # Determine total count:
+        # - If get_count provided: use it (efficient DB-level count)
+        # - Otherwise: filter and count in Python (assumes get_all returns all rows)
+        if self.get_count:
+            # User handles pagination in get_all, we just get count separately
+            total = self.get_count(req)
+            page_data = data  # Already paginated by user
+            total_pages = max(1, ceil(total / page_size)) if total > 0 else 1
+            page = min(max(1, page), total_pages)
+        else:
+            # Legacy behavior: filter and paginate in Python
+            filtered = self._filter_by_search(data, search)
+            page_data, total, page = self._paginate(filtered, page, page_size)
         
         table = DataTable(
             data=page_data,
@@ -828,7 +871,7 @@ class DataTableResource:
         # Record required for remaining actions
         if not record:
             return self._error_toast("Record not found.")
-        
+            return self._wrap_modal(modal)
         # Handle VIEW (default behavior)
         if action == "view":
             modal = FormModal(

fh_matui/web_pages.py

@@ -809,20 +809,20 @@ def LandingPageSimple(
 # %% ../nbs/04_web_pages.ipynb 30
 def MarkdownSection(
     content: str,           # Markdown text to render
-    title: str = None,      # Optional section title (rendered as H5)
+    title: str = None,      # Optional section title (rendered as H3 for appropriate size)
     cls: str = "",          # Additional classes
 ):
     """Renders markdown content server-side for SEO compatibility.
     
     Uses python-markdown to convert markdown to HTML on the server.
     Search engines see fully rendered HTML (no JavaScript required).
-    Parent ContentPage uses 'min' class to center the page layout.
+    Content is centered using BeerCSS large-width + row center-align pattern.
     
     Great for text-heavy pages like Privacy Policy, Terms, About, Blog posts, etc.
     
     Args:
         content: Markdown text string (can include headers, lists, links, code blocks, tables)
-        title: Optional page title (rendered before markdown content)
+        title: Optional page title (rendered as H3 for blog-appropriate sizing)
         cls: Additional CSS classes
     
     Example:
@@ -848,12 +848,15 @@ We value your privacy...
     
     elements = []
     if title:
-        elements.append(H5(title, cls="center-align"))
+        # Use H3 for page title - appropriately sized for content pages
+        elements.append(H3(title, cls="bold"))
     
     # NotStr tells FastHTML to render raw HTML without escaping
     elements.append(NotStr(html_content))
     
-    return Article(*elements, cls=f"large-padding {cls}".strip())
+    # large-width constrains content, wrapped in row center-align for centering
+    article = Article(*elements, cls=f"large-width large-padding {cls}".strip())
+    return Div(article, cls="row center-align")
 
 # %% ../nbs/04_web_pages.ipynb 31
 def ContentPage(
@@ -871,7 +874,7 @@ def ContentPage(
     A shell template for text-heavy pages like Privacy Policy, Terms of Service,
     Security, About, Blog posts, etc. Developer passes any number of content sections.
     
-    Layout: Navbar (sticky) -> Content sections (centered with 'min') -> Footer
+    Layout: Navbar (sticky) -> Content sections (centered with 'responsive') -> Footer
     
     Uses STANDARD_FOOTER_COLUMNS by default for consistent footer across all pages.
     
@@ -913,7 +916,7 @@ def ContentPage(
         cls="large-padding",
     )
     
-    # Main content area - use "min" to center content (unlike landing page which uses "max")
-    main_content = Main(*sections, cls="min large-padding")
+    # Main content area - sections handle their own centering
+    main_content = Main(*sections, cls="large-padding")
     
     return Div(navbar, main_content, footer_el, cls=f"column {cls}".strip())

{fh_matui-0.9.11.dist-info → fh_matui-0.9.13.dist-info}/METADATA

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: fh-matui
-Version: 0.9.11
+Version: 0.9.13
 Summary: material-ui for fasthtml
 Home-page: https://github.com/abhisheksreesaila/fh-matui
 Author: abhishek sreesaila

fh_matui-0.9.13.dist-info/RECORD

@@ -0,0 +1,14 @@
+fh_matui/__init__.py,sha256=4CbYG_FT4tURr5oUs-LmBkXp278FJwRBFCpWMPcLQog,24
+fh_matui/_modidx.py,sha256=naHwPQ4kCo-5saE_uozmdPA881kp1gnqvKhmaG-Ya-4,23914
+fh_matui/app_pages.py,sha256=Sn9-tgBpaPNbR-0nZtPLoSCmAWLOGB4UQ88IkFvzBRY,10361
+fh_matui/components.py,sha256=Cqgsg2i0dNzMgNpETSu7zf1HYyEwZ1_00bBjeue34Nc,53312
+fh_matui/core.py,sha256=t9Y5e3g6F4ZjlRuNt7SDabbCEdsolT6QHJXMOpEPa3A,10962
+fh_matui/datatable.py,sha256=o7BizE4FMKrfsYT4G6rjMvr2xHo_tvTwL0dI6anDcE4,41228
+fh_matui/foundations.py,sha256=b7PnObJpKN8ZAU9NzCm9xpfnHzFjjAROU7E2YvA_tj4,1820
+fh_matui/web_pages.py,sha256=at_M34Vxc1i9O0ukS41PaRJntkXXDzMqyzlcrgESUcw,35103
+fh_matui-0.9.13.dist-info/licenses/LICENSE,sha256=xV8xoN4VOL0uw9X8RSs2IMuD_Ss_a9yAbtGNeBWZwnw,11337
+fh_matui-0.9.13.dist-info/METADATA,sha256=5dnU_4G5vE1zqb28xwlI2pdXnBB0imjDbUxUW9imcLc,10491
+fh_matui-0.9.13.dist-info/WHEEL,sha256=wUyA8OaulRlbfwMtmQsvNngGrxQHAvkKcvRmdizlJi0,92
+fh_matui-0.9.13.dist-info/entry_points.txt,sha256=zn4CR4gNTiAAxbFsCxHAf2tQhtW29_YOffjbUTgeoWI,38
+fh_matui-0.9.13.dist-info/top_level.txt,sha256=l80d5eoA2ZjqtPYwAorLMS5PiHxUxz3zKzxMJ41Xoso,9
+fh_matui-0.9.13.dist-info/RECORD,,

{fh_matui-0.9.11.dist-info → fh_matui-0.9.13.dist-info}/WHEEL

@@ -1,5 +1,5 @@
 Wheel-Version: 1.0
-Generator: setuptools (80.10.1)
+Generator: setuptools (80.10.2)
 Root-Is-Purelib: true
 Tag: py3-none-any
 

fh_matui-0.9.11.dist-info/RECORD

@@ -1,14 +0,0 @@
-fh_matui/__init__.py,sha256=taelSBN5SjzTPZ994Gxw8NFdSDITeBao31tWpkapnXU,24
-fh_matui/_modidx.py,sha256=naHwPQ4kCo-5saE_uozmdPA881kp1gnqvKhmaG-Ya-4,23914
-fh_matui/app_pages.py,sha256=Sn9-tgBpaPNbR-0nZtPLoSCmAWLOGB4UQ88IkFvzBRY,10361
-fh_matui/components.py,sha256=Q-koxO-BCxG9Dse2QUpP5WrGSrbDyzBSLoqIGatUAg8,49503
-fh_matui/core.py,sha256=xtVBN8CtC50ZJ4Iu7o-mUhaA87tWdnz8gBfKRk63Zhs,10680
-fh_matui/datatable.py,sha256=LsVwuTuoFOh3rIvETXefsqZOqxos4xi9ct2F7YPIIv8,39266
-fh_matui/foundations.py,sha256=b7PnObJpKN8ZAU9NzCm9xpfnHzFjjAROU7E2YvA_tj4,1820
-fh_matui/web_pages.py,sha256=4mF-jpfVcZTVepfQ-aMGgIUp-nBp0YCkvcdsWhUYeaA,34879
-fh_matui-0.9.11.dist-info/licenses/LICENSE,sha256=xV8xoN4VOL0uw9X8RSs2IMuD_Ss_a9yAbtGNeBWZwnw,11337
-fh_matui-0.9.11.dist-info/METADATA,sha256=NIMhExSVx75fEZgaO1WJiaugYb2bVtHSDaX_SandwLI,10491
-fh_matui-0.9.11.dist-info/WHEEL,sha256=qELbo2s1Yzl39ZmrAibXA2jjPLUYfnVhUNTlyF1rq0Y,92
-fh_matui-0.9.11.dist-info/entry_points.txt,sha256=zn4CR4gNTiAAxbFsCxHAf2tQhtW29_YOffjbUTgeoWI,38
-fh_matui-0.9.11.dist-info/top_level.txt,sha256=l80d5eoA2ZjqtPYwAorLMS5PiHxUxz3zKzxMJ41Xoso,9
-fh_matui-0.9.11.dist-info/RECORD,,