` is visually * hidden sr-only text, a different class, and styling it would have no visible * effect for a sighted visitor -- not used as the target for that reason). That same * source DOES render a real, always-visible heading per cart line item: * `

` (the * product name/link inside each `.fct-cart-item`), unconditional whenever the cart * has items. ['text'] on the shared snippet call suppresses the dead `.fcbd-heading` * block; headingCssSnippet() replaces it with this real per-item title, reading the * same design.typography.heading_* paths designControls() already exposes (Taak 3's * new size/line-height/letter-spacing/align fields included), so the existing * Heading Color/Heading Font Family controls finally do something. * * FIXTAAK TAAK 4 (containers, v0.6.0+1): FC_Cart had no frame styling at all, per * cart or per line item (task brief's own named example). `.fct-cart-page` (the * element's own existing typography/spacing target above, FluentCart's real outer * `

`) and `.fct-cart-item` (the real per-row `

`, same source) are both * real, always-present wrapper nodes with nothing already styling their * background/border/radius/shadow, so containerSection()/containerCssSnippet() fills * a genuine, previously-missing gap on both; see designControls() for the two * sections (kept as two separate controls, "Container" and "Line Item Container", so * a page author can frame the whole cart and its rows independently, matching the * task brief's own "per regelitem of rond het geheel" phrasing). */ public static function cssTemplate() { return ControlPresets::typographyCssSnippet('%%SELECTOR%% .fct-cart-page', 'design.typography', ['text']) . self::headingCssSnippet() . ControlPresets::spacingCssSnippet('%%SELECTOR%%') . ControlPresets::buttonCssSnippet('%%SELECTOR%% .checkout-button', 'design.button') . ControlPresets::containerCssSnippet('%%SELECTOR%% .fct-cart-page', 'design.container') . ControlPresets::containerCssSnippet('%%SELECTOR%% .fct-cart-item', 'design.line_item_container') . file_get_contents(__DIR__ . '/css.twig'); } /** * Hand-adapted copy of ControlPresets::typographyCssSnippet()'s own heading block * (out of this fork's file area, so reproduced rather than edited), retargeted at * FluentCart's real per-item product title instead of the dead .fcbd-heading; see * cssTemplate()'s own docblock for the render-path evidence. */ private static function headingCssSnippet(): string { $selector = '%%SELECTOR%% .fct-cart-page .fct-cart-item-title'; $prefix = 'design.typography'; return "/* Heading (real node, FluentCart's own CartRenderer::renderTitles(); FIXTAAK TAAK 2) */\n" . "{$selector} {\n" . ' color: ' . ControlPresets::tokenVar('--bde-fc-heading-color') . ";\n" . ' font-family: ' . ControlPresets::tokenVar('--bde-fc-heading-font-family') . ";\n" . "}\n" . "{% if {$prefix}.heading_font_size %}{$selector} { font-size: {{ {$prefix}.heading_font_size.style }}; }{% endif %}\n" . "{% if {$prefix}.heading_line_height %}{$selector} { line-height: {{ {$prefix}.heading_line_height.style }}; }{% endif %}\n" . "{% if {$prefix}.heading_letter_spacing %}{$selector} { letter-spacing: {{ {$prefix}.heading_letter_spacing.style }}; }{% endif %}\n" . "{% if {$prefix}.heading_text_align %}{$selector} { text-align: {{ {$prefix}.heading_text_align }}; }{% endif %}\n" . "{% if {$prefix}.heading_color %}{$selector} { --bde-fc-heading-color: {{ {$prefix}.heading_color }}; }{% endif %}\n" . "{% if {$prefix}.heading_font_family %}{$selector} { --bde-fc-heading-font-family: {{ {$prefix}.heading_font_family }}; }{% endif %}\n"; } public static function defaultChildren() { return false; } public static function dependencies() { return false; } public static function settingsControls() { return []; } public static function settings() { return ['proOnly' => false]; } public static function availableIn() { return ['breakdance']; } public static function propertyPathsToSsrElementWhenValueChanges() { return ['content.cart.live_preview', 'content.cart.when_empty']; } public static function defaultProperties() { return ['content' => ['cart' => ['live_preview' => false, 'when_empty' => null]]]; } public static function contentControls() { return [c('cart', __('Cart', 'sparkcore-commerce'), [ c('when_empty', __('When empty', 'sparkcore-commerce'), [], ['type' => 'global_block_chooser', 'layout' => 'vertical'], false, false, []), c('live_preview', __('Live editor preview', 'sparkcore-commerce'), [], ['type' => 'toggle', 'layout' => 'inline'], false, false, []), ], ['type' => 'section', 'layout' => 'vertical'], false, false, [])]; } /** * Heading Color/Heading Font Family stay on (typographySection()'s default parts, * unchanged): FIXTAAK TAAK 2 retargets their CSS at a real node, it does not remove * them; see cssTemplate()'s own docblock. Container/Line Item Container are new * (FIXTAAK TAAK 4): background/border/radius/shadow around the whole cart and around * each line item, see cssTemplate()'s own docblock for the real-selector evidence. */ public static function designControls() { return [ ControlPresets::typographySection(), ControlPresets::spacingSection(), ControlPresets::buttonSection(), ControlPresets::containerSection('container', __('Container', 'sparkcore-commerce')), ControlPresets::containerSection('line_item_container', __('Line Item Container', 'sparkcore-commerce')), ]; } }