From e8bea56d09abd8758f25c7db005d367e5a434d3d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?=
 <tugcekucukoglu.860@gmail.com>
Date: Mon, 10 Jan 2022 16:15:19 +0300
Subject: [PATCH] primeblocks added topbar

---
 src/App.vue                            |  5 ++---
 src/assets/styles/app/_news.scss       | 24 +++++++++---------------
 src/assets/styles/app/_responsive.scss |  3 +--
 3 files changed, 12 insertions(+), 20 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 5bfb716d3..d7ea9cc2d 100755
--- a/src/App.vue
+++ b/src/App.vue
@@ -2,10 +2,9 @@
     <div class="layout-wrapper" :class="containerClass">
         <div class="layout-news" v-if="newsActive">
             <div class="layout-news-container" @click="redirect">
-                <img class="layout-news-logo p-ml-2" src="./assets/images/topbar-newyear-logo.svg">
-                <h3 class="layout-news-header p-px-2">UP TO 50% DISCOUNT AT PRIMESTORE</h3>
+                <img class="layout-news-logo p-ml-2" src="./assets/images/topbar-primeblocks-device.png">
                 <a href="https://www.primefaces.org/primeblocks-vue" target="_blank" tabindex="-1" class="layout-news-button">
-                    VISIT SITE
+                    Read More
                 </a>
                 <a tabindex="0" class="layout-news-close" @click="hideNews">
                     <i class="pi pi-times"></i>
diff --git a/src/assets/styles/app/_news.scss b/src/assets/styles/app/_news.scss
index 42cb83c8f..bafd9e40f 100644
--- a/src/assets/styles/app/_news.scss
+++ b/src/assets/styles/app/_news.scss
@@ -4,8 +4,8 @@
     justify-content: center;
     align-items: center;
     margin-left: 250px;
-    background-image: url('./assets/images/topbar-newyear-bg.png'), linear-gradient(180deg, #D2000B 0%, #9B0008 100%);
-    background-blend-mode: multiply;
+    background-image: linear-gradient(197.37deg, rgba(0, 120, 227, 0.07) -0.38%, rgba(165, 72, 181, 0) 101.89%), linear-gradient(115.93deg, rgba(62, 136, 246, 0.15) 4.86%, rgba(62, 180, 246, 0.0495) 38.05%, rgba(62, 235, 246, 0) 74.14%), radial-gradient(56.47% 76.87% at 6.92% 7.55%, rgba(62, 136, 246, 0.05) 0%, rgba(62, 158, 246, 0.013) 52.16%, rgba(62, 246, 246, 0) 100%), linear-gradient(306.53deg, rgba(163, 171, 217, 0.1) 19.83%, rgba(163, 171, 217, 0) 97.33%);
+    background-color: white;
 
     .layout-news-container {
         width: 100%;
@@ -26,16 +26,14 @@
         }
 
         img.layout-news-logo {
-            position: absolute;
-            left: 250px;
+            height: 70px;
         }
 
         .layout-news-button {
-            background: linear-gradient(180deg, #D8000A 0%, rgba(251, 0, 1, 0.4) 89.06%, rgba(255, 0, 0, 0) 100%);
-            border-radius: 5px;
-            color: #ffffff;
-            font-size: 14px;
-            padding: 0.5em 0.75em;
+            border: 2px solid #283738;
+            color: #283738;
+            font-size: 15px;
+            padding: 0.3em 0.5em;
             font-weight: 700;
             border-radius: 3px;
             flex-shrink: 0;
@@ -45,7 +43,7 @@
             z-index: 1;
 
             &:hover {
-                background: linear-gradient(180deg, #EE000B 0%, rgba(255, 0, 0, 0.55) 100%);
+                background-color: rgba(0, 0, 0, 0.25);
             }
         }
     }
@@ -56,7 +54,7 @@
         position: absolute;
         z-index: 2;
         right: 28px;
-        background: linear-gradient(180deg, #D8000A 0%, rgba(255, 0, 0, 0) 100%);
+        background-color: rgba(0,0,0,.3);
         filter: drop-shadow(0px 12px 12px rgba(0, 0, 0, 0.17));
         border-radius: 50%;
         display: flex;
@@ -64,9 +62,5 @@
         align-items: center;
         width: 34px;
         height: 34px;
-
-        &:hover {
-            background: linear-gradient(180deg, #EE000B 0%, rgba(255, 0, 0, 0.55) 100%);
-        }
     }
 }
diff --git a/src/assets/styles/app/_responsive.scss b/src/assets/styles/app/_responsive.scss
index 32c99a82e..7c86d36f1 100644
--- a/src/assets/styles/app/_responsive.scss
+++ b/src/assets/styles/app/_responsive.scss
@@ -2,8 +2,7 @@
     .layout-wrapper {
         .layout-news {
             margin-left: 250px;
-            .layout-news-button,
-            .layout-news-logo {
+            .layout-news-button {
                 display: none;
             }
         }