FEAT #15550 TIME 0:10 fix css

src/frontend/app/document/document.component.html

@@ -112,7 +112,7 @@
             {{docList[currentDoc].title}}
         </div>
         <div class="page-info-page" (click)="openSelect($event)">{{'lang.page' | translate}} {{ pageNum }} / {{ totalPages }}</div>
-        <ion-select interface="popover" [interfaceOptions]="{cssClass: 'popover-class'}"  style="max-height: 100%;" #pagesList (ionChange)='goTo($event.target.value)' hidden="true">
+        <ion-select interface="popover" [interfaceOptions]="{cssClass : this.totalPages > 10  ? 'popover-class' : 'custom-popover-class'}"  style="max-height: 100%;" #pagesList (ionChange)='goTo($event.target.value)' hidden="true">
             <ion-select-option *ngFor="let page of pagesArray(this.totalPages);let i=index" [value]="page" [disabled]="i+1 === pageNum">{{ i + 1 }}</ion-select-option>
         </ion-select>
     </section>

src/frontend/app/document/document.component.scss

@@ -397,8 +397,15 @@ button.disabled {
 }
 
 ::ng-deep .popover-class {
-.popover-content{
-        height: 50%;
+    .popover-content{
+            height: 50%;
+            top: 50px;
+        }
+}
+
+::ng-deep .custom-popover-class {
+    .popover-class {
+        height: 10%;
         top: 50px;
     }
 }