Fixes: oppia#12907 Drop down for "play later" in mobile view (oppia#1…

…2932) * fix * fix
aishacodes · Jun 1, 2021 · f753ff5 · f753ff5
1 parent 1c241a6
commit f753ff5
Showing 1 changed file with 9 additions and 11 deletions.
diff --git a/core/templates/pages/learner-dashboard-page/learner-dashboard-icons.component.html b/core/templates/pages/learner-dashboard-page/learner-dashboard-icons.component.html
@@ -7,13 +7,15 @@
    container="body"
    placement="left">
 </i>
-<div *ngIf="canActivityBeAddedToLearnerPlaylist(activityId) && isContainerNarrow" class="btn-group dropdown oppia-learner-dashboard-icon" uib-dropdown>
-  <ul class="dropdown-menu oppia-dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="single-button">
-    <li role="menuitem" (click)="addToLearnerPlaylist(activityId, activityType)">
-      <a [innerHTML]="'I18N_LIBRARY_ADD_TO_LEARNER_PLAYLIST' | translate"></a>
-    </li>
-  </ul>
-  <i class="fas fa-ellipsis-v" uib-dropdown-toggle></i>
+<div *ngIf="canActivityBeAddedToLearnerPlaylist(activityId) && isContainerNarrow">
+  <div class="dropdown oppia-learner-dashboard-icon" ngbDropdown>
+    <ul class=" dropdown-menu dropdown-menu-right">
+      <li ngbDropdownItem (click)="addToLearnerPlaylist(activityId, activityType)">
+        <a [innerHTML]="'I18N_LIBRARY_ADD_TO_LEARNER_PLAYLIST' | translate"></a>
+      </li>
+    </ul>
+    <i class="fas fa-ellipsis-v" ngbDropdownToggle data-toggle="dropdown"></i>
+  </div>
 </div>
 <i class="oppia-learner-dashboard-icon far fa-clock"
    *ngIf="belongsToLearnerPlaylist()"
@@ -44,8 +46,4 @@
     max-width: none;
     white-space: nowrap;
   }
-  .oppia-dropdown-menu {
-    left: -150px;
-    top: 0;
-  }
 </style>