Okay
  Public Ticket #469322
Responsivity problems
Closed

Comments

  • Juraj started the conversation
    July 1, 2015 at 12:55am

    Hi!

    I've bought Mightymag theme and I have some question about responsivity.

    1. Bad look of page on iPad mini (1024x768) is it possible to do something with that?

    2. Annoying flying menu button at the top left corner don't work correctly. How can I make it fixed?

    3. When I set up my page to widgetized homepage 4 (3 columns, the widest one is in the middle), I set the recent posts to middle sidebar. But on mobile devices, first content is from left sidebar and the main content from middle sidebar is below it. I want my clients to have the main content as first option even on mobile devices and i like the homepage 4 the most. What should I do with that?

    Thank you!

  •  93
    djwd replied
    July 1, 2015 at 4:05pm

    Hi there,
    thank you for your purchase.

    1. You need to be more specific about this, perhaps a screenshot would help. Thank you.

    2. There\'s no option to keep the menu icon always on top. You\'d need to edit js/small-menu.js, removing this part (from line 39) should be enough: 

    /**
 * Hide menu toggle upon scrolling
 */
    (function( $ ) {
$(function() {
var $menu = $( \".menu-toggle\" );
$( window ).scroll(function() {
$menu.removeClass(\'slideInLeft\').addClass( \'slideOutLeft\' );
clearTimeout( $.data( this, \"scrollCheck\" ) );
$.data( this, \"scrollCheck\", setTimeout(function() {
$menu.removeClass(\'slideOutLeft\').addClass( \'slideInLeft\' );
}, 400) );
});
});
    })( jQuery );

    3. That template is actually a 3 columns layout where the first and last columns are thinner, they are not actually \"sidebars\", hence they are displayed in the same order they appear (considering from left to right). Making appear the second column as first on mobile devices would need some personal customizations unfortunately.

    Regards
    djwd

    Regards
    djwd

  • Juraj replied
    July 1, 2015 at 4:19pm

    Hi, thanks for your answers.

    1. I added two screenshots, the sticky menu is not okay and the page header is on whole screen - that isn\'t very beautiful also. Is it possible to set 1024x768 as a mobile device? The problem is on both - widescreen and normal view on iPad mini withou retina.

    2. I fixed it by disabling \"content animation in\" in theme options.


    Thanks.

  •  93
    djwd replied
    July 2, 2015 at 1:40pm

    Hi there,

    1. That\'s the default view, the theme grid and responsiveness is based on Bootstrap, changing breakpoints would require several custom modifications. On your screenshots I see what is meant to show, I don\'t see particular errors apart from the logo overlapping. Since you have many menu items, perhaps reducing the space between them would help.
    Pasting this in the custom CSS textarea would achieve that: 

    .main-navigation a { margin: 0 10px; }

    2. That\'s another option, glad it was sorted (:

    Regards
    djwd

    Regards
    djwd