Bladeren bron

ux(): fixes to side menu and gravatar url

Torkel Ödegaard 9 jaren geleden
bovenliggende
commit
f808baafa7
2 gewijzigde bestanden met toevoegingen van 17 en 14 verwijderingen
  1. 4 2
      public/app/core/components/sidemenu/sidemenu.html
  2. 13 12
      public/sass/components/_sidemenu.scss

+ 4 - 2
public/app/core/components/sidemenu/sidemenu.html

@@ -3,8 +3,10 @@
 	<li class="sidemenu-org-section" ng-if="ctrl.isSignedIn" class="dropdown">
 		<div class="sidemenu-org">
 			<div class="sidemenu-org-avatar">
-				<img ng-if="ctrl.user.gravatarURL" ng-src="{{ctrl.user.gravatarUrl}}">
-				<span class="no-avatar h2" ng-if!="ctrl.user.gravatarURL">?</span>
+				<img ng-if="ctrl.user.gravatarUrl" ng-src="{{ctrl.user.gravatarUrl}}">
+				<span class="sidemenu-org-avatar--missing" ng-if="!ctrl.user.gravatarUrl">
+					<i class="fa fa-fw fa-user"></i>
+				</span>
 			</div>
 			<div class="sidemenu-org-details">
 				<span class="sidemenu-org-user sidemenu-item-text">{{ctrl.user.name}}</span>

+ 13 - 12
public/sass/components/_sidemenu.scss

@@ -203,23 +203,24 @@
 }
 
 .sidemenu-org-avatar {
-  width: 44px;
+  width: 40px;
+  height: 40px;
   background-color: $gray-2;
   border-radius: 50%;
-  .no-avatar {
-    color: $text-color;
-    text-shadow: 0 1px 0 $dark-1;
-    padding-left: 17px;
-    position: relative;
-    top:  5px;
+  text-align: center;
+
+  >img {
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
   }
 }
 
-.sidemenu-org-avatar > img {
-  width: 40px;
-  height: 40px;
-  border-radius: 50%;
-  position: absolute;
+.sidemenu-org-avatar--missing {
+  color: $text-color;
+  text-shadow: 0 1px 0 $dark-1;
+  line-height: 40px;
+  font-size: $font-size-lg;
 }
 
 .sidemenu-org-details {