From b0dc856b1b9dcd94d01808a78eefcb1d3fa9b9e1 Mon Sep 17 00:00:00 2001
From: Brandy Carney <brandyscarney@gmail.com>
Date: Thu, 6 Apr 2017 18:04:16 -0400
Subject: [PATCH] feat(item): add sass variable to override avatar border
 radius

closes #10763
---
 src/components/item/item.ios.scss | 5 ++++-
 src/components/item/item.md.scss  | 5 ++++-
 src/components/item/item.wp.scss  | 5 ++++-
 3 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/components/item/item.ios.scss b/src/components/item/item.ios.scss
index 923af89bc5e..b4c6816c49d 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 dedcab1d40d..3687fa4ef32 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 f05d5cd0aaf..ee56838081e 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;
 }