-- foo-1: This is title
title-color: $inherited.colors.text-strong
-- foo-2: This is title
-- foo-2.inner:
-- ftd.row:
width: fill-container
background.solid: yellow
-- ftd.text: This is some inner text
color: red
-- end: ftd.row
-- end: foo-2.inner
-- ftd.text: First Text
margin-vertical.px: 10
-- ftd.text.color:
light: red
dark: yellow
-- ftd.text: Second Text
margin-vertical.px: 10
-- ftd.text.color: red
dark: yellow
-- ftd.text: Third Text
margin-vertical.px: 10
-- ftd.text.color: red
-- ftd.text.color.dark: yellow
-- ftd.text: Fourth Text
margin-vertical.px: 10
-- ftd.text.color.light: red
-- ftd.text.color.dark: yellow
-- foo: Text 1 from component
-- foo.text-color: $c
-- foo: Text 2 from component
-- foo.text-color:
light: red
dark: yellow
-- foo: Text 3 from component
-- foo.text-color: red
dark: yellow
-- foo: Text 4 from component
-- foo.text-color: red
-- foo.text-color.dark: yellow
-- foo: Text 5 from component
-- foo.text-color.light: red
-- foo.text-color.dark: yellow
-- foo: Text 6 from component
-- foo.text-color.light: red
-- foo.text-color.dark: $d-color
-- bar:
-- bar.text:
Hello this is some text
-- bar.d: Rithik
-- bar.d.description:
This is some description
-- bar.d.age: 23
-- bar.text-color: red
dark: yellow