Problem with List Tool

Hello all,

I am facing a problem with the List tool in Inline mode. I have created two columns each having an Inline List tool. The problem is that for some reason the second list on right side does not show the Google and Instagram icons. First list in the first column is working fine with Label and Icon though.

Has someone else also faced the same problem and has been able to solve it ??

Thanks,
Ujjwal

If you’d like assistance you’ll need to provide a copy of your project file. We unfortunately cannot troubleshoot your work from a screenshot alone.

Provide us a copy of your project file please.

Create a ZIP file containing your project file. This is the file you open in RapidWeaver to edit your site. After creating the ZIP file, upload it using a service like Dropbox, WeTransfer, Droplr, or a similar service to create download link for us. Paste that download link in your reply.

Hello Adam,

Here is the link to file download from One Drive

Since you have the project file now, you will also see that the in Slider tool the slides are shown at full size instead of thumbnails like in F2. Is this the default setting in F3 or can we reduce the display to small thumbnails just like F2 ('cuz it seems to be creating some crowd on the face of the project in Edit mode unless hidden)

Also I have noticed one thing that sometimes when we select a child stack in edit mode (deep in hierarchy eg: background->Spacing->Max-Width->Columns->Column1), the screen scrolls to the top of the page in Edit mode. This only happens sometimes. It is intermittent and not regular.

Thanks,
Ujjwal

Looks like you capitalized the G in google for the icon name (CleanShot 2023-02-05 at 10.27.12@2x.png - Droplr). The names need to be exactly as shown in the icon list for whatever library you’re using. Those icon names from Font Awesome and Bootstrap Icons are all simply class names believe it or not. So they need to match exactly. That means in this instance making that uppercase G you have there in google into a lowercase g.

As for the Edit Mode display of Slider – many users reported that it was hard to tell where to drag items in Edit Mode when they were displayed in a columnized format like that which you had in Foundry 2. This is part of the reason they’re not displayed that way in Foundry 3. If there’s an alternative that people would like to see I can look into it, but that is the reason it works as it does currently.

I’ve not seen this, but if you come up with a way to replicate it every time I’d be glad to look at it. Foundry doesn’t control Edit Mode, but if there’s something in the tool(s) causing it to do this I could try and figure it out, but again I have to be able to reliably replicate it. Shoot me an email if you find a way to do so repeatedly.

2 Likes

Thank you Adam. You are awesome.

1 Like

Hello Adam,

It looks like there is a bug with rounded corners in the Card tool. When we give border to the card and the Header is set to be an Image, there seems to be a Gap between the Card rounded border and the Image rounded border.

I have tried removing the rounded corners, but there is no change.

I have attached a screenshot for your reference. I have also uploaded the upgraded file and the download link is as below…

Thanks,
Ujjwal

You should be able to turn off the rounded corners on the image inside the card and let the card create the rounded corners on the top of the image.

What you’re seeing is that the size of the image and the card are ever so slightly different that even with the same rounded corner amount applied via the same preset, the rounding is slightly different.

2 Likes

Hi,

I tried the solution that you gave, but even that did not work. I have attached a snapshot to show.

  1. Card and Image rounded corners - There is a Gap
  2. Card rounder corner only - Image corners go out of the card
  3. Card and Image straight corners - Image looks fine inside the card

This seems to be a bug that needs to be checked by @elixirgraphics (Adam). Adam request you to please throw some light on this.

Thanks,
Ujjwal

You have to be patient. I’m one person dealing with a lot of support tickets such as yours, as well as I have to sleep, eat and have family time.

You’re seeing the gap with the default image icon in the header of the Card. This default image does not pickup your settings. It expects you’re going to add an image of your own. Add your own image and you’ll see the following…

1 Like

I’ve looked into this further with @DLH. The problem is that the image and Card header area are being rounded. The browser rounds the two elements the same, but the border creates a small gap. It is just the way it is rendered. I can overcome this with an overflow: hidden applied to the card forcing the enclosed image(s) to have no border-radius applied. That said theres one area that this is not possible with: Whimsy headers in a Card.

Whimsy’s rounded corners must match that on the Card’s rounded corners, so that the Whimsy hover overlay can be displayed properly. This means that browser rendering error when using images in the Card header in conjunction with rounded corners and a card border will be visible.

I’m going to implement this fix in the next update. Just note the part about Whimsy in a Card header above as that is just how it works.

3 Likes

Thank you Adam for the reply, however I did not mean or expect you to answer immediately. I also understand that being single person how busy would you be answering all the queries while managing your routine. Why only intent was to send a message to you that if this is some bug then it should be brought to your knowledge.

Regarding the solution, honestly I did not quite understand what you mean. Do I have to write custom CSS using Blacksmith tool to hide the overflow, 'cuz I did not find any setting in the inspector to hide overflow for Card tool.

Does this mean that we should only use Image inside card with no rounded corners for both tools ?

Thanks

You don’t have to do anything. My reply above stated that…

1 Like