diff --git a/src/components/item/item.ios.scss b/src/components/item/item.ios.scss index 923af89bc5..b4c6816c49 100644 --- a/src/components/item/item.ios.scss +++ b/src/components/item/item.ios.scss @@ -18,6 +18,9 @@ $item-ios-paragraph-text-color: #8e9093 !default; /// @prop - Size of the avatar in the item $item-ios-avatar-size: 36px !default; +/// @prop - Border radius of the avatar in the item +$item-ios-avatar-border-radius: 50% !default; + /// @prop - Size of the thumbnail in the item $item-ios-thumbnail-size: 56px !default; @@ -170,7 +173,7 @@ $item-ios-sliding-content-background: $list-ios-background-color !default; width: $item-ios-avatar-size; height: $item-ios-avatar-size; - border-radius: 50%; + border-radius: $item-ios-avatar-border-radius; overflow: hidden; } diff --git a/src/components/item/item.md.scss b/src/components/item/item.md.scss index dedcab1d40..3687fa4ef3 100644 --- a/src/components/item/item.md.scss +++ b/src/components/item/item.md.scss @@ -18,6 +18,9 @@ $item-md-font-size: 1.6rem !default; /// @prop - Size of the avatar in the item $item-md-avatar-size: 40px !default; +/// @prop - Border radius of the avatar in the item +$item-md-avatar-border-radius: 50% !default; + /// @prop - Size of the thumbnail in the item $item-md-thumbnail-size: 80px !default; @@ -192,7 +195,7 @@ $item-md-sliding-content-background: $list-md-background-color !default; width: $item-md-avatar-size; height: $item-md-avatar-size; - border-radius: 50%; + border-radius: $item-md-avatar-border-radius; overflow: hidden; } diff --git a/src/components/item/item.wp.scss b/src/components/item/item.wp.scss index f05d5cd0aa..ee56838081 100644 --- a/src/components/item/item.wp.scss +++ b/src/components/item/item.wp.scss @@ -24,6 +24,9 @@ $item-wp-font-size: 1.6rem !default; /// @prop - Size of the avatar in the item $item-wp-avatar-size: 40px !default; +/// @prop - Border radius of the avatar in the item +$item-wp-avatar-border-radius: 50% !default; + /// @prop - Size of the thumbnail in the item $item-wp-thumbnail-size: 80px !default; @@ -204,7 +207,7 @@ $item-wp-sliding-content-background: $list-wp-background-color !default; width: $item-wp-avatar-size; height: $item-wp-avatar-size; - border-radius: 50%; + border-radius: $item-wp-avatar-border-radius; }