From 31d74da8e7479b850dda2d95eaceb8df36a1398c Mon Sep 17 00:00:00 2001
From: Paul <paulmakles@gmail.com>
Date: Sat, 3 Jul 2021 22:35:49 +0100
Subject: [PATCH] Remove gradient on server banners.

---
 src/components/common/ServerHeader.tsx |  2 +-
 src/components/ui/Header.tsx           | 23 ++++++++++++-----------
 2 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/src/components/common/ServerHeader.tsx b/src/components/common/ServerHeader.tsx
index 4ed11aa0..1218cdd1 100644
--- a/src/components/common/ServerHeader.tsx
+++ b/src/components/common/ServerHeader.tsx
@@ -24,7 +24,7 @@ export default function ServerHeader({ server, ctx }: Props) {
         <Header borders
             placement="secondary"
             background={typeof bannerURL !== 'undefined'}
-            style={{ background: bannerURL ? `linear-gradient(to bottom, transparent 50%, #000e), url('${bannerURL}')` : undefined }}>
+            style={{ background: bannerURL ? `url('${bannerURL}')` : undefined }}>
             <ServerName>
                 { server.name }
             </ServerName>
diff --git a/src/components/ui/Header.tsx b/src/components/ui/Header.tsx
index f3948d6f..37652397 100644
--- a/src/components/ui/Header.tsx
+++ b/src/components/ui/Header.tsx
@@ -7,19 +7,19 @@ interface Props {
 }
 
 export default styled.div<Props>`
-    display: flex;
-    height: 48px;
-    font-weight: 600;
-    align-items: center;
-    user-select: none;
     gap: 6px;
+    height: 48px;
     flex: 0 auto;
-    padding: 0 16px;
+    display: flex;
     flex-shrink: 0;
+    padding: 0 16px;
+    font-weight: 600;
+    user-select: none;
+    align-items: center;
 
-    background-color: var(--primary-header);
     background-size: cover !important;
     background-position: center !important;
+    background-color: var(--primary-header);
 
     svg {
         flex-shrink: 0;
@@ -33,10 +33,11 @@ export default styled.div<Props>`
         height: 56px;
     }
     
-
     ${ props => props.background && css`
-        height: 120px;
+        height: 120px !important;
         align-items: flex-end;
+
+        text-shadow: 0px 0px 1px black;
     ` }
 
     ${ props => props.placement === 'secondary' && css`
@@ -44,7 +45,7 @@ export default styled.div<Props>`
         padding: 14px;
     ` }
 
-    ${ props => props.borders && css`
-        /*border-start-start-radius: 8px;*/
+    ${ props => props.borders && css`    
+        border-end-start-radius: 8px;
     ` }
 `;