MOBILE-3320 style: Fix section download hidden with long section names

main
Pau Ferrer Ocaña 2021-06-15 17:12:16 +02:00
parent 9b8c2bf9f0
commit 05cbaba8f2
3 changed files with 14 additions and 7 deletions

View File

@ -1,6 +1,8 @@
@import "~theme/globals"; @import "~theme/globals";
:host { :host {
max-width: 100%;
ion-select, ion-select,
ion-button { ion-button {
--icon-margin: 0 8px; --icon-margin: 0 8px;

View File

@ -167,7 +167,7 @@
<!-- Template to render a section download button/progress. --> <!-- Template to render a section download button/progress. -->
<ng-template #sectionDownloadTemplate let-section="section"> <ng-template #sectionDownloadTemplate let-section="section">
<div *ngIf="section && downloadEnabled" slot="end" class="core-button-spinner core-section-download"> <div *ngIf="section && downloadEnabled" slot="end" class="core-button-spinner">
<!-- Download progress. --> <!-- Download progress. -->
<ion-badge class="core-course-download-section-progress" <ion-badge class="core-course-download-section-progress"
*ngIf="section.isDownloading && section.total > 0 && section.count < section.total" role="progressbar" *ngIf="section.isDownloading && section.total > 0 && section.count < section.total" role="progressbar"

View File

@ -55,13 +55,18 @@
} }
} }
.core-section-download.core-button-spinner { .core-section-download {
display: flex; core-combobox {
align-items: center; max-width: calc(100% - 64px);
@include margin-horizontal(10px); }
.core-button-spinner {
display: flex;
align-items: center;
@include margin-horizontal(10px);
ion-badge.core-course-download-courses-progress { ion-badge.core-course-download-courses-progress {
@include margin(null, 12px, null, null); @include margin(null, 12px, null, null);
}
} }
} }