Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • heritage123 Friend
    #199561

    When the Décor template is viewed in its widest dimension there is a gutter (or margin) on the right and left sides of the main body content. In this mode the slideshow thumbnails are placed in the middle of the slideshow (areas highlighted in green decor2.jpg).

    If the web browser width is decreased the gutter (or margin) is no longer visible and the slideshow width becomes equal to the width of the content body. Also in this configuration the slideshow thumbnails are correctly placed at the bottom of the slideshow and they are displayed above a transparent banner extending to the width of the slideshow. (areas highlighted in green decor1.jpg)

    How do I configure the template so there is no wide gutter making this the maximum width of the template.


    1. decor1
    2. decor2
    TomC Moderator
    #541789

    So that we can try to best assist you, please provide the url of the site you’re working on.

    heritage123 Friend
    #541790
    TomC Moderator
    #541791

    Try This . . . . .

    If you haven’t yet done so, create a new file called “custom.css” within file path –> /templates/ja_decor/css

    Within that custom.css file, paste the following CSS rule:


    .main-container {
    margin: 0;
    }

    SAVE CHANGES – CLEAR CACHE – REFRESH PAGE

    Better ?? 😎

    heritage123 Friend
    #541792

    Thanks that seemed to remove the gutter (which I want) but this reveals anther underlying problem. The proportional size of the slideshow changes with browser window width. For example when the browser is maximized, the height of the slideshow is different (narrow) than when the browser gets smaller. I know the responsive template is supposed to accommodate different viewing conditions but when I set the height and width of the slideshow in the module’s “Basic Options” I expect the slideshow to maintain this perspective but it doesn’t seem to do so.

    How do I maintain a consistent aspect ratio for the slideshow?

    Ninja Lead Moderator
    #542273

    Please try to use my workaround below

    Open templates/ja_decor/css/custom.css file

    Change

    .view-featured .ja-ss-thumbs-wrap {
    bottom: 0;
    background: url("/decor/templates/ja_decor/images/white-trans.png");
    }
    }

    To

    .view-featured .ja-ss-thumbs-wrap {
    bottom: 0;
    background: url("/decor/templates/ja_decor/images/white-trans.png");
    display: none;
    }
    }

Viewing 6 posts - 1 through 6 (of 6 total)

This topic contains 6 replies, has 3 voices, and was last updated by  Ninja Lead 10 years, 3 months ago.

We moved to new unified forum. Please post all new support queries in our New Forum