Info-window border and smaller map control buttons

New home Forums Basic Version General queries Info-window border and smaller map control buttons

This topic contains 2 replies, has 2 voices, and was last updated by  paul.wozniak 3 weeks, 6 days ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #54096

    paul.wozniak
    Member

    I tried to post this under my previous topic but for some reason it’s not showing my post.

    I have purchased the Pro add-on and have started testing the map functions. I have two questions:

    How can I control the size of the action buttons on the map view? (The blue zoom in and out, full screen and info buttons)
    They appear as very large on my desktop and mobile, but I see it’s much smaller on your demo pages. (Screenshots of our desktop and mobile attached).

    Is there any way to add a border or control the edges (rounded, shaded, etc) of the default info window?
    Although we liked the background color options of the other info-windows, it seemed the other info-window styles condensed and cut off too much, so we found the default info-window style to suit us best. We would like add a border to the box at the least to give it a slightly more styled/premium look. The option to control the color and border shape/shadow would be nice.

    Is that something that can be easily done, or would that venture into the premium custom work you mentioned that would be an extra cost?

    Thanks,
    Paul

    Attachments:
    You must be logged in to view attached files.
    #54113

    Hi Paul,

    Thanks for getting in touch with us.

    These customizations should be possible and I am more than happy to help free of charge.
    Could I kindly ask if you could perhaps send me a link to your website with the map so that I can just take a look and prepare the correct and accurate code to achieve this?

    Thanks for your time and I am looking forward to assisting you further in getting this resolved ASAP.

    Best regards,
    Dylan

    #54141

    paul.wozniak
    Member

    Hello Dylan,

    That’s great to hear! We really appreciate it.

    We have a small test page here, please dont mind the clutter around it:

    https://www.pbgnetworks.com/customers

    #54150

    Hi Paul,

    Thanks for the response and information.

    I have taken a closer look and seems like your theme’s CSS is setting a min-width for all buttons and it is affecting the map buttons. To fix this, could I kindly ask you to add the following CSS to Maps > Settings > Advanced Settings > Custom CSS:

    .ol-control button {
    width: 30px !important;
    height: 30px !important;
    min-width: unset !important;
    font-size: 17px;
    }

    That will make the buttons smaller and more compact.

    To change the color, borders, padding etc, of the InfoWindows, you can also add the following CSS which is just an example and you can tweak the colors to your needs:
    .ol-info-window-container {
    background: #fcfcfc;
    padding: 20px;
    box-sizing: border-box;
    border-radius: 5px;
    border: 2px solid #6badf1;
    }

    Please let me know if this helps and if there is anything else I can assist with.

    Thanks for your time.

    Best regards,
    Dylan

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

You must be logged in to reply to this topic.