Post Content
Master the art of UI perfection with Fluent UI’s slots and positioning! 🚀 Fine-tune your HTML output and sculpt seamless layouts, while also wielding precise control over tooltips and popout menus. Elevate your design game with Fluent UI’s versatile toolkit!
📚 Chapters:
00:00 – Intro
00:31 – Slot longhands
02:19 – Disabling slots
03:14 – ‘as’ prop
04:04 – Children renderfunction
05:29 – Positioning
06:08 – Postioning shorthand
08:18 – Positioning longhand
08:57 – Offsets
11:14 – Offset function
13:52 – Custom target
15:11 – Imperative target update
16:59 – Overflow boundary
19:12 – Flip boundary
20:51 – Outro
📝 Examples:
#1 Examples for advanced slots usage https://stackblitz.com/edit/vitejs-vite-ghkkdm
#2 Positioning examples https://stackblitz.com/edit/vitejs-vite-jo2idf
💡 References:
#1 Positioning documentation https://react.fluentui.dev/?path=/docs/concepts-developer-positioning-components–default Read More Microsoft Developer