logo link to home and footer with back to top button

pyconbalkan/core/static/css/components/page.css

@@ -6,8 +6,9 @@
     margin: 0 auto;
     grid-template-areas:
         ". logo ."
-        "menu menu menu" 
-        "sidebar main main";
+        "menu menu menu"
+        "sidebar main main"
+        ". footer .";
     grid-template-rows: 240px 60px auto;
     grid-template-columns: 1fr 1fr 1fr;
     grid-gap: 20px;

pyconbalkan/core/static/css/main.css

@@ -61,6 +61,7 @@ ul li {
     background-size: contain;
     background-repeat: no-repeat;
     background-position: center;
+    /*z-index: 1000;*/
 }
 
 .coming-soon {
@@ -83,6 +84,24 @@ ul li {
     overflow: hidden;
 }
 
+footer {
+    grid-area: footer;
+    /*width: 100%;*/
+}
+
+#totop {
+    display: none;
+}
+
+.hide {
+    opacity:0;
+    left:-100%;
+}
+.show {
+    opacity:1;
+    left:0;
+}
+
 #bgVideo {
     position: fixed;
     right: 0;

pyconbalkan/core/static/js/go_to_top.js

@@ -1,4 +1,15 @@
 function topFunction() {
     document.body.scrollTop = 0;
     document.documentElement.scrollTop = 0;
-}
+}
+
+// When the user scrolls down 20px from the top of the document, show the button
+window.onscroll = function() {scrollFunction()};
+
+function scrollFunction() {
+  if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
+    document.getElementById("totop").style.display = "inline-block";
+  } else {
+    document.getElementById("totop").style.display = "none";
+  }
+}

pyconbalkan/core/templates/base.html

@@ -83,9 +83,13 @@
         {% block main_content %}{% endblock %}
     </article>
 
+    {% include 'includes/footer.html' %}
+
     <video autoplay muted loop id="bgVideo">
         <source src="{% static 'video/pycon-bg-2019-loop.mp4' %}" type="video/mp4">
     </video>
 </body>
-    {% block scripts %}{% endblock %}
+    {% block scripts %}
+        <script src="{% static 'js/go_to_top.js' %}" type="text/javascript"></script>
+    {% endblock %}
 </html>

pyconbalkan/core/templates/includes/event_sidebar.html

@@ -30,6 +30,6 @@ <h1>#{{ request.conference.number }}</h1>
     </div>
     <h3 class="supported-by">Supported by</h3>
     {% for sidebar_sponsor in sidebar_sponsors %}
-    <a href="{{ sidebar_sponsor.url }}" class="supported-by-img"><div><img src="{{ sidebar_sponsor.logo.url }}"></div></a>
+    <a href="{{ sidebar_sponsor.url }}" class="supported-by-img"><div><img src="{% get_media_prefix %}{{ sidebar_sponsor.logo.name }}"></div></a>
     {% endfor %}
 </aside>

pyconbalkan/core/templates/includes/footer.html

@@ -0,0 +1,5 @@
+<footer>
+    <div>
+        <a class="button button--blue" id="totop" onclick="topFunction()"><i class="fas fa-angle-up"></i> Back to top</a>
+    </div>
+</footer>

pyconbalkan/info/templates/info.html

@@ -133,14 +133,7 @@ <h3>Nikola Tesla Museum</h3>
                 </ul>
             </p>
 
-            <div>
-                <a class="button button--blue" onclick="topFunction()"><i class="fas fa-angle-up"></i> Back to top</a>
-            </div>
         </div>
     </div>
 
 {% endblock %}
-
-{% block scripts %}
-<script src="{% static 'js/go_to_top.js' %}" type="text/javascript"></script>
-{% endblock %}

pyconbalkan/speaker/templates/speakers.html

@@ -44,6 +44,9 @@ <h4 class="speaker__presentation">{{ presentation.title }}</h4>
             </div>
             {% endfor %}
         </div>
+        <div>
+            <a class="button button--blue" onclick="topFunction()"><i class="fas fa-angle-up"></i> Back to top</a>
+        </div>
     {% else %}
         <h2 class="coming-soon">
             Coming Soon