From 4906e52c57731ed86ee46eacd1a7ed324e713ae1 Mon Sep 17 00:00:00 2001
From: Isaac Grynsztein <IsaacMGrynsztein@gmail.com>
Date: Thu, 26 Mar 2020 10:48:46 -0400
Subject: [PATCH] Adjusted styling for advanced download bar to make it look
 more natural and part of the page

---
 src/app/main/main.component.css  | 8 ++++++++
 src/app/main/main.component.html | 6 +++---
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/app/main/main.component.css b/src/app/main/main.component.css
index 8414c07..699b69d 100644
--- a/src/app/main/main.component.css
+++ b/src/app/main/main.component.css
@@ -124,4 +124,12 @@ mat-form-field.mat-form-field {
 .edit-button {
     margin-left: 10px;
     top: -5px;
+}
+
+.no-border-radius-bottom {
+    border-radius: 4px 4px 0px 0px;
+}
+
+.no-border-radius-top {
+    border-radius: 0px 0px 4px 4px;
 }
\ No newline at end of file
diff --git a/src/app/main/main.component.html b/src/app/main/main.component.html
index aa5bb21..6cb6be1 100644
--- a/src/app/main/main.component.html
+++ b/src/app/main/main.component.html
@@ -1,6 +1,6 @@
 <br/>
 <div class="big demo-basic">
-    <mat-card id="card" style="margin-right: 20px; margin-left: 20px;">
+    <mat-card id="card" style="margin-right: 20px; margin-left: 20px;" [ngClass]="(allowAdvancedDownload) ? 'no-border-radius-bottom' : null">
         <mat-card-title>
             <ng-container i18n="Youtube downloader home page label">Youtube Downloader</ng-container>
         </mat-card-title>
@@ -90,7 +90,7 @@
 </div>
 <div *ngIf="allowAdvancedDownload" class="big demo-basic">
     <form style="margin-left: 20px; margin-right: 20px;">
-        <mat-expansion-panel class="big">
+        <mat-expansion-panel class="big no-border-radius-top">
             <mat-expansion-panel-header>
                 <mat-panel-title>
                     <ng-container i18n="Advanced download mode panel">
@@ -159,7 +159,7 @@
     <mat-card id="card" style="margin-right: 20px; margin-left: 20px;">
         <div class="container">
             <div *ngFor="let download of downloads; let i = index;" class="row">
-                <ng-container *ngIf="current_download !== download">
+                <ng-container *ngIf="current_download !== download && download['downloading']">
                     <app-download-item style="width: 100%" [download]="download" [queueNumber]="i+1" (cancelDownload)="cancelDownload($event)"></app-download-item>
                     <mat-divider style="position: relative" *ngIf="i !== downloads.length - 1"></mat-divider>
                 </ng-container>