ui make-up

open-template-hub · Sep 4, 2021 · 74bd505 · 74bd505
1 parent 29c7faa
commit 74bd505
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 7 deletions.
diff --git a/src/app/component/common/dropdown-menu/dropdown-menu.component.html b/src/app/component/common/dropdown-menu/dropdown-menu.component.html
@@ -27,16 +27,14 @@ <h4>
 
         <a *ngFor="let option of column.menus; last as isLast; first as isFirst" class="dropdown-item"
            [class]="option.itemColor ? option.itemColor + '-theme' : ''"
-           (mouseover)="option.hover = true" (mouseleave)="option.hover = false"
-           [ngStyle]="option?.hover && { 'background-color': 'var(--hover)' }"
            [routerLink]="option.link" (click)="closeDropDownInternal()">
 
-          <img [src]="option.brand.brandLogo" alt="logo" class="dropdown-item-logo" height="50"/>
+          <img [src]="option.brand.brandLogo" alt="logo" class="dropdown-item-logo" height="55"/>
 
           <div class="dropdown-item-content">
-          <span>
+          <h6>
             {{ option.header }}
-          </span>
+          </h6>
             <p>
               {{ option.description }}
             </p>

diff --git a/src/app/component/common/dropdown-menu/dropdown-menu.component.scss b/src/app/component/common/dropdown-menu/dropdown-menu.component.scss
@@ -36,14 +36,22 @@
 .dropdown-item {
   display: flex;
   cursor: pointer;
+  align-items: center;
 }
 
 .dropdown-item-logo {
-  margin-right: 20px;
+  margin-right: 15px;
+}
+
+.dropdown-item-content {
+  height: 100%;
 }
 
-.dropdown-item-content span {
+.dropdown-item-content h6, .dropdown-item-content p {
   font-size: 14px;
+}
+
+.dropdown-item-content h6 {
   font-weight: 500;
 }
 
@@ -153,6 +161,12 @@
   }
 }
 
+@media (hover: hover) {
+  .dropdown-item:hover {
+    background-color: var(--brand-color-lighter-5);
+  }
+}
+
 @media only screen and (min-width: 1000px) {
   .dropdown-content {
     position: absolute;