Border Radius
1 example from SAP's documentation · no stylesheet in the package · Back to the gallery
About
Provides CSS classes and SCSS mixins for controlling the corner rounding of elements. Classes apply predefined theme-based border-radius values, while the sap-border-radius mixin lets you define custom values for one or multiple corners. Type CSS variable Class Mixin Element var(--sapElement_BorderCornerRadius) .sap-border-radius-element @include sap-border-radius(element) Button var(--sapButton_BorderCornerRadius) .sap-border-radius-button @include sap-border-radius(button) Field var(--sapField_BorderCornerRadius) .sap-border-radius-field @include sap-border-radius(field) Group var(--sapGroup_BorderCornerRadius) .sap-border-radius-group @include sap-border-radius(group) Popover var(--sapPopover_BorderCornerRadius) .sap-border-radius-popover @include sap-border-radius(popover) Tile var(--sapTile_BorderCornerRadius) .sap-border-radius-tile @include sap-border-radius(tile) SCSS mixin: @include sap-border-radius($value...) Example: @include sap-border-radius(1rem) @include sap-border-radius(1rem 0.5rem) @include sap-border-radius(1rem 0.5rem 0.25rem) @include sap-border-radius(1rem 0.5rem 0.25rem 0.25rem)