component-guidance-layout
Component Guidance - Layout & Containers
Layout structures and container components.
When to Use This Skill
Use this skill when:
- The user asks "Should I use [component] for [use case]?"
- The user needs to choose between similar components
- The user asks about component best practices
- The user wants to know when NOT to use a component
This skill covers: Action Bar, Bar, Card, Dynamic Page, Dynamic Side Content, Flexible Column Layout, Layout Panel, Panel, Settings, Tool Layout, Wizard
Action Bar
Description: The action bar displays at the top of the page, and includes the page's title, description, back button and action buttons. It provides page-level navigation and actions.
More from sap/fundamental-styles
layout-patterns
Common UI layout patterns using fundamental-styles - login forms, dashboards, master-detail, wizards, and more
2bem-naming
BEM (Block Element Modifier) methodology and naming conventions used in fundamental-styles with real examples
2content-density
Guide to cozy, compact, and condensed modes - when to use each density, how to apply them, and device-specific recommendations
2component-composition
How to combine fundamental-styles components correctly - required wrappers, nesting rules, and common composition patterns
2component-guidance-data
Fiori guidelines for data display components such as Table, List, Tree, Avatar, Calendar, Icons, etc
2component-guidance-forms
Fiori guidelines for form controls and input components such as Checkbox, Input, Select, Textarea, Date Picker, etc
2