/ Register

  1. REGISTRATION REQUIREMENTS:

    Your username here MUST MATCH your XenForo username (connected to your XF license).

    Once you have registered here, then you need to start a conversation at xenforo.com w/Bob and provide the following:
    1. Your XenForo License Validation Token
    2. The Domain Name associated with the License
    NOTE: Your account will be validated once ALL requirements are verified/met. Thank you for your patience.

Implemented Node List Items module on responsive.

Discussion in 'Showcase Closed Suggestions' started by Shelley, Jun 21, 2013.

  1. Jun 21, 2013 #1
    Shelley

    Shelley Member Showcase

    Hi Bob, :)

    I thought I'd suggest this and not sure it's even possible to do but suggesting when the style hits responsive mode have the nodelist items hidden? Hopefully I explained that correctly.

    As you can see it entails much scrolling. Again, sorry if this is technically not possible but thought I'd make you aware of it (which i'm sure you are already). :)

    showcase_forumlist_tems.png
     
    Bob likes this.
  2. Jun 21, 2013 #2
    Bob

    Bob Developer Staff Member

    Makes perfect sense to hide it once it hits a certain point (or collapse it). I have some LEARNING to do :D Really hoping for a HYS vid by the man Kier on using media queries for responsive custom layouts.
     
    Shelley likes this.
  3. Jun 25, 2013 #3
    Shelley

    Shelley Member Showcase

    I added the following in extra.css template for anyone bumping into this thread that wants a temp solution as I know yours will be better bob.

    Code:
    <xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveNarrowWidth)
  { 
   .forum_list .showcaseMain { display: none !important;   }
   
}
</xen:if>
     
    Bob likes this.
  4. Jun 25, 2013 #4
    Bob

    Bob Developer Staff Member

    Thats exactly what I have in place right now lol :D
     
    Veer and Shelley like this.
  5. Jun 29, 2013 #5
    Bob

    Bob Developer Staff Member

    Marked as partially implemented as I've added responsive support to it, but I am still tweaking things to give admins more than 1 option for it.
     
    Shelley likes this.
  6. Jul 9, 2013 #6
    Bob

    Bob Developer Staff Member

    I've modified the CSS for this Block, so a lot of the Class names have changed.

    For Responsive, I hide the Message (if enabled) at the Wide Width break point. At the Medium Width break point, I hide the Title (if enabled) and Rating (if enabled). At the Narrow, I hide the entire block. For those that still want the block on Narrow, its a simple template edit to remove display:none; on the narrow width break point media query.

    HTML:
    <xen:if is="@enableResponsive">
    @media (max-width:@maxResponsiveWideWidth)
    {
        .showcaseItemInfo .showcaseItemMessage       
        {
            display: none;
        }
    }
   
    @media (max-width:@maxResponsiveMediumWidth)
    {
        .showcaseItemInfo .showcaseItemTitle,
        .showcaseItemInfo .showcaseItemRating       
        {
            display: none;
        }
    }   
 
    @media (max-width:@maxResponsiveNarrowWidth)
    {
        .showcaseNodeListItemsBlock       
        {
            display: none;
        }
    }
</xen:if>
     
    Shelley likes this.
  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Accept Learn More...