<commit_before>
/*doc
---
title: Avatars
name: avatar
categories:
  - All
  - 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;
  position: relative;
  img {
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
  }
  i {
    text-align: center;
    z-index: 1;
  }
  i.overlay {
    background-color: transparent;
    z-index: 3;
    position: absolute;
  }
}

/*doc
---
title: Small Gravatar
name: avatar_01_gravatar_small
parent: avatar
---

Allows you to show a gravatar with the proper default 'image' (icon).

To use in a view, simply call

`= render 'shared/gravatar_small', email: '<EMAIL>'`

```haml_example
.gravatar.gravatar-sm
  %img{src:"https://secure.gravatar.com/avatar/8b7970c372aabb936ca455127e04c959?s=20&d=blank"}
  %i.fa.fa-user
.gravatar.gravatar-sm
  %img{src:"https://secure.gravatar.com/avatar/20c2a28872fde9c903c14c5b7e465ff7?s=20&d=blank"}
  %i.fa.fa-user
```

*/

/*doc
---
title: Small with Envelope
name: avatar_02_gravatar_small_with_envelope
parent: avatar
---

Allows you to show a gravatar with an icon overlay.

To use in a view, simply call

`= render 'shared/gravatar_small', email: '<EMAIL>'`

```haml_example
.gravatar.gravatar-sm
  %img{src:"https://secure.gravatar.com/avatar/8b7970c372aabb936ca455127e04c959?s=20&d=blank"}
  %i.fa.fa-user
  %i.overlay.fa.fa-envelope

.gravatar.gravatar-sm.mlxl
  %img{src:"https://secure.gravatar.com/avatar/20c2a28872fde9c903c14c5b7e465ff7?s=20&d=blank"}
  %i.fa.fa-user
  %i.overlay.fa.fa-envelope

.gravatar.gravatar-sm.mlxl
  %img{src:"https://secure.gravatar.com/avatar/8b7970c372aabb936ca455127e04c959?s=20&d=blank"}
  %i.fa.fa-user.highlight
  %i.overlay.fa.fa-check

.gravatar.gravatar-sm.mlxl
  %img{src:"https://secure.gravatar.com/avatar/20c2a28872fde9c903c14c5b7e465ff7?s=20&d=blank"}
  %i.fa.fa-user
  %i.overlay.fa.fa-check
```
*/


.gravatar-sm {
  i {
    color: $gray-5;
    font-size: 20px;
    line-height: 20px;
    width: 20px;
    height: 20px;
  }

  i.highlight {
    color: $teal-3;
  }

  i.overlay {
    font-size: 10px;
    color: #fff;
    right: -30%;
    bottom: -25%;
  }
  .fa-envelope {
    text-shadow: 1px 0px 1px $gray-5, -1px 0px 1px $gray-5, 0px 1px 1px $gray-5, 0px 0px 1px $gray-5;
  }
  .fa-check {
    text-shadow: 1px 0px 0px $teal-3, -1px 0px 0px $teal-3, 0px 1px 0px $teal-3, 0px 0px 0px $teal-3;
  }
}

/*doc
---
title: Large Gravatar
name: avatar_03_gravatar_large
parent: avatar
---

Allows you to show a gravatar with the proper default 'image' (icon).

Large gravatar has a white background so it can be used on the edit profile form.

To use in a view, simply call

`= render 'shared/gravatar_large', email: '<EMAIL>'`

```haml_example
.gravatar.gravatar-lg
  %img{src:"https://secure.gravatar.com/avatar/8b7970c372aabb936ca455127e04c959?s=80&d=blank"}
  %i.fa.fa-user
.gravatar.gravatar-lg
  %img{src:"https://secure.gravatar.com/avatar/20c2a28872fde9c903c14c5b7e465ff7?s=80&d=blank"}
  %i.fa.fa-user
```

*/

.gravatar-lg {
  border: 3px solid $gray-10;
  i {
    background-color: #fff;
    color: $gray-10;
    font-size: 62px;
    line-height: 80px;
    width: 80px;
    height: 80px;
  }
}

<commit_msg>Change Gravatar to not be a dog nose.<commit_after>
/*doc
---
title: Avatars
name: avatar
categories:
  - All
  - 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;
  position: relative;
  img {
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
  }
  i {
    text-align: center;
    z-index: 1;
  }
  i.overlay {
    background-color: transparent;
    z-index: 3;
    position: absolute;
  }
}

/*doc
---
title: Small Gravatar
name: avatar_01_gravatar_small
parent: avatar
---

Allows you to show a gravatar with the proper default 'image' (icon).

To use in a view, simply call

`= render 'shared/gravatar_small', email: '<EMAIL>'`

```haml_example
.gravatar.gravatar-sm
  %img{src:"https://secure.gravatar.com/avatar/8b7970c372aabb936ca455127e04c959?s=20&d=blank"}
  %i.fa.fa-user
.gravatar.gravatar-sm
  %img{src:"https://s.gravatar.com/avatar/c99bd3ce00444f946027741d5a5cd9e9?s=20&d=blank"}
  %i.fa.fa-user
```

*/

/*doc
---
title: Small with Envelope
name: avatar_02_gravatar_small_with_envelope
parent: avatar
---

Allows you to show a gravatar with an icon overlay.

To use in a view, simply call

`= render 'shared/gravatar_small', email: '<EMAIL>'`

```haml_example
.gravatar.gravatar-sm
  %img{src:"https://secure.gravatar.com/avatar/8b7970c372aabb936ca455127e04c959?s=20&d=blank"}
  %i.fa.fa-user
  %i.overlay.fa.fa-envelope

.gravatar.gravatar-sm.mlxl
  %img{src:"https://s.gravatar.com/avatar/c99bd3ce00444f946027741d5a5cd9e9?s=20&d=blank"}
  %i.fa.fa-user
  %i.overlay.fa.fa-envelope

.gravatar.gravatar-sm.mlxl
  %img{src:"https://secure.gravatar.com/avatar/8b7970c372aabb936ca455127e04c959?s=20&d=blank"}
  %i.fa.fa-user.highlight
  %i.overlay.fa.fa-check

.gravatar.gravatar-sm.mlxl
  %img{src:"https://s.gravatar.com/avatar/c99bd3ce00444f946027741d5a5cd9e9?s=20&d=blank"}
  %i.fa.fa-user
  %i.overlay.fa.fa-check
```
*/


.gravatar-sm {
  i {
    color: $gray-5;
    font-size: 20px;
    line-height: 20px;
    width: 20px;
    height: 20px;
  }

  i.highlight {
    color: $teal-3;
  }

  i.overlay {
    font-size: 10px;
    color: #fff;
    right: -30%;
    bottom: -25%;
  }
  .fa-envelope {
    text-shadow: 1px 0px 1px $gray-5, -1px 0px 1px $gray-5, 0px 1px 1px $gray-5, 0px 0px 1px $gray-5;
  }
  .fa-check {
    text-shadow: 1px 0px 0px $teal-3, -1px 0px 0px $teal-3, 0px 1px 0px $teal-3, 0px 0px 0px $teal-3;
  }
}

/*doc
---
title: Large Gravatar
name: avatar_03_gravatar_large
parent: avatar
---

Allows you to show a gravatar with the proper default 'image' (icon).

Large gravatar has a white background so it can be used on the edit profile form.

To use in a view, simply call

`= render 'shared/gravatar_large', email: '<EMAIL>'`

```haml_example
.gravatar.gravatar-lg
  %img{src:"https://secure.gravatar.com/avatar/8b7970c372aabb936ca455127e04c959?s=80&d=blank"}
  %i.fa.fa-user
.gravatar.gravatar-lg
  %img{src:"https://s.gravatar.com/avatar/c99bd3ce00444f946027741d5a5cd9e9?s=80&d=blank"}
  %i.fa.fa-user
```

*/

.gravatar-lg {
  border: 3px solid $gray-10;
  i {
    background-color: #fff;
    color: $gray-10;
    font-size: 62px;
    line-height: 80px;
    width: 80px;
    height: 80px;
  }
}


{'fraction_non_alphanumeric': 0.1582241630276565, 'fraction_numerical': 0.0809315866084425, 'mean_word_length': 3.36808645899555, 'pattern_counts': {'":': 0, '<': 9, '<?xml version=': 0, '>': 9, 'https://': 16, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4654595', 'n_tokens_mistral': 3314, 'n_tokens_neox': 2931, 'n_words': 569}