feat(avatar): combine gravatars with avatars and make them their own …

…section.

-renamed gravatar file to avatars.scss
-removed avatar from images
-made avatar the parent of gravatar

[Finishes #80910754]

Signed-off-by: Bebe Peng <bpeng@pivotal.io>

src/pivotal-ui/components/gravatars.scss → src/pivotal-ui/components/avatars.scss

@@ -1,13 +1,28 @@
+
 /*doc
 ---
-title: Gravatars
-name: gravatar
+title: Avatars
+name: avatar
 categories:
   - All
-  - Objects
+  - Elements
 ---
 
+Regular avatars are expected to by 100px by 100px.
+
+
+```haml_example
+%img{src: "http://placehold.it/100x100", alt: "...", class: "img-circle avatar", height: "100", width: "100"}
+
+```
+
+
 */
+.avatar {
+  border: $avatar-border;
+  box-sizing: border-box;
+}
+
 
 .gravatar {
   display: inline-block;
@@ -33,9 +48,9 @@ categories:
 
 /*doc
 ---
-title: Small
-name: gravatar_small
-parent: gravatar
+title: Small Gravatar
+name: avatar_01_gravatar_small
+parent: avatar
 ---
 
 Allows you to show a gravatar with the proper default 'image' (icon).
@@ -58,8 +73,8 @@ To use in a view, simply call
 /*doc
 ---
 title: Small with Envelope
-name: gravatar_small_with_envelope
-parent: gravatar
+name: avatar_02_gravatar_small_with_envelope
+parent: avatar
 ---
 
 Allows you to show a gravatar with an icon overlay.
@@ -121,9 +136,9 @@ To use in a view, simply call
 
 /*doc
 ---
-title: Large
-name: gravatar_large
-parent: gravatar
+title: Large Gravatar
+name: avatar_03_gravatar_large
+parent: avatar
 ---
 
 Allows you to show a gravatar with the proper default 'image' (icon).

src/pivotal-ui/components/images.scss

@@ -176,25 +176,3 @@ For more information about setting up your svg, read this article about [svg coo
   left: 0;
 }
 
-
-/*doc
----
-title: Avatar Images
-name: image_avatar
-parent: image
----
-
-Avatar images are expected to by 100px by 100px.
-
-
-```haml_example
-%img{src: "http://placehold.it/100x100", alt: "...", class: "img-circle avatar", height: "100", width: "100"}
-
-```
-
-
-*/
-.avatar {
-  border: $avatar-border;
-  box-sizing: border-box;
-}

src/pivotal-ui/pivotal-ui.scss

@@ -30,7 +30,7 @@
 @import "components/collapse.scss";
 @import "components/forms.scss";
 @import "components/modals.scss";
-@import "components/gravatars.scss";
+@import "components/avatars.scss";
 @import "components/toggles.scss";
 @import "components/spinners.scss";
 @import "components/tooltips.scss";