From b375fa37845f3171940b45ed1ddf2f6b3acc1132 Mon Sep 17 00:00:00 2001
From: Set Sakrecoer <set@sakrecoer.com>
Date: Tue, 18 Jun 2019 11:59:16 +0200
Subject: [PATCH] fixing scrolling macaron

---
 _includes/hero.html     | 61 +++++++++++++++--------------------------
 _includes/rightnow.html | 18 ++++++++++++
 _layouts/default.html   | 29 ++++++++++----------
 _sass/poster.scss       |  3 +-
 _sass/stylish.scss      | 23 ++++++++++++++--
 5 files changed, 77 insertions(+), 57 deletions(-)
 create mode 100644 _includes/rightnow.html

diff --git a/_includes/hero.html b/_includes/hero.html
index a5f5a2f..a431bc7 100644
--- a/_includes/hero.html
+++ b/_includes/hero.html
@@ -1,67 +1,50 @@
 <!-- BEGIN hero.html -->
 <div id="banner" style={% if page.url == "/" %}"height:100%"{% else %}"height:30%"{% endif %}>
-  <canvas style="display:none" id="canvas" width="285" height="285"></canvas>
-  <canvas style="display:none" id="canvas3" width="570" height="570"></canvas>
-  <canvas id="canvas2" width="570" height="570">*** THIS BROWSER DOES NOT SUPPORT THE CANVAS ELEMENT ***</canvas>
+
   <div>
-    <a href="{{ site.baseurl }}/" class="nodecoration"><img src="{{ site.baseurl }}/assets/img/logo%20galleri%20momangen.svg" alt="{{ site.title }}" /></a>
+    <a href="{{ site.baseurl }}/" class="nodecoration"><img
+        src="{{ site.baseurl }}/assets/img/logo%20galleri%20momangen.svg" alt="{{ site.title }}" /></a>
     {% if page.url == "/" %}
     <div id="poster">
-
-
       <!-- Begin Up next -->
       {% capture now -%}{{ site.time | date: '%s' }}{%- endcapture %}
       {% for event in site.events %}
-
-        
-      {% capture endtime -%} 
+      {% capture endtime -%}
       {{ event.event_data.end_datetime | date: '%s' }}
       {%- endcapture %}
-
- 
       {% if now <= endtime %}
-
-
-
       <div>
         <p>På gång:</p>
         <a href="cloudcannon:collections/{{ event.path }}" class="editor-link cms-editor-link">Redigera Event</a>
         <h2><a href="{{ event.url }}" class="nodecoration">{{ event.title }}</a></h2>
         <p>
-          {% assign d = event.event_data.start_datetime | date: "%-d"  %}{% case d %}{% when '1' or '21' or '31' or '2' or '22' %}{{ d }}:a {% else %}{{ d }}:e{% endcase %}
-          
+          {% assign d = event.event_data.start_datetime | date: "%-d"  %}{% case d %}{% when '1' or '21' or '31' or '2' or '22' %}{{ d }}:a
+          {% else %}{{ d }}:e{% endcase %}
           {% assign m = event.event_data.start_datetime | date: "%-m" %}
-
           {% case m %}
-            {% when '1' %}Januar
-            {% when '2' %}Februar
-            {% when '3' %}Mars
-            {% when '4' %}April
-            {% when '5' %}Maj
-            {% when '6' %}Juni
-            {% when '7' %}Juli
-            {% when '8' %}Augusti
-            {% when '9' %}September
-            {% when '10' %}October
-            {% when '11' %}November
-            {% when '12' %}December
+          {% when '1' %}Januar
+          {% when '2' %}Februar
+          {% when '3' %}Mars
+          {% when '4' %}April
+          {% when '5' %}Maj
+          {% when '6' %}Juni
+          {% when '7' %}Juli
+          {% when '8' %}Augusti
+          {% when '9' %}September
+          {% when '10' %}October
+          {% when '11' %}November
+          {% when '12' %}December
           {% endcase %}
           {{ event.event_data.start_datetime | date: "%Y" }}
-
-         
-           kl. {{ event.event_data.start_datetime | date: "%R"}}<br />
+          kl. {{ event.event_data.start_datetime | date: "%R"}}<br />
           Typ av konst: {{ event.category }}</p>
-        <h3>{{ event.event_data.description | truncatewords: 10 }} <span><a href="{{ event.url }}">Läs mer</a></span></h3>
-       
-        
+        <h3>{{ event.event_data.description | truncatewords: 10 }} <span><a href="{{ event.url }}">Läs mer</a></span>
+        </h3>
       </div>
       {% break %}
       {% endif %}
-  
       {% endfor %}
-
-<!-- end Up next-->
-
+      <!-- end Up next-->
     </div>
     {% else %}{% endif %}
   </div>
diff --git a/_includes/rightnow.html b/_includes/rightnow.html
new file mode 100644
index 0000000..45b9b80
--- /dev/null
+++ b/_includes/rightnow.html
@@ -0,0 +1,18 @@
+<div id="rightnow">
+  {% if site.data.open.open == true %}
+  <h4>Just Nu:</h4>
+  <h3>Öppet<br />för almänheten!</h3>
+  <p>Kom hit!</p>
+  {% else %}
+  <h4>Just Nu:</h4>
+  <h3>Produktion <br />på gång! </h3>
+  <p>kom tillbaka snart!
+    <br /><a href="{{ site.baseurl }}/privacy-policy/">Bli stödmedlem</a></p>
+    {% endif %}
+</div>
+
+<script type="text/javascript">
+  $(window).scroll(function(){
+      $("#rightnow").css("opacity", 1 - $(window).scrollTop() / 650);
+  });
+</script>
diff --git a/_layouts/default.html b/_layouts/default.html
index 111d54f..43762c7 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -1,22 +1,23 @@
 <!DOCTYPE html>
 <html>
 <head>
-{% include metahead.html %}
+  {% include metahead.html %}
 </head>
+<body id=>
+  <canvas style="display:none" id="canvas" width="285" height="285"></canvas>
+  <canvas style="display:none" id="canvas3" width="570" height="570"></canvas>
+  <canvas id="canvas2" width="570" height="570">*** THIS BROWSER DOES NOT SUPPORT THE CANVAS ELEMENT ***</canvas>
+  {% include rightnow.html %}
+  {% include editor-open-closebutton.html %}
+  {% include hero.html %}
+  <div id="content">
+    {{ content }}
+  </div>
 
-<body>
-{% include editor-open-closebutton.html %}
-{% include hero.html %}
+  <div id="footer">
+    {% include footer.html %}
+  </div>
 
-<!-- <div id="navigation"> </div> -->
- 
-<div id="content">
-{{ content }}
-</div> 
 
-<div id="footer">
-{% include footer.html %}
-</div>
 </body>
-
-</html>
\ No newline at end of file
+</html>
diff --git a/_sass/poster.scss b/_sass/poster.scss
index e71005d..ebb8726 100644
--- a/_sass/poster.scss
+++ b/_sass/poster.scss
@@ -2,6 +2,7 @@
 // POSTER
 /////////
 #poster {
+
   width: 90vw;
   margin-right: auto !important; 
   display: flex;
@@ -36,5 +37,5 @@ canvas {
   left:0;
   height:100%;
   width:100%;
-  z-index: -1;
+  z-index: -3;
 }
diff --git a/_sass/stylish.scss b/_sass/stylish.scss
index 7e49a40..10d9469 100644
--- a/_sass/stylish.scss
+++ b/_sass/stylish.scss
@@ -72,7 +72,7 @@ a:active {
   width: 100%;
   height: 100vh;
   background-color: rgba(201, 246, 236, 0.3);
-  
+  z-index: -10;
   div {
     align-self: flex-end ;
     flex: 1 1 auto;
@@ -114,13 +114,15 @@ a:active {
   display: flex;
   flex-wrap: wrap;
   overflow-x: hidden;
-  background: rgba(255, 255, 255, 0.1) url('/assets/img/bg.png');
+  background: rgba(255, 255, 255, 0.5) url('/assets/img/bg.png');
+  z-index: 10;
+
 }
 .column {
   flex: 1 0 320px;
   margin-left:5px;
   margin-right: 5px;
-
+  z-index: 10;
   img {
     float: left;
     margin-right: 5px;
@@ -157,4 +159,19 @@ a:active {
   height: 150px;
   border-radius: 46%;
   background-position: center;
+}
+
+#rightnow {
+  position: fixed;
+  top: 10px;
+  right: 10px;
+  width: 200px;
+  height: 200px;
+  border-radius: 47%;
+  z-index: 0;
+  transform: rotate(-23deg);
+  text-align: center;
+  line-height: 18px;
+  opacity: 1;
+  background: rgba(255, 255, 255, 0.5) url('/assets/img/bg.png');
 }
\ No newline at end of file