Great idea using @extend to handle relationships between parent and child abstract components. Theoretically you’re right, but have you already used this in a real project?
In my projects I usually have
- some base css applying everywhere (normalize, default styling of forms/tables/links, etc. )
- some external css (from plugins like sliders, overlays, …)
- a set of helper classes/placeholders (i.e. clearfix, visuallyhidden, …), which i may extend/include (deciding to switch) wherever needed
- a grid / structure css, which defines the general structure / areas of my templates
- abstract components, which i may extend/include (deciding to switch as well)
- components
Up to now, I’ve never had the use case of using nested abstract components. Yes, some of the “abstract components” are used within others, but it was never necessary to ensure, that they only work within a certain parent class.