1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

XF 1.4 Responsive design conditional

Discussion in 'Styling and Customization Questions' started by reddy ink, Feb 4, 2015.

  1. reddy ink

    reddy ink Active Member

    I would like tagline NOT show in responsive design in RM

    Is this the conditional statement in resource_list_view

    <xen:if is="@enableResponsive">
    {$resource.tag_line}
    </xen:if>
     
  2. Brogan

    Brogan XenForo Moderator Staff Member

    Styles are either responsive or they aren't.
    It's not something which is device dependent.

    If a style is set as responsive then the responsive flag is true, otherwise not.

    You can use media queries which are based on the device width - see the link in my signature for a guide.
     
  3. reddy ink

    reddy ink Active Member

    Thank you for the reply. I was looking for a conditional statement to hide some text when seen on mobile devices. Example: tagline on resource_index.
     
  4. semprot

    semprot Active Member

  5. Arty

    Arty Well-Known Member

    Showing/hiding elements is done by using media queries. Conditional statement only checks if responsive design is enabled and hides media queries if it is disabled, it doesn't control anything other than that.

    Add this to extra.css:
    Code:
    <xen:if is="@enableResponsive">
    @media (max-width:@maxResponsiveWideWidth)
    {
      .resourceInfo .tagLine { display: none; }
    }
    </xen:if>
     
    reddy ink likes this.
  6. reddy ink

    reddy ink Active Member

    @Arty
    I added your suggested code to extra.css but tagline still shows in responsive design.
     
  7. Arty

    Arty Well-Known Member

    Probably some other rule is overriding it. Try adding !important to it
    Code:
    { display: none !important; }
     
  8. reddy ink

    reddy ink Active Member

Share This Page