diff --git a/src/app/pages/e-commerce/user-activity/user-activity.component.html b/src/app/pages/e-commerce/user-activity/user-activity.component.html
new file mode 100644
index 00000000..30a756c6
--- /dev/null
+++ b/src/app/pages/e-commerce/user-activity/user-activity.component.html
@@ -0,0 +1,32 @@
+<nb-card size="medium">
+
+  <nb-card-header>
+    <span>User Activity</span>
+    <nb-select [selected]="type" (selectedChange)="getUserActivity($event); type = $event">
+      <nb-option *ngFor="let t of types" [value]="t">{{ t }}</nb-option>
+    </nb-select>
+  </nb-card-header>
+
+  <nb-list class="user-activity-list">
+    <nb-list-item *ngFor="let item of userActivity">
+
+      <div class="visited-date">
+        {{ item.date }}
+      </div>
+
+      <div class="visited-pages-count">
+        <div class="caption">Pages Visit</div>
+        <div class="value">{{ item.pagesVisitCount }}</div>
+      </div>
+
+      <div class="visited-percentages">
+        <div class="caption">New visits, %</div>
+        <div class="delta value" [class.up]="item.deltaUp" [class.down]="!item.deltaUp">
+          {{ item.newVisits }}%
+        </div>
+      </div>
+
+    </nb-list-item>
+  </nb-list>
+
+</nb-card>
diff --git a/src/app/pages/e-commerce/user-activity/user-activity.component.scss b/src/app/pages/e-commerce/user-activity/user-activity.component.scss
index 8e65c429..fed0b00d 100644
--- a/src/app/pages/e-commerce/user-activity/user-activity.component.scss
+++ b/src/app/pages/e-commerce/user-activity/user-activity.component.scss
@@ -1,5 +1,4 @@
 @import '../../../@theme/styles/themes';
