0
Welcome Guest! Login
0 items Join Now

fixed navigation rt-clarity 1.5.0

    • Felix 's Avatar
    • Felix
    • Rocketeer
    • Posts: 88
    • Thanks: 0

    fixed navigation rt-clarity 1.5.0

    Posted 9 months 2 weeks ago
    • Hello all,

      I can't get the fixed navigation to work... I want to set this on this website (URL in Secure - test site) , only on the start page.
      Base Outline - Page Settings - Fixed Header set, but it just doesn't work.
      Also I want the colour of the background to change when I get to the next section....
      I've been working on this since yesterday and haven't found a solution.

      Help???
      Thanks a lot
      Traudel
    • Matt's Avatar
    • Matt
    • Preeminent Rocketeer
    • Posts: 21804
    • Thanks: 3132
    • messin' with stuff

    Re: fixed navigation rt-clarity 1.5.0

    Posted 9 months 2 weeks ago
    • Post your Atom settings... make sure they're targetting #g-navigation
    • SEARCH the forum first! These boards are rich in knowledge and vast in topics. This includes searching just the 'Solved' forums, using Google, and using ChatGPT :woohoo:
    • Felix 's Avatar
    • Felix
    • Rocketeer
    • Posts: 88
    • Thanks: 0

    Re: fixed navigation rt-clarity 1.5.0

    Posted 9 months 1 week ago
    • Hi Matt,

      fixed-header simply does not work.
      (see screenshots).
      What works is if I set in the scss:
      #g-navigation.menu-absolute { background: rgba(255, 255, 255, 0.9); position: fixed; }
      But then I would need a fix point where I can change the background-color to #g-navigation.
      At the moment I'm not getting anywhere...

      Regards,
      Traudel
    • Matt's Avatar
    • Matt
    • Preeminent Rocketeer
    • Posts: 21804
    • Thanks: 3132
    • messin' with stuff

    Re: fixed navigation rt-clarity 1.5.0

    Posted 9 months 1 week ago
    • I don't see the Javascript for the Fixed Header atom loading at all... Your homepage is loading Outline ID #14 -- is the Atom configured on that particular outline?
    • SEARCH the forum first! These boards are rich in knowledge and vast in topics. This includes searching just the 'Solved' forums, using Google, and using ChatGPT :woohoo:
    • Felix 's Avatar
    • Felix
    • Rocketeer
    • Posts: 88
    • Thanks: 0

    Re: fixed navigation rt-clarity 1.5.0

    Posted 4 months 3 weeks ago
    • Hello,
      I have to ask again.
      Fixed Header works perfectly. (rt-clarity)
      But I have no idea how to set it so that when the #g-navigation section scrolls down, it gets smaller.
      So not the full size of the navigation section.
      via scss?

      Many thanks


      Regards

      Traudel
    • Last Edit: 4 months 3 weeks ago by Felix .
    • Matt's Avatar
    • Matt
    • Preeminent Rocketeer
    • Posts: 21804
    • Thanks: 3132
    • messin' with stuff

    Re: fixed navigation rt-clarity 1.5.0

    Posted 4 months 3 weeks ago
    • It is working though, it's scrolling as expected? There is an autohide feature that will hide it when scrolling down, show it when scrolling up. There is no option in the Atom to change the height of the targetted section while it's scrolling, that would require custom dev.
    • SEARCH the forum first! These boards are rich in knowledge and vast in topics. This includes searching just the 'Solved' forums, using Google, and using ChatGPT :woohoo:
    • Felix 's Avatar
    • Felix
    • Rocketeer
    • Posts: 88
    • Thanks: 0

    Re: fixed navigation rt-clarity 1.5.0

    Posted 4 months 3 weeks ago
    • Hi Matt,

      yes, this is the autohide. I have set that to Disabled.

      The customer wants the fixed header to shrink downwards, i.e. reduce in size.
      Is there possibly a scss code for this?

      I have set the link to Secure from my test page...

      Regards

      Traudel
    • Felix 's Avatar
    • Felix
    • Rocketeer
    • Posts: 88
    • Thanks: 0

    Re: fixed navigation rt-clarity 1.5.0

    Posted 4 months 3 weeks ago
    • ... one more info

      it might have to be set with this code (???):

      #g-navigation.headroom--not-top {
      position: fixed;
      width: 100%;

      top: 0;
      z-index: 1001;
      left: 0;
      }

      But I can't get the height right, it changes when I change the width.

      Regards

      Traudel
    • Matt's Avatar
    • Matt
    • Preeminent Rocketeer
    • Posts: 21804
    • Thanks: 3132
    • messin' with stuff

    Re: fixed navigation rt-clarity 1.5.0

    Posted 4 months 3 weeks ago
    • Unfortunately there is no setting in the Atom design that will do what you're after and custom development is beyond the scope of moderator support on these boards.

      Headroom.js is documented here. There are various classes it sets for different events that you can target and style as you see fit: wicky.nillia.ms/headroom.js/
    • Last Edit: 4 months 3 weeks ago by Matt.
    • SEARCH the forum first! These boards are rich in knowledge and vast in topics. This includes searching just the 'Solved' forums, using Google, and using ChatGPT :woohoo:
    • Felix 's Avatar
    • Felix
    • Rocketeer
    • Posts: 88
    • Thanks: 0

    Re: fixed navigation rt-clarity 1.5.0

    Posted 4 months 3 weeks ago
    • Thank you...

      I have tested various settings, unfortunately without success.

      Is there really no setting possible? The fixed header is included in the rt-clarity template.

      class="menu-absolute headroom-bg-section headroom--not-bottom headroom--pinned-up headroom--top"

      Then it should also be possible to make adjustments using scss.
      For example, I can change the width perfectly with this scss entry, e.g. with 80%:

      #g-navigation.headroom--not-top {
      position: fixed;
      width: 100%;

      top: 0;
      z-index: 1001;
      left: 0;
      }


      But I have no idea about the height? (transition??)

      Regards

      Traudel

Time to create page: 0.055 seconds