From de8f2404b6fe8d81f65381fbf999df320d8f3202 Mon Sep 17 00:00:00 2001
From: Blackbaud-PatrickOFriel <patrick.ofriel@blackbaud.com>
Date: Fri, 12 May 2017 16:39:50 -0400
Subject: [PATCH] Handle styles for filedrop when links are not allowed

---
 src/modules/fileattachments/file-drop.component.html  |  2 +-
 src/modules/fileattachments/file-drop.component.scss  |  4 ++++
 .../file-drop.component.visual-spec.js                | 11 +++++++++++
 .../fixtures/file-drop.component.visual-fixture.html  |  9 ++++++++-
 .../fixtures/file-drop.component.visual-fixture.ts    |  2 ++
 5 files changed, 26 insertions(+), 2 deletions(-)

diff --git a/src/modules/fileattachments/file-drop.component.html b/src/modules/fileattachments/file-drop.component.html
index 8fdc90b42..03c0e27fa 100644
--- a/src/modules/fileattachments/file-drop.component.html
+++ b/src/modules/fileattachments/file-drop.component.html
@@ -1,4 +1,4 @@
-<div class="sky-file-drop-row">
+<div class="sky-file-drop-row" [ngClass]="{'sky-file-drop-allow-links': allowLinks}">
     <div class="sky-file-drop-col">
       <button
         type="button"
diff --git a/src/modules/fileattachments/file-drop.component.scss b/src/modules/fileattachments/file-drop.component.scss
index d4f385806..576ab5cfc 100644
--- a/src/modules/fileattachments/file-drop.component.scss
+++ b/src/modules/fileattachments/file-drop.component.scss
@@ -13,6 +13,10 @@
   }
 
   .sky-file-drop-col {
+    flex-basis: 100%;
+  }
+
+  .sky-file-drop-allow-links.sky-file-drop-col {
     flex-basis: 50%;
   }
 }
diff --git a/src/modules/fileattachments/file-drop.component.visual-spec.js b/src/modules/fileattachments/file-drop.component.visual-spec.js
index 9375448da..202dcc8a4 100644
--- a/src/modules/fileattachments/file-drop.component.visual-spec.js
+++ b/src/modules/fileattachments/file-drop.component.visual-spec.js
@@ -9,4 +9,15 @@ describe('File drop', function () {
         selector: '#screenshot-file-drop'
       });
   });
+
+  it('should match the file drop control when no links allowed', function () {
+    return browser
+      .setupTest('/fileattachments.html')
+      .click('.sky-test-allow-links')
+      .pause(1000)
+      .compareScreenshot({
+        screenshotName: 'file_drop_nolink',
+        selector: '#screenshot-file-drop'
+      });
+  });
 });
diff --git a/src/modules/fileattachments/fixtures/file-drop.component.visual-fixture.html b/src/modules/fileattachments/fixtures/file-drop.component.visual-fixture.html
index 6b778b6f9..dc63c0c4f 100644
--- a/src/modules/fileattachments/fixtures/file-drop.component.visual-fixture.html
+++ b/src/modules/fileattachments/fixtures/file-drop.component.visual-fixture.html
@@ -5,7 +5,7 @@
       (linkChanged)="linkAdded($event)"
       [maxFileSize]="maxFileSize"
       [validateFn]="validateFile"
-      [allowLinks]="true">
+      [allowLinks]="allowLinks">
     </sky-file-drop>
 
     <div *ngFor="let file of allItems">
@@ -13,3 +13,10 @@
     </div>
   </div>
 </div>
+
+<button
+  type="button"
+  class="sky-btn sky-btn-primary sky-test-allow-links"
+  (click)="allowLinks = !allowLinks">
+  Toggle allowLinks
+</button>
diff --git a/src/modules/fileattachments/fixtures/file-drop.component.visual-fixture.ts b/src/modules/fileattachments/fixtures/file-drop.component.visual-fixture.ts
index 831d54053..1c71c2820 100644
--- a/src/modules/fileattachments/fixtures/file-drop.component.visual-fixture.ts
+++ b/src/modules/fileattachments/fixtures/file-drop.component.visual-fixture.ts
@@ -27,6 +27,8 @@ class AppComponent {
 
   public acceptedTypes: Array<String>;
 
+  public allowLinks: boolean = true;
+
   constructor() {
     this.filesToUpload = [];
     this.rejectedFiles = [];