Home Forums Pro Themes Magazine Plus Pro Mobile output with theme version 3.0 looks strange, i.e. menu, sub-menus, items

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #187540
    Klas Kallin
    Participant

    Hi again Psink,
    Luckily, a bit late I realized that I in fact had upgraded to version 3 already in July of last year so the promlem with missing itenListElement is thereby eliminated. Sorry to have bothered you…
    However, I have encountered another problem but now with theme version 3 as per the subject above.

    1) I am working with two sites:
    the main site: ekensberg4.se (based upon theme version 2.4) AND
    the test site: wpekensist.vardagshjalp.se (based upon theme version 3.0)

    If you please, ON A SMARTPHONE, take a look at these two sites you will yourself see what I mean by saying that with theme version 3 on the test site, the mobile output looks strange as far as the main menu, the submenus and the menu items are concerned (not nice). Plus that the menu icon is centered instead of aligned to the left.

    On the other hand, with theme version 2.4 on the main site, the mobile output looks PERFECT.

    I should mention that basically I have used the same extra CSS provided by you for theme version 2.4 when
    setting up theme version 3.0.

    2) Finally, again as regards theme version 3.0 it seems impossible to get a tranlation of the “Home”-string even using Loco Translation (this was very easy and straighforward in theme version 2.4).

    PLEASE HELP!!!
    Thank you in advance.
    Kind regards
    Klas

    #187544
    Psink
    Keymaster

    Please Add This CSS,

    html[lang=”auto”] .trail-item a[rel=”home”] span,
    html[lang=”sv-SE”] .trail-item a[rel=”home”] span{
    display:none;
    }

    html[lang=”auto”] .trail-item a[rel=”home”]:after,
    html[lang=”sv-SE”] .trail-item a[rel=”home”]:after{
    content: “Hem”;
    }

    @media only screen and (max-width: 900px){
    .main-navigation .menu-toggle {
    margin: 10px 10px 5px;
    border: solid #fff;
    }

    .menu-rum {
    margin-left: 0px !important;
    }

    #main-nav ul ul{
    background-color: #0c0e1082 !important;
    }

    #primary-menu .sub-menu li > a {
    font-size: 11px;
    color: #ffffff !important;
    background-color: #ffffff00 !important;
    }

    #primary-menu .sub-menu li.current-menu-item > a{
    background-color: #1e73be !important;
    }

    }

    Let us know if its works

    #187546
    Klas Kallin
    Participant

    Hi,
    As I have said before, you are the best!!!!!!!!!!

    “Home” i now “Hem” = perfect.

    Also, the mobile output for the test site with theme version 3.0 now looks MUCH MUCH better though I have a few things on my wish-list:

    1) I would like to have the SEARCH FUNCTION/FIELD removed from the MOBILE output

    2) Could you please state the CSS string for the ORANGE BACKGROUND COLOR of the MENU ICON BACKGROUND in the MOBILE OUTPUT. I dont like that color and would like to experiment a bit with different colors?

    Thanks in advance and
    KInd regards
    Klas

    #187562
    Psink
    Keymaster

    @KKNP, Add this CSS, and for the background color you can change the color code in the ‘background-color’

    @media only screen and (max-width: 900px){
    #main-nav .main-navigation-search{
    display: none;
    }

    .menu-toggle:hover, .menu-toggle:focus{
    background-color: #1e73be;
    }
    }

    #187563
    Klas Kallin
    Participant

    Hi,

    Perfect, thank you ever so much!
    Happy Holidays.
    Kind regards
    Klas

    #195931
    Klas Kallin
    Participant

    Hi,

    – Over 2 years ago I put this problem to you:

    “As regards theme version 3.0 it seems impossible to get a tranlation of the “Home”-string even using Loco Translation (this was very easy and straighforward in theme version 2.4).”

    – and this was your answer which worked PERFECTLY:

    “html[lang=”auto”] .trail-item a[rel=”home”] span,
    html[lang=”sv-SE”] .trail-item a[rel=”home”] span{
    display:none;
    }

    html[lang=”auto”] .trail-item a[rel=”home”]:after,
    html[lang=”sv-SE”] .trail-item a[rel=”home”]:after{
    content: “Hem”;
    }”

    – Now I am on the latest WordPress version and theme version 3.0.2 AND I FACE THE SAME PROBLEM AGAIN (your earlier given code does not work anymore)!!

    DO YOU HAVE ANY OTHER SUGGESTION for a CSS code that will fix the problem?

    Thank you very much in advance!
    Kind regards
    Klas

    #195936
    Psink
    Keymaster

    Hello @KKNP,

    I’m not sure but seems working well as you can see in the screen recorded. Its shows “Home” For language English and “Hem” For Svenska

    https://www.awesomescreenshot.com/video/27872455?key=a9eb0424804499d3033fafb6f2932e4b

    If you are looking to make “Hem” for both of languages, you can add this CSS. And remove the previous code

    .trail-item a[rel=”home”] span{
    display:none;
    }

    .trail-item a[rel=”home”]:after{
    content: “Hem”;
    }

    #195940
    Klas Kallin
    Participant

    Hi again,

    As I have said before, you are the BEST!
    Thank you.
    Kind regards
    Klas

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.