package Ġre akt Ċ Ċ import Ġkotlinx . css .* Ċ import Ġreact . R Builder Ċ import Ġstyled . css Ċ import Ġstyled . styled Div Ċ import Ġtheme . clazz Ċ import Ġkotlinx . extensions . justify Self Ċ import Ġkotlinx . extensions . on Desktop Ċ import Ġkotlinx . extensions . on Mobile Ċ Ċ class ĠIntro ( ĊĠĠĠ Ġval Ġheading : ĠString , ĊĠĠĠ Ġval Ġbody : ĠString , ĊĠĠĠ Ġval Ġimage : ĠString Ċ ) Ċ Ċ fun ĠR Builder . Introduction ( intro : ĠIntro ) Ġ= ĠGrid Ġ{ Ġtheme Ġ-> ĊĠĠĠ Ġcss Ġ{ ĊĠĠĠĠĠĠĠ Ġon Desktop Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġgrid Template Columns Ġ= ĠGrid Template Columns (" 2 fr Ġ 1 fr ") ĊĠĠĠĠĠĠĠĠĠĠĠ Ġgap Ġ= Ġ 5 . em ĊĠĠĠĠĠĠĠĠĠĠĠ Ġpadding ( horizontal Ġ= Ġ 2 0 . pct ) ĊĠĠĠĠĠĠĠ Ġ} ĊĊĠĠĠĠĠĠĠ Ġon Mobile Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġgrid Template Columns Ġ= ĠGrid Template Columns (" 1 fr ") ĊĠĠĠĠĠĠĠĠĠĠĠ Ġgap Ġ= Ġ 1 . em ĊĠĠĠĠĠĠĠĠĠĠĠ Ġpadding ( horizontal Ġ= Ġ 0 . 5 . em ) ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠ Ġ} ĊĠĠĠ ĠGrid ( rows Ġ= Ġ" auto Ġauto ", Ġgap Ġ= Ġ" 1 em ") Ġ{ ĊĠĠĠĠĠĠĠ Ġcss Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġalign Self Ġ= ĠAlign . center ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġstyled Div Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġcss Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġjustify Self Ġ= ĠJust ify Content . center ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ+ theme . text . h 2 . clazz ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ+ intro . heading ĊĠĠĠĠĠĠĠ Ġ} ĊĊĠĠĠĠĠĠĠ Ġstyled Div Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġcss Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ+ theme . text . body 1 . clazz ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠtextAlign Ġ= ĠText Align . justify ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ+ intro . body ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠ Ġ} ĊĊĠĠĠ ĠAs pect R ation Div Ġ{ ĠImage ( src Ġ= Ġintro . image , Ġradius Ġ= Ġ 1 0 . px ) Ġ} Ċ }