From af5f47bb90f857f88ca99c11ab0b2613b1b9c2ef Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?David=20Sevilla=20Mart=C3=ADn?= <dsevilla192@gmail.com>
Date: Sat, 16 Apr 2016 13:09:09 -0400
Subject: [PATCH] If no avatar uploaded user will see the upload button
 directly on "avatar" without full opacity Refs #249

---
 js/forum/dist/app.js                    | 4 ++--
 js/forum/src/components/AvatarEditor.js | 8 ++++----
 less/forum/AvatarEditor.less            | 3 +++
 3 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/js/forum/dist/app.js b/js/forum/dist/app.js
index 7abd280a1..3c04be7fe 100644
--- a/js/forum/dist/app.js
+++ b/js/forum/dist/app.js
@@ -18995,10 +18995,10 @@ System.register('flarum/components/AvatarEditor', ['flarum/Component', 'flarum/h
               avatar(user),
               m(
                 'a',
-                { className: 'Dropdown-toggle',
+                { className: user.avatarUrl() ? "Dropdown-toggle" : "Dropdown-toggle AvatarEditor--noAvatar",
                   'data-toggle': 'dropdown',
                   onclick: this.quickUpload.bind(this) },
-                this.loading ? LoadingIndicator.component() : icon('pencil')
+                this.loading ? LoadingIndicator.component() : user.avatarUrl() ? icon('pencil') : icon('upload')
               ),
               m(
                 'ul',
diff --git a/js/forum/src/components/AvatarEditor.js b/js/forum/src/components/AvatarEditor.js
index ac525d64d..5986e0356 100644
--- a/js/forum/src/components/AvatarEditor.js
+++ b/js/forum/src/components/AvatarEditor.js
@@ -37,10 +37,10 @@ export default class AvatarEditor extends Component {
     return (
       <div className={'AvatarEditor Dropdown ' + this.props.className + (this.loading ? ' loading' : '')}>
         {avatar(user)}
-        <a className="Dropdown-toggle"
-          data-toggle="dropdown"
-          onclick={this.quickUpload.bind(this)}>
-          {this.loading ? LoadingIndicator.component() : icon('pencil')}
+        <a className={ user.avatarUrl() ? "Dropdown-toggle" : "Dropdown-toggle AvatarEditor--noAvatar" }
+           data-toggle="dropdown"
+           onclick={this.quickUpload.bind(this)}>
+          {this.loading ? LoadingIndicator.component() : (user.avatarUrl() ? icon('pencil') : icon('upload'))}
         </a>
         <ul className="Dropdown-menu Menu">
           {listItems(this.controlItems().toArray())}
diff --git a/less/forum/AvatarEditor.less b/less/forum/AvatarEditor.less
index 6a8874038..72fc55eda 100644
--- a/less/forum/AvatarEditor.less
+++ b/less/forum/AvatarEditor.less
@@ -14,6 +14,9 @@
     text-decoration: none;
     border: 0;
   }
+  .AvatarEditor--noAvatar {
+    opacity: 0.7;
+  }
   &:hover .Dropdown-toggle, &.open .Dropdown-toggle, &.loading .Dropdown-toggle {
     opacity: 1;
   }