0
Welcome Guest! Login
0 items Join Now

Responsive Classes - (Desktop, Large, Tablet, Phone)

    • Michael's Avatar
    • Michael
    • Hero Rocketeer
    • Posts: 448
    • Thanks: 2

    Responsive Classes - (Desktop, Large, Tablet, Phone)

    Posted 9 years 6 months ago
    • Hello,

      I have been using the Responsive Classes for a while now to set modules to display on certain devices and hide on others, going by this document.

      www.rockettheme.com/docs/joomla/basic/re...e_support_classes.md

      However, if I want something to only display on the DESKTOP size, but not LARGE, there doesn't seem to be a combination that will do this.

      I want to set a LARGE module and a DESKTOP module, but DESKTOP shows on DESKTOP and LARGE sized devices and screens.

      Am I missing something or is it not possible?
    • Matt's Avatar
    • Matt
    • Preeminent Rocketeer
    • Posts: 22270
    • Thanks: 3224
    • messin' with stuff

    Re: Responsive Classes - (Desktop, Large, Tablet, Phone)

    Posted 9 years 6 months ago
    • LARGE module = visible-large

      DESKTOP module = hidden-large

      :)
    • Last Edit: 9 years 6 months 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:
    • Michael's Avatar
    • Michael
    • Hero Rocketeer
    • Posts: 448
    • Thanks: 2

    Re: Responsive Classes - (Desktop, Large, Tablet, Phone)

    Posted 9 years 6 months ago
    • I see.

      However it behaves otherwise.

      LARGE will only display on large window size and then dissapear when the window sizes down. But DESKTOP shows on both window sizes.

      You can see here, www.slopeedge.ca/portal-alpha

      I should add, I also have additional modules set for TABLET and PHONE. So I need the module to display for that one size only.
    • Matt's Avatar
    • Matt
    • Preeminent Rocketeer
    • Posts: 22270
    • Thanks: 3224
    • messin' with stuff

    Re: Responsive Classes - (Desktop, Large, Tablet, Phone)

    Posted 9 years 6 months ago
    • Looks to me like you've defined the Desktop and Large Desktop range the same in your G5 Breakpoints... both seem to be acting at the 75rem range...

      docs.gantry.org/gantry5/configure/styles#configuration-styles

      Beyond that though, I must confess I don't understand why you're doing this... embedded YouTube players are responsive... they'll scale down as needed...
    • 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:
    • Michael's Avatar
    • Michael
    • Hero Rocketeer
    • Posts: 448
    • Thanks: 2

    Re: Responsive Classes - (Desktop, Large, Tablet, Phone)

    Posted 9 years 6 months ago
    • The plan is to have slightly different video display to the different device being used to visit the site. (right now it's just the same placeholder video).

      My desktop is set to 60rem and large 75rem (I never changed them, they are at the defaults).

      The point i am making is that when looking at the chart below, DESKTOP is visible on both DESKTOP and LARGE. There isn't a class that just applies on DESKTOP only and not also LARGE. The templates behave exactly as this chart outlines.

      Therefore a proper DESKTOP only setting was either never done, or the documentation was never updated with the new class name.


      This image is hidden for guests.
      Please log in or register to see it.
    • Matt's Avatar
    • Matt
    • Preeminent Rocketeer
    • Posts: 22270
    • Thanks: 3224
    • messin' with stuff

    Re: Responsive Classes - (Desktop, Large, Tablet, Phone)

    Posted 9 years 6 months ago
    • The chart is correct... it's assumed that if you want something displayed on a desktop you want it on a large desktop as well... we'd have 1000 more complaints if something set to "visible-desktop" wasn't displayed on large desktops... that's why the hidden-large class exists.

      I'll do some more testing today... your normal desktop and large desktop are both kicking in at 75rem and normal desktop should be restricted to 60rem if that's how you've set it... make sure that's set in your Base Outline as well and you haven't overridden it with a different outline
    • Last Edit: 9 years 6 months 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:
    • Matt's Avatar
    • Matt
    • Preeminent Rocketeer
    • Posts: 22270
    • Thanks: 3224
    • messin' with stuff

    Re: Responsive Classes - (Desktop, Large, Tablet, Phone)

    Posted 9 years 6 months ago
    • I'll check into the standard Gantry breakpoints but you may be able to solve it with our custom breakpoint tutorial as well


      docs.gantry.org/gantry5/tutorials/media-...defining-breakpoints
    • 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:

Time to create page: 0.078 seconds