X-Cart forums - Need to adjust position of cat icons.

X-Cart forums (https://forum.x-cart.com/index.php)

- Changing design (https://forum.x-cart.com/forumdisplay.php?f=51)

- - Need to adjust position of cat icons. (https://forum.x-cart.com/showthread.php?t=75326)

Katsu

05-09-2017 08:11 AM

Need to adjust position of cat icons.

1 Attachment(s)

The default category icons are tiny - only 16 x 16, so I set them to 32 x 32 by editing /include/func/func.image.php. The problem then, was that the icons overlapped the category names so I then edited /skin/common_files/modules/Flyout_Menus/Icons/main.css - 'padding-left: 36px;'.

All is good except the icons are a little low, relative to the text. I need to raise them up a few points.

Element Inspector shows the icon details:

.fancycat-icons-e img

top: auto;
margin-top: 0.3em;

Deselecting the check box next to either of these, or adjusting the margin-top value will adjust the vertical axis.

Question is, where to find this parameter? Which file, which line? How would I locate this via Inspector?

Thanks in advance.

pauldodman

05-09-2017 10:54 PM

Re: Need to adjust position of cat icons.

The css class:
fancycat-icons-e img

is in the file:
skin/common_files/modules/Flyout_menus/icons/main.css

qualiteam

05-10-2017 12:06 AM

Re: Need to adjust position of cat icons.

I think matching the "line-height" attribute with the actual height of menu items may help.

Katsu

05-10-2017 08:50 AM

Re: Need to adjust position of cat icons.

2 Attachment(s)

Thank you. I had found this and made adjustments but I thought I was doing something wrong. The vertical position changes as needed but the background to the category text becomes corrupted.

Large numbers of small arrows appear all around those category names that have sub-categories. This does not occur at the categories with no sub-categories.

Here, I changed 'top:' '0', to '2' which set the vertical just right.

.fancycat-icons-e img {
position: absolute;
top: 2;
left: 0;
padding: 0;
margin: 0;

I regenerated images - but still corrupted category text.

Adjusting line-height, row 121, unfortunately does not do anything.

... changing 'position: absolute;' to 'position: relative;' fixes the corrupted text, but now the image and text are moved over to the right and the veritical space is much too wide.

.

qualiteam

05-15-2017 10:52 PM

Re: Need to adjust position of cat icons.

What is your site URL so that we could look at it?

All times are GMT -8. The time now is 10:05 AM.