[Support request] border-radius footer (right-side of screen issue)

Home Forums Support [Support request] border-radius footer (right-side of screen issue)

Home Forums Support border-radius footer (right-side of screen issue)

Viewing 15 posts - 1 through 15 (of 35 total)
  • Author
    Posts
  • #814913
    keiron

    Hey Guys,

    I am currently considering editing the style of my primary nav and footer and am looking to use the border radius css to change the shape of these sections. As you can see the border radius for the primary navigation works fine and fits on the screen but it seems as though the footer stretches out longer on the right side of the screen meaning the radius does no appear symmetrical.

    #815025
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    Try adding this CSS:

    .site-info {
        box-sizing: border-box;
    }

    Let me know 🙂

    #815199
    keiron

    perfect, thankyouu! is it better to use this for .site_info or .site-footer?

    #815313
    David
    Staff
    Customer Support

    Hi there,

    .site-info is better for your needs as .site-footer would also include any footer widgets, which you don’t have.

    #815331
    keiron

    brilliant. In reference to the copyright. What would i do if i wanted the bar at the bottom (currently containing copyright) to contain icons such as account login or social media icons and wanted the the copyright to be at the bottom of the scroll down page?

    #815337
    keiron

    im thinking specifically in reference to mobile and tablet users

    #815393
    David
    Staff
    Customer Support

    You can add content to the site-info by using Widgets in the Footer Bar widget area. Will require a little CSS to position once they are in place.

    So the these icons will remain fixed? But the site-info is only to be displayed on scrolling to bottom?

    #815446
    keiron

    exactly. these icons fixed, site info at the bottom.

    #815447
    keiron

    No problem, I have worked it out, I have created a secondary menu and used the same css as that was used for .site-info to plant it at the bottom. All good, thanks for the help!

    #815448
    keiron

    One thing i need to prevent it from doing though is becoming full toggle menu. is it possible to have the social media icons either side of the menu toggle in the centre? Also when you press the toggle, the x is in the centre and the links seem to float to the right. I think this may be in part due to the border radius i have set for the secondary navigation – with the slideout menu in the primary nav i can seperately adjust the slideout section with “#generate-slideout-menu {}” however i cannot find an id or class for the same slideout section in the second navigation bar when i inspect. I am wondering if this is the cleanest way to create this menu by fixing it to the bottom:0 with css or it is better done on the backend? I dont want unnecessary code slowing down such a fast theme.

    Sorry for the essay, just want to make sure i am constructing this in the best way possible.

    Keiron.

    #815727
    David
    Staff
    Customer Support

    So what design would you ideally want?
    E.g
    A Horizontal Menu on desktop and mobile ( no toggle ) and a social icon either side of that?

    #815743
    keiron

    if you look at my site using a mobile or with a small screen currently, you will see the bottom menu. What I am looking to do is potentially (it seems like it might be difficult) have several icons across the menu at the bottom. I will then use sub-menu items to add slide up options for each icon like the transition option provided by the menu toggle. As you will be able to see i currently have some sub-menu items in the menu when you use the toggle. I want the icons to work how the toggle currently does.

    so to break down tasks.

    1. remove toggle in bottom menu
    2. add icons (font awesome will work)
    3. add sub menu items
    4. css code to have these icons slide up like the menu toggle currently does to reveal sub menu items centrally in the space.

    #815908
    David
    Staff
    Customer Support

    i have been thinking on this one, its quite complicated and i don’t think its do-able without custom Javascript and CSS to create custom ‘toggle’ icons and dropdowns.

    #815914
    keiron

    So even using font awesome icons for the menu items then sub menu items attached to these. There is no way to prevent the mobile toggle activating at smaller screen sizes then customizing the sub menu items to slide up like this from the menu icons? :/

    #815959
    David
    Staff
    Customer Support

    If you want to set-up the menu using the icons with the submenus then i can have a play. Sometimes the solution is easier when i can see the full markup.
    This article covers using Icons in the menu, you may find it useful:

    https://docs.generatepress.com/article/adding-icons-to-menu-items/

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