renderFooterColumn function

Component renderFooterColumn(FooterColumnProps props)

Renders a Codex footer column with title and links.

Implementation

Component renderFooterColumn(FooterColumnProps props) {
  final effectiveTitleColor = props.titleColor ?? 'var(--foreground)';
  final effectiveLinkColor = props.linkColor ?? 'var(--muted-foreground)';
  final effectiveLinkGap = props.linkGap ?? '0.75rem';

  return dom.div(
    styles: const dom.Styles(raw: {
      'display': 'flex',
      'flex-direction': 'column',
      'align-items': 'flex-start',
    }),
    [
      // Title
      dom.h4(
        styles: dom.Styles(raw: {
          'font-family': 'ui-sans-serif, system-ui, sans-serif',
          'font-size': 'var(--font-size-sm)',
          'font-weight': 'var(--font-weight-semibold)',
          'color': effectiveTitleColor,
          'text-transform': 'uppercase',
          'letter-spacing': '0.05em',
          'margin': '0 0 1.25rem 0',
        }),
        [Component.text(props.title)],
      ),
      // Links
      ...props.links.map((link) => dom.a(
            href: link.href ?? '#',
            styles: dom.Styles(raw: {
              'display': 'block',
              'font-size': 'var(--font-size-sm)',
              'color': effectiveLinkColor,
              'text-decoration': 'none',
              'margin-bottom': effectiveLinkGap,
              'transition': 'color var(--arcane-transition)',
            }),
            [
              if (link.icon != null) ...[
                dom.span([Component.text(link.icon!)]),
                const Component.text(' '),
              ],
              Component.text(link.label),
            ],
          )),
    ],
  );
}