🐛 Bugfix: Sass deprecation warning in model-picker-dropdown.component....

Date: 2026-03-11
Time: 23:38:16 UTC
Session: gspace1-205.8
Agent: angular
Confidence: 98%
Status: ✅ Documented

📋 Decision Context

Question:

Sass deprecation warning in model-picker-dropdown.component.scss and missing stylesheet import in default-renderer.component.scss

Task: Not specified

🎯 Decision Made

Chosen:

1. Moved property declarations (min-width, background, border, etc.) ABOVE nested &--portal rule in model-picker-dropdown — Sass is changing behavior for declarations after nested rules to match CSS spec. 2) Fixed import path from '../../styles/chat-modularity' to '../../../styles/chat-modularity' in default-renderer — the component is 3 levels deep from lib/styles/, not 2.

Options Considered:

1. Wrap declarations in & {} (opt into new Sass behavior)
2. Move declarations above nested rules (keep existing behavior)
3. Suppress the warning via sass config

💭 Reasoning

The Sass mixed-decls deprecation warns when property declarations appear after nested rules. CSS spec says declarations after nested rules have different specificity behavior than Sass currently implements. Moving declarations above nested rules is the cleanest fix — it matches both current Sass and future CSS spec. The import path bug was a simple relative path miscalculation: default-renderer is at components/tool-renderers/default-renderer/ which needs ../../../ to reach lib/styles/, not ../../. Other renderers inside renderers/ subdirectory correctly use ../../../../.

📁 Files Involved

• libs/libs-ai/vitto-chat/src/lib/components/chat-shell/model-picker-dropdown/model-picker-dropdown.component.scss
• libs/libs-ai/vitto-chat/src/lib/components/tool-renderers/default-renderer/default-renderer.component.scss

🔗 Related

• Decision ID: dev_1773272296206_d41oldb
• Session: 205
• Workspace: gspace1

Auto-generated by MCP Smart Consolidation