Default Canvas Image thumbnail scaling

3 years 1 month ago #323757 by Sekulla
I am using a custom image as a default canvas image, with size 700 width x 200 height, which works well on the profile header. See attached first screen capture.

However on the member list output in grid format the smaller canvas' do not scale well they just seem to centre unlike when a user uploads a custom canvas image or selects a gallery canvas image. See second screen capture.

I have used the default thumbnail canvas image which I have created at size 350 width x 100 width but it makes no difference. SO I have two default canvas' nophoto.png and tnnophoto.png.

I can't seem to find the class .cbThumbCanvas in template CSS to make an override.

Is there anyway to get the default canvas to scale appropriately? Any help much appreciated.
Attachments:

Please Log in to join the conversation.

3 years 1 month ago #323768 by krileon
Replied by krileon on topic Default Canvas Image thumbnail scaling
It has the following CSS classes on it.

cbImgCanvas
cbThumbCanvas

You can use cbThumbCanvas specifically to reposition the canvas if you like. It uses the exact same CSS rules as profiles do though. Specifically the below CSS rules.

    background-position: 50% 50%;
    background-size: cover;
    background-repeat: no-repeat;

The position can be overridden though if the user uploads an image and repositions the canvas if it doesn't fit within the dimension limits. What you're seeing is just how the background-size: cover; style works. You can find details on how it works below.

developer.mozilla.org/en-US/docs/Web/CSS/background-size


Kyle (Krileon)
Community Builder Team Member
Before posting on forums: Read FAQ thoroughly + Read our Documentation + Search the forums
CB links: Documentation - Localization - CB Quickstart - CB Paid Subscriptions - Add-Ons - Forge
--
If you are a Professional, Developer, or CB Paid Subscriptions subscriber and have a support issue please always post in your respective support forums for best results!
--
If I've missed your support post with a delay of 3 days or greater and are a Professional, Developer, or CBSubs subscriber please send me a private message with your thread and will reply when possible!
--
Please note I am available Monday - Friday from 8:00 AM CST to 4:00 PM CST. I am away on weekends (Saturday and Sunday) and if I've missed your post on or before a weekend after business hours please wait for the next following business day (Monday) and will get to your issue as soon as possible, thank you.
--
My role here is to provide guidance and assistance. I cannot provide custom code for each custom requirement. Please do not inquire me about custom development.

Please Log in to join the conversation.

3 years 1 month ago #323772 by Sekulla
Replied by Sekulla on topic Default Canvas Image thumbnail scaling
Thanks Kyle,

That worked perfectly.

George

Please Log in to join the conversation.

Moderators: beatnantkrileon
Time to create page: 0.208 seconds

Facebook Twitter LinkedIn