From dabc5fae53f8a9a66bc93f5d1b96e4c8a0610e1d Mon Sep 17 00:00:00 2001
From: matthijs <vos1996@gmail.com>
Date: Tue, 19 May 2020 15:12:15 +0200
Subject: [PATCH 1/2] Add sponsorkliks alert on main page

---
 app/components/index/sponsorkliks-alert.js    | 11 ++++++++
 .../components/index/sponsorkliks-alert.hbs   | 25 +++++++++++++++++++
 app/templates/index/authenticated.hbs         |  3 +++
 3 files changed, 39 insertions(+)
 create mode 100644 app/components/index/sponsorkliks-alert.js
 create mode 100644 app/templates/components/index/sponsorkliks-alert.hbs

diff --git a/app/components/index/sponsorkliks-alert.js b/app/components/index/sponsorkliks-alert.js
new file mode 100644
index 000000000..eb7649e4a
--- /dev/null
+++ b/app/components/index/sponsorkliks-alert.js
@@ -0,0 +1,11 @@
+import Component from '@glimmer/component';
+
+export default class SponsorkliksAlertComponent extends Component {
+  extensionInstalled = document.documentElement.dataset.sponsorkliksExtension === '1';
+
+  isFirefox = typeof InstallTrigger !== 'undefined';
+
+  isChrome = !!window.chrome && (!!window.chrome.webstore || !!window.chrome.runtime);
+
+  showAlert = !this.extensionInstalled && (this.isFirefox || this.isChrome)
+}
diff --git a/app/templates/components/index/sponsorkliks-alert.hbs b/app/templates/components/index/sponsorkliks-alert.hbs
new file mode 100644
index 000000000..1773e57cd
--- /dev/null
+++ b/app/templates/components/index/sponsorkliks-alert.hbs
@@ -0,0 +1,25 @@
+{{#if showAlert}}
+  <div class="row">
+    <div class="col-12 alert alert-info">
+      We hebben een supertoffe chrome/firefox extensie voor onze C.S.V. Alpha Sponsorkliks.<br/>
+      Hoe werkt dat? Heel simpel, jij installeert de extensie en als je wat koopt bij verschillende webshops verdient Alpha er ook nog wat aan.
+      De uitgebreide uitleg vind je <b><LinkTo @route="static-pages.show" @model="alpha-deals">hier</LinkTo></b>.
+
+      <br /><br />
+
+      {{#if isFirefox}}
+        <a href="https://addons.mozilla.org/nl/firefox/addon/csvalpha-sponsor-extensie/">
+          <b>Klik hier om de Firefox extensie te installeren.</b>
+        </a>
+
+      {{/if}}
+      {{#if isChrome}}
+        <a href="https://chrome.google.com/webstore/detail/csv-alpha-sponsor-extensi/anlcblpmlnecbomgkbmfngcpbaciipml?hl=nl">
+          <b>Klik hier om de Chrome extensie te installeren.</b>
+        </a>
+      {{/if}}
+
+      <br/><br/><small>Dit blok verdwijnt automatisch als je de extensie installeert.</small>
+    </div>
+  </div>
+{{/if}}
\ No newline at end of file
diff --git a/app/templates/index/authenticated.hbs b/app/templates/index/authenticated.hbs
index 8472ad263..b40b84688 100644
--- a/app/templates/index/authenticated.hbs
+++ b/app/templates/index/authenticated.hbs
@@ -24,6 +24,9 @@
   <AdvertisementTool />
 </div>
 
+<Index::SponsorkliksAlert />
+
+
 <div class="row pt-4">
   <div class="col-7 d-none d-md-block">
     <QuickPost />

From 3dd3cc0ea6d12d3269fba24b9f0dc5a7387bd370 Mon Sep 17 00:00:00 2001
From: matthijs <vos1996@gmail.com>
Date: Tue, 19 May 2020 16:37:18 +0200
Subject: [PATCH 2/2] Fix alignment

---
 .../components/index/sponsorkliks-alert.hbs   | 34 +++++++++----------
 app/templates/index/authenticated.hbs         |  4 ++-
 2 files changed, 19 insertions(+), 19 deletions(-)

diff --git a/app/templates/components/index/sponsorkliks-alert.hbs b/app/templates/components/index/sponsorkliks-alert.hbs
index 1773e57cd..6a44f499a 100644
--- a/app/templates/components/index/sponsorkliks-alert.hbs
+++ b/app/templates/components/index/sponsorkliks-alert.hbs
@@ -1,25 +1,23 @@
 {{#if showAlert}}
-  <div class="row">
-    <div class="col-12 alert alert-info">
-      We hebben een supertoffe chrome/firefox extensie voor onze C.S.V. Alpha Sponsorkliks.<br/>
-      Hoe werkt dat? Heel simpel, jij installeert de extensie en als je wat koopt bij verschillende webshops verdient Alpha er ook nog wat aan.
-      De uitgebreide uitleg vind je <b><LinkTo @route="static-pages.show" @model="alpha-deals">hier</LinkTo></b>.
+  <div class="col-12 alert alert-info">
+    We hebben een supertoffe chrome/firefox extensie voor onze C.S.V. Alpha Sponsorkliks.<br/>
+    Hoe werkt dat? Heel simpel, jij installeert de extensie en als je wat koopt bij verschillende webshops verdient Alpha er ook nog wat aan.
+    De uitgebreide uitleg vind je <b><LinkTo @route="static-pages.show" @model="alpha-deals">hier</LinkTo></b>.
 
-      <br /><br />
+    <br /><br />
 
-      {{#if isFirefox}}
-        <a href="https://addons.mozilla.org/nl/firefox/addon/csvalpha-sponsor-extensie/">
-          <b>Klik hier om de Firefox extensie te installeren.</b>
-        </a>
+    {{#if isFirefox}}
+      <a href="https://addons.mozilla.org/nl/firefox/addon/csvalpha-sponsor-extensie/">
+        <b>Klik hier om de Firefox extensie te installeren.</b>
+      </a>
 
-      {{/if}}
-      {{#if isChrome}}
-        <a href="https://chrome.google.com/webstore/detail/csv-alpha-sponsor-extensi/anlcblpmlnecbomgkbmfngcpbaciipml?hl=nl">
-          <b>Klik hier om de Chrome extensie te installeren.</b>
-        </a>
-      {{/if}}
+    {{/if}}
+    {{#if isChrome}}
+      <a href="https://chrome.google.com/webstore/detail/csv-alpha-sponsor-extensi/anlcblpmlnecbomgkbmfngcpbaciipml?hl=nl">
+        <b>Klik hier om de Chrome extensie te installeren.</b>
+      </a>
+    {{/if}}
 
-      <br/><br/><small>Dit blok verdwijnt automatisch als je de extensie installeert.</small>
-    </div>
+    <br/><br/><small>Dit blok verdwijnt automatisch als je de extensie installeert.</small>
   </div>
 {{/if}}
\ No newline at end of file
diff --git a/app/templates/index/authenticated.hbs b/app/templates/index/authenticated.hbs
index b40b84688..4005c7b01 100644
--- a/app/templates/index/authenticated.hbs
+++ b/app/templates/index/authenticated.hbs
@@ -24,7 +24,9 @@
   <AdvertisementTool />
 </div>
 
-<Index::SponsorkliksAlert />
+<div class="article-cards-wrapper full-width-small-screens pl-3 pl-md-0">
+  <Index::SponsorkliksAlert />
+</div>
 
 
 <div class="row pt-4">