package Ġreact . bootstrap . site . components . docs . content . images Ċ Ċ import Ġkotlinx . html . role Ċ import Ġkotlinx . html . unsafe Ċ import Ġreact . R Builder Ċ import Ġreact . bootstrap . content . img Ċ import Ġreact . bootstrap . lib . bootstrap . ClassNames Ċ import Ġreact . bootstrap . lib . kotlin xhtml . aria Label Ċ import Ġreact . bootstrap . site . components . docs . fix ings . Section Component Ċ import Ġreact . bootstrap . site . components . docs . fix ings . code Example Ċ import Ġreact . bootstrap . site . components . docs . fix ings . live Example Ċ import Ġreact . bootstrap . site . external . Markdown Ċ import Ġreact . bootstrap . site . lib . code po et . Fun Call Ċ import Ġreact . bootstrap . site . lib . code po et . Imports Ċ import Ġreact . dom . svg Ċ Ċ internal Ġclass ĠImage Thumb nails Ġ: ĠSection Component () Ġ{ ĊĠĠĠ Ġoverride Ġval Ġtitle : ĠString Ġ= Ġ" Image Ġthumb nails " ĊĊĠĠĠ Ġoverride Ġfun ĠR Builder . render () Ġ{ ĊĠĠĠĠĠĠĠ Ġsection Title () ĊĠĠĠĠĠĠĠ ĠMarkdown Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ// language = Markdown ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ+ """ Ċ You Ġcan Ġset Ġthe Ġ` img ( thumbnail )` - argument Ġto Ġ` true ` Ġto Ġgive Ġan Ġimage Ġa Ġrounded Ġ 1 px Ġborder Ċ appearance . ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ""" ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġlive Example (" bd - example - images ") Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġsvg ( classes Ġ= Ġ" bd - placeholder - img Ġbd - placeholder - img - lg Ġ${ ClassNames . IMG _ TH UMB NA IL }") Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġattrs Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġset (" width ", Ġ" 2 0 0 ") ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġset (" height ", Ġ" 2 0 0 ") ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġset (" preserve AspectRatio ", Ġ" x Mid Y Mid Ġslice ") ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġset (" focus able ", Ġtrue ) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġrole Ġ= Ġ" img " ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġaria Label Ġ= ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ" A Ġgeneric Ġsquare Ġplaceholder Ġimage Ġwith Ġa Ġwhite Ġborder Ġaround Ġit , Ġmaking Ġit Ġre semble Ġa Ġ" Ġ+ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ" photo graph Ġtaken Ġwith Ġan Ġold Ġinstant Ġcamera : Ġ 2 0 0 x 2 0 0 " ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġunsafe Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġraw ( ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ"< rect Ġwidth =\" 1 0 0 % \" Ġheight =\" 1 0 0 % \" Ġfill =\" # 8 6 8 e 9 6 \"></ rect >" Ġ+ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ"< text Ġx =\" 5 0 % \" Ġy =\" 5 0 % \" Ġfill =\" # dee 2 e 6 \" Ġdy =\" . 3 em \"> 2 0 0 x 2 0 0 </ text >" ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġcode Example Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ+ Imports . builder () ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. add Import (" content . img ") ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. build () ĊĊĠĠĠĠĠĠĠĠĠĠĠ Ġ+ Fun Call . builder ( R Builder :: img , ĠFun Call . Style . INLINE ) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. add Argument (" thumbnail ", Ġtrue ) ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. add Argument (" alt ", Ġ" Responsive Ġimage ") ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. add Argument (" src ", Ġ"... ") ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. set Empty Lambda Argument () ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ. build () ĊĠĠĠĠĠĠĠ Ġ} ĊĠĠĠ Ġ} Ċ } Ċ