fix(components): add css pseudo-selector for dropdown arrow (#848)

akveo · Apr 12, 2017 · 1be434b · 1be434b
1 parent bb6ecd3
commit 1be434b
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/src/app/theme/components/baPageTop/baPageTop.html b/src/app/theme/components/baPageTop/baPageTop.html
@@ -14,7 +14,6 @@
         <img src="{{ ( 'Nasta' | baProfilePicture ) }}">
       </a>
       <ul class="dropdown-menu top-dropdown-menu profile-dropdown" aria-labelledby="user-profile-dd">
-        <li class="dropdown-item"><i class="dropdown-arr"></i></li>
         <li class="dropdown-item"><a href><i class="fa fa-user"></i>Profile</a></li>
         <li class="dropdown-item"><a href><i class="fa fa-cog"></i>Settings</a></li>
         <li class="dropdown-item"><a href class="signout"><i class="fa fa-power-off"></i>Sign out</a></li>

diff --git a/src/app/theme/components/baPageTop/baPageTop.scss b/src/app/theme/components/baPageTop/baPageTop.scss
@@ -57,6 +57,20 @@ a.al-logo:hover {
   border: 0;
   opacity: 1;
   position: relative;
+  ul.profile-dropdown:after {
+    bottom: 100%;
+    right: 0;
+    border: solid transparent;
+    content: " ";
+    height: 0;
+    width: 0;
+    position: absolute;
+    pointer-events: none;
+    border-color: rgba(255, 255, 255, 0);
+    border-bottom-color: #fff;
+    border-width: 10px;
+    margin-right: 28px;
+  }
   a {
     display: block;
   }