-@import '~@nebular/theme/styles/global/typography/typography';
 
 @include nb-install-component() {
   nb-card-header {
@@ -7,78 +6,31 @@
     align-items: center;
     justify-content: space-between;
     border: none;
+    padding-top: 0.45rem;
+    padding-bottom: 0.45rem;
   }
 
-  nb-card-body {
-    padding: 0;
+  nb-list {
+    overflow-x: hidden;
   }
 
-  .dropdown {
-    min-width: 120px;
-  }
-
-  .user-activity-list {
-    padding: 0;
-    margin: 0;
-  }
-
-  .user-activity-list li {
-    list-style: none;
+  nb-list-item {
     display: flex;
-    justify-content: space-between;
     align-items: flex-end;
-    position: relative;
-    color: nb-theme(color-fg);
-    padding: nb-theme(card-padding);
-    border-bottom:
-      nb-theme(list-item-border-width)
-      nb-theme(card-header-border-type)
-      nb-theme(separator);
-
-    &:first-child {
-      border-top:
-        nb-theme(list-item-border-width)
-        nb-theme(card-header-border-type)
-        nb-theme(separator);
-    }
-
-    &:hover {
-      background-color: nb-theme(layout-bg);
-
-      &::before {
-        position: absolute;
-        content: '';
-        height: 100%;
-        width: 6px;
-        left: 0;
-        top: 0;
-        background-color: nb-theme(color-success);
-        border-radius: nb-theme(radius);
-      }
-    }
+    justify-content: space-between;
+    margin: 0 -0.25rem;
   }
 
   .visited-date,
-  .value,
-  .title {
-    font-size: 1.25rem;
-  }
-
-  .visited-date {
-    color: nb-theme(color-fg-heading);
-
-    @include nb-for-theme(cosmic) {
-      color: nb-theme(color-fg);
-    }
-  }
-
-  .title {
-    font-size: 1rem;
+  .visited-pages-count,
+  .visited-percentages {
+    flex: 1 0 auto;
+    margin: 0 0.25rem;
   }
 
   .value {
-    margin-top: 0.5rem;
-    color: nb-theme(color-success);
+    margin-top: 0.25rem;
+    color: nb-theme(color-success-default);
   }
 
   .delta {
@@ -89,78 +41,25 @@
     &::before {
       content: '';
       right: 100%;
-      margin-right: 0.7rem;
-      @include nb-rtl(margin-right, 0);
+      @include nb-ltr(margin-right, 0.7rem);
       @include nb-rtl(margin-left, 0.7rem);
       border-left: 6px solid transparent;
       border-right: 6px solid transparent;
     }
 
     &.down {
-      color: text-danger();
+      color: nb-theme(color-danger-default);
 
       &::before {
-        border-top: 6px solid text-danger();
+        border-top: 6px solid nb-theme(color-danger-default);
       }
     }
 
     &.up {
-      color: text-success();
+      color: nb-theme(color-success-default);
 
       &::before {
-        border-bottom: 6px solid text-success();
-      }
-    }
-  }
-
-  @include nb-for-theme(cosmic) {
-    .user-activity-list li {
-      &:hover {
-        &::before {
-          $color-top: nb-theme(btn-success-bg);
-          $color-bottom: btn-hero-success-left-color();
-
-          background-image: linear-gradient(to top, $color-top, $color-bottom);
-          box-shadow: 0 0 16px -2px btn-hero-success-middle-color();
-        }
-      }
-    }
-
-    .delta {
-      &.down, &.up {
-        color: nb-theme(color-fg-heading);
-      }
-    }
-  }
-
-  @include nb-for-theme(corporate) {
-    .user-activity-list li {
-      border-color: nb-theme(tabs-separator);
-
-      &:first-child {
-        border-color: nb-theme(tabs-separator);
-      }
-
-      &:hover {
-        &::before {
-          background-color: nb-theme(color-primary);
-        }
-      }
-    }
-
-    .visited-pages-count {
-      .value {
-        color: nb-theme(color-fg-heading);
-      }
-    }
-
-    .delta {
-      &.up {
-        color: text-primary();
-
-        &::before {
-          border-bottom-color: text-primary();
-        }
+        border-bottom: 6px solid nb-theme(color-success-default);
       }
     }
   }
diff --git a/src/app/pages/e-commerce/user-activity/user-activity.component.ts b/src/app/pages/e-commerce/user-activity/user-activity.component.ts
index d184090c..620af6f2 100644
--- a/src/app/pages/e-commerce/user-activity/user-activity.component.ts
+++ b/src/app/pages/e-commerce/user-activity/user-activity.component.ts
@@ -7,47 +7,7 @@ import { UserActivityData, UserActive } from '../../../@core/data/user-activity'
 @Component({
   selector: 'ngx-user-activity',
   styleUrls: ['./user-activity.component.scss'],
-  template: `
-    <nb-card size="medium">
-      <nb-card-header>
-        <span>User Activity</span>
-        <div class="dropdown ghost-dropdown" ngbDropdown>
-          <button type="button" class="btn btn-sm" ngbDropdownToggle
-                  [ngClass]="{ 'btn-success': currentTheme == 'default', 'btn-primary': currentTheme != 'default'}">
-            {{ type }}
-          </button>
-          <ul ngbDropdownMenu class="dropdown-menu">
-            <li class="dropdown-item"
-                *ngFor="let t of types"
-                (click)="getUserActivity(t); type = t">
-              {{ t }}
-            </li>
-          </ul>
-        </div>
-      </nb-card-header>
-      <nb-card-body>
-        <ul class="user-activity-list">
-          <li *ngFor="let item of userActivity">
-            <div class="visited-date">
-              {{ item.date }}
-            </div>
-            <div class="visited-pages-count">
-              <div class="title">Pages Visit</div>
-              <div class="value">{{ item.pagesVisitCount }}</div>
-            </div>
-            <div class="visited-percentages">
-              <div class="title">New visits, %</div>
-              <div class="delta value"
-                   [class.up]="item.deltaUp"
-                   [class.down]="!item.deltaUp">
-                {{ item.newVisits }}%
-              </div>
-            </div>
-          </li>
-        </ul>
-      </nb-card-body>
-    </nb-card>
-  `,
+  templateUrl: './user-activity.component.html',
 })
 export class ECommerceUserActivityComponent implements OnDestroy {