Properly show bar on non-index pages

d048633c · Janne Mareike Koschinski · 00e15eee · d048633c · d048633c · d048633c
Commit d048633c authored 7 years ago by Janne Mareike Koschinski
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -14,6 +14,10 @@ body:not(.noscript) img[data-src] {
  transition: padding 0.5s ease, background 0.5s ease, box-shadow 0.5s ease, border 0.5s ease !important;
 }

+body:not(.index) .following.bar {
+  position: sticky!important;
+}
+
 .ui.logo {
  opacity: .9 !important;
  float: none !important;
@@ -151,6 +155,16 @@ body.noscript .following.bar, .following.bar.qd {
  overflow: hidden !important;
 }

+.pusher {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+}
+
+.pusher > .full.height {
+  flex-grow: 1;
+}
+
 @media (max-width: 359px) {
  .ui.menu .item {
    font-size: 0.9rem !important;

--- a/assets/css/style.min.css
+++ b/assets/css/style.min.css
-img[data-src]{filter:blur(2px)!important}.following.bar{position:fixed!important;top:0!important;z-index:900!important;left:0!important;padding:2em 0!important;width:100%!important;box-shadow:0 0 0 0 transparent!important;border-bottom:1px solid transparent!important;transition:padding .5s ease,background .5s ease,box-shadow .5s ease,border .5s ease!important}.ui.logo{opacity:.9!important;float:none!important;margin:0 .35714286em 0 0 !important;height:1em!important}.secondary.menu .item{line-height:1.6rem!important}.secondary.menu .item > i.icon{height:1.6rem!important}.following.bar{padding:1em 0!important}body.noscript .following.bar,.following.bar.qd{background:#0a70c0!important}.masthead{position:relative!important;overflow:hidden!important;text-align:center!important;color:rgba(255,255,255,0.9)!important;margin-bottom:0!important;border-bottom:none!important;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 1440 810'%3E%3Cpath fill='%23124e99' fill-opacity='.25' d='M334.24 0L539.8 205.54 745.32 0h-411.1z'/%3E%3Cpath fill='%23124e99' fill-opacity='.3' d='M1366.24 0l-516 516 44.04 44.04L1440 14.32V0h-73.76z'/%3E%3Cpath fill='%230291e7' fill-opacity='.64' d='M745.33 0L539.8 205.54 850.23 516l516-516h-620.9z'/%3E%3Cpath fill='%230291e7' fill-opacity='.57' d='M1440 14.32L894.28 560.04l128.08 128.08 150.1-150.1L1440 270.5V14.32z'/%3E%3Cpath fill='%230291e7' fill-opacity='.28' d='M1440 270.48l-267.55 267.55L1440 805.58v-535.1z'/%3E%3Cpath fill='%23124e99' fill-opacity='.71' d='M1022.36 688.12L1144.24 810H1440v-4.42l-267.55-267.55-150.1 150.1z'/%3E%3Cpath fill='%230291e7' fill-opacity='.46' d='M0 0v455.43L354.57 810h789.67l-810-810H0z'/%3E%3Cpath fill='%23124e99' fill-opacity='.68' d='M0 455.43v80.96L273.6 810h80.97L0 455.43z'/%3E%3Cpath fill='%230291e7' fill-opacity='.4' d='M0 536.4V810h273.6L0 536.4z'/%3E%3C/svg%3E") center center no-repeat,linear-gradient(148deg,#124E99 7%,#105a94 20%,#0a70c0 27%,#0291E7 60%,#0271B3 100%)!important;background-size:cover,cover!important;padding:10rem 0!important;max-height:100vh!important}.masthead:after{content:""!important;height:calc(50px + 7vh + 7vw)!important;position:absolute!important;bottom:0!important;left:0!important;right:0!important;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 1440 810'%3E%3Cpath d='M 0%2C810 1440%2C0 l 0%2C810 z' fill='%23fff'/%3E%3C/svg%3E") no-repeat center center!important;background-size:100% 100%!important}.introduction h1.header{font-size:4.5rem!important}.pusher .stripe h2{font-size:26px!important}.ui.grid .row + .ui.divider{margin-top:3rem!important;margin-bottom:3rem!important}#image_container img.phone{display:inline-block!important;max-height:33vw!important;max-width:355px!important;vertical-align:middle!important}#image_container img.tablet{display:inline-block!important;max-height:33vw!important;max-width:633px!important;vertical-align:middle!important}.pusher .stripe .column > p{font-size:16px!important;line-height:1.6!important;margin:1em 0!important}.pusher .alternate.stripe{background-color:#F2F3F5!important}.vertical.segment{box-shadow:none!important}.pusher > .footer{clear:both!important;margin:0!important;border-radius:0!important;padding:4em 0!important}.pusher > .footer .grid{display:block!important}.pusher > .footer .grid .column{margin-left:2rem!important;margin-right:2rem!important}.introduction{perspective:500px!important;text-shadow:0 0 10px rgba(0,0,0,0.2)!important;margin-left:auto!important;margin-right:auto!important;margin-bottom:6rem!important}.pusher .stripe{padding:5rem 0!important;border-radius:0!important;margin:0!important}.ui.header{font-weight:400!important}.pusher .stripe h1{font-size:40px!important}.pusher .intro.segment h1 + p{font-size:22px!important}.image{overflow:hidden!important}@media (max-width: 359px){.ui.menu .item{font-size:.9rem!important}}@media (max-width: 500px){.ui.menu .item > span.text{display:none!important}.ui.menu .item > i.icon{margin-right:0!important}.masthead.segment{min-height:100vh!important}}@media (max-width: 1024px){.introduction h1.header{font-size:3rem!important}.introduction h2{font-size:1.4rem!important}.masthead.segment{padding:6rem 0 0!important}.pusher .stripe{padding:2rem 0!important}.introduction{margin-bottom:2rem!important}}@media (max-width: 800px),(max-height: 720px){#image_container img.tablet{display:none!important}#image_container img.phone{max-width:calc(50vw + 100px)!important;max-height:100vh!important;margin-bottom:calc(-33vh)!important}.ui.huge.button,.ui.huge.buttons .button,.ui.huge.buttons .or{font-size:1rem!important}}@media (min-width: 800px) and (max-height: 800px){#image_container img.tablet{display:none!important}#image_container img.phone{max-width:calc(50vw + 100px)!important;max-height:100vh!important;margin-bottom:calc(-33vh)!important}.ui.huge.button,.ui.huge.buttons .button,.ui.huge.buttons .or{font-size:1rem!important}.introduction,.introduction + .row{display:inline-block!important;margin-left:4rem!important;margin-right:4rem!important}}@media (max-height: 500px){.masthead.segment{max-height:initial!important}#image_container img.tablet{display:none!important}#image_container img.phone{max-width:calc(50vw + 100px)!important;max-height:100vh!important;margin-bottom:calc(-22vh)!important}.ui.huge.button,.ui.huge.buttons .button,.ui.huge.buttons .or{font-size:1rem!important}.introduction,.introduction + .row{display:inline-block!important;margin-left:4rem!important;margin-right:4rem!important}}
\ No newline at end of file
+img[data-src]{filter:blur(2px)!important}.following.bar{position:fixed!important;top:0!important;z-index:900!important;left:0!important;padding:2em 0!important;width:100%!important;box-shadow:0 0 0 0 transparent!important;border-bottom:1px solid transparent!important;transition:padding .5s ease,background .5s ease,box-shadow .5s ease,border .5s ease!important}body:not(.index) .following.bar{position:sticky!important}.ui.logo{opacity:.9!important;float:none!important;margin:0 .35714286em 0 0 !important;height:1em!important}.secondary.menu .item{line-height:1.6rem!important}.secondary.menu .item > i.icon{height:1.6rem!important}.following.bar{padding:1em 0!important}body.noscript .following.bar,.following.bar.qd{background:#0a70c0!important}.masthead{position:relative!important;overflow:hidden!important;text-align:center!important;color:rgba(255,255,255,0.9)!important;margin-bottom:0!important;border-bottom:none!important;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 1440 810'%3E%3Cpath fill='%23124e99' fill-opacity='.25' d='M334.24 0L539.8 205.54 745.32 0h-411.1z'/%3E%3Cpath fill='%23124e99' fill-opacity='.3' d='M1366.24 0l-516 516 44.04 44.04L1440 14.32V0h-73.76z'/%3E%3Cpath fill='%230291e7' fill-opacity='.64' d='M745.33 0L539.8 205.54 850.23 516l516-516h-620.9z'/%3E%3Cpath fill='%230291e7' fill-opacity='.57' d='M1440 14.32L894.28 560.04l128.08 128.08 150.1-150.1L1440 270.5V14.32z'/%3E%3Cpath fill='%230291e7' fill-opacity='.28' d='M1440 270.48l-267.55 267.55L1440 805.58v-535.1z'/%3E%3Cpath fill='%23124e99' fill-opacity='.71' d='M1022.36 688.12L1144.24 810H1440v-4.42l-267.55-267.55-150.1 150.1z'/%3E%3Cpath fill='%230291e7' fill-opacity='.46' d='M0 0v455.43L354.57 810h789.67l-810-810H0z'/%3E%3Cpath fill='%23124e99' fill-opacity='.68' d='M0 455.43v80.96L273.6 810h80.97L0 455.43z'/%3E%3Cpath fill='%230291e7' fill-opacity='.4' d='M0 536.4V810h273.6L0 536.4z'/%3E%3C/svg%3E") center center no-repeat,linear-gradient(148deg,#124E99 7%,#105a94 20%,#0a70c0 27%,#0291E7 60%,#0271B3 100%)!important;background-size:cover,cover!important;padding:10rem 0!important;max-height:100vh!important}.masthead:after{content:""!important;height:calc(50px + 7vh + 7vw)!important;position:absolute!important;bottom:0!important;left:0!important;right:0!important;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 1440 810'%3E%3Cpath d='M 0%2C810 1440%2C0 l 0%2C810 z' fill='%23fff'/%3E%3C/svg%3E") no-repeat center center!important;background-size:100% 100%!important}.introduction h1.header{font-size:4.5rem!important}.pusher .stripe h2{font-size:26px!important}.ui.grid .row + .ui.divider{margin-top:3rem!important;margin-bottom:3rem!important}#image_container img.phone{display:inline-block!important;max-height:33vw!important;max-width:355px!important;vertical-align:middle!important}#image_container img.tablet{display:inline-block!important;max-height:33vw!important;max-width:633px!important;vertical-align:middle!important}.pusher .stripe .column > p{font-size:16px!important;line-height:1.6!important;margin:1em 0!important}.pusher .alternate.stripe{background-color:#F2F3F5!important}.vertical.segment{box-shadow:none!important}.pusher > .footer{clear:both!important;margin:0!important;border-radius:0!important;padding:4em 0!important}.pusher > .footer .grid{display:block!important}.pusher > .footer .grid .column{margin-left:2rem!important;margin-right:2rem!important}.introduction{perspective:500px!important;text-shadow:0 0 10px rgba(0,0,0,0.2)!important;margin-left:auto!important;margin-right:auto!important;margin-bottom:6rem!important}.pusher .stripe{padding:5rem 0!important;border-radius:0!important;margin:0!important}.ui.header{font-weight:400!important}.pusher .stripe h1{font-size:40px!important}.pusher .intro.segment h1 + p{font-size:22px!important}.image{overflow:hidden!important}.pusher{display:flex;flex-direction:column;min-height:100vh}.pusher>.full.height{flex-grow:1}@media (max-width: 359px){.ui.menu .item{font-size:.9rem!important}}@media (max-width: 500px){.ui.menu .item > span.text{display:none!important}.ui.menu .item > i.icon{margin-right:0!important}.masthead.segment{min-height:100vh!important}}@media (max-width: 1024px){.introduction h1.header{font-size:3rem!important}.introduction h2{font-size:1.4rem!important}.masthead.segment{padding:6rem 0 0!important}.pusher .stripe{padding:2rem 0!important}.introduction{margin-bottom:2rem!important}}@media (max-width: 800px),(max-height: 720px){#image_container img.tablet{display:none!important}#image_container img.phone{max-width:calc(50vw + 100px)!important;max-height:100vh!important;margin-bottom:calc(-33vh)!important}.ui.huge.button,.ui.huge.buttons .button,.ui.huge.buttons .or{font-size:1rem!important}}@media (min-width: 800px) and (max-height: 800px){#image_container img.tablet{display:none!important}#image_container img.phone{max-width:calc(50vw + 100px)!important;max-height:100vh!important;margin-bottom:calc(-33vh)!important}.ui.huge.button,.ui.huge.buttons .button,.ui.huge.buttons .or{font-size:1rem!important}.introduction,.introduction + .row{display:inline-block!important;margin-left:4rem!important;margin-right:4rem!important}}@media (max-height: 500px){.masthead.segment{max-height:initial!important}#image_container img.tablet{display:none!important}#image_container img.phone{max-width:calc(50vw + 100px)!important;max-height:100vh!important;margin-bottom:calc(-22vh)!important}.ui.huge.button,.ui.huge.buttons .button,.ui.huge.buttons .or{font-size:1rem!important}.introduction,.introduction + .row{display:inline-block!important;margin-left:4rem!important;margin-right:4rem!important}}
\ No newline at end of file
--- a/assets/js/script.js
+++ b/assets/js/script.js
@@ -3,8 +3,10 @@ const update_top_bar = function () {
  following_bar.classList.toggle("qd", window.scrollY !== 0);
 };

-document.addEventListener("scroll", update_top_bar);
-update_top_bar();
+if (document.body.classList.contains("index")) {
+  document.addEventListener("scroll", update_top_bar);
+  update_top_bar();
+}

 function preloadImage(element) {
  element.src = element.dataset["src"];

--- a/index.html
+++ b/index.html
--- a/index.pug
+++ b/index.pug
@@ -9,8 +9,8 @@ html(lang="en")
    meta(name="description" content=pageDescription)

    link(rel="canonical" href=pageUrl)
-    link(rel="shortcut icon" href="favicon.png")
-    link(rel="shortcut icon" href="favicon.svg")
+    link(rel="shortcut icon" href="/favicon.png")
+    link(rel="shortcut icon" href="/favicon.svg")

    meta(property="og:site_name" content="QuasselDroid")
    meta(property="og:type" content="website")
@@ -57,7 +57,7 @@ html(lang="en")
      include /assets/css/important.min.css
    style
      include /assets/css/style.min.css
-  body#page-index.noscript
+  body#page-index.noscript.index
    noscript
      style.
        img[data-src] {
@@ -70,7 +70,7 @@ html(lang="en")
        .following.bar
          .ui.container
            .ui.large.secondary.menu.inverted
-              a.view-ui.item.active
+              a.view-ui.item.active(href="/")
                img.ui.logo.left(src="/assets/images/icon.svg")
                | QuasselDroid
              a.view-ui.item(href="/docs/")
@@ -92,7 +92,7 @@ html(lang="en")
              h2.ui.inverted.
                Chat comfortably, everywhere.
              .ui.hidden.divider
-              a.ui.huge.inverted.download.button(href="releases/")
+              a.ui.huge.inverted.download.button(href="/releases/")
                i.icon.download.left
                span.text.
                  Download
@@ -217,8 +217,8 @@ html(lang="en")
                  Submit an Issue
                a.item(href="irc://chat.freenode.org/#quasseldroid").
                  Join our Chat
-                a.item(href="/beta/").
-                  Beta Releases
+                a.item(href="/docs/").
+                  Documentation
            .three.wide.column
              h4.ui.inverted.header.
                Discover More

--- a/releases/index.html
+++ b/releases/index.html
--- a/releases/index.pug
+++ b/releases/index.pug
@@ -9,8 +9,8 @@ html(lang="en")
    meta(name="description" content=pageDescription)

    link(rel="canonical" href=pageUrl)
-    link(rel="shortcut icon" href="favicon.png")
-    link(rel="shortcut icon" href="favicon.svg")
+    link(rel="shortcut icon" href="/favicon.png")
+    link(rel="shortcut icon" href="/favicon.svg")

    meta(property="og:site_name" content="QuasselDroid")
    meta(property="og:type" content="website")
@@ -67,10 +67,10 @@ html(lang="en")
      document.body.classList.remove("noscript");
    .pusher
      .full.height
-        .following.bar
+        .following.bar.qd
          .ui.container
            .ui.large.secondary.menu.inverted
-              a.view-ui.item.active
+              a.view-ui.item(href="/")
                img.ui.logo.left(src="/assets/images/icon.svg")
                | QuasselDroid
              a.view-ui.item(href="/docs/")
@@ -80,7 +80,7 @@ html(lang="en")
                  i.icon.github.left
                  span.text.
                    GitHub
-                a.view-ui.item(href="/releases/")
+                a.view-ui.item.active(href="/releases/")
                  i.icon.download.left
                  span.text.
                    Download
@@ -100,7 +100,7 @@ html(lang="en")
                      img(src="/assets/images/badge_play.svg")
                  .card
                    a(href="https://f-droid.org/packages/com.iskrembilen.quasseldroid/")
-                      img(src="/assets/images/badge_froid.svg")
+                      img(src="/assets/images/badge_fdroid.svg")
      .ui.black.inverted.vertical.footer.segment
        .ui.center.aligned.container
          .ui.stackable.inverted.grid
@@ -114,8 +114,8 @@ html(lang="en")
                  Submit an Issue
                a.item(href="irc://chat.freenode.org/#quasseldroid").
                  Join our Chat
-                a.item(href="/beta/").
-                  Beta Releases
+                a.item(href="/docs/").
+                  Documentation
            .three.wide.column
              h4.ui.inverted.header.
                Discover More