misalignment on index and viewforum

[Prosk8er]

sorry haven't commented about this didn't think it would take much but i agree with 3di because it brings the headers size back down to what it should be

[Talk19Zehn]

Hello,

@3Di,I have tested your code from said ticket: [ticket/16796] Fixing misalignment of header items in category on index. #6235
This did not bring the desired result in the forumlist_body (index.php ) and unfortunately not in the main forum ( viewforum.php?f=136 )
In this context -> a.lastsubjekt and the following line "Posted by ...." and the SVG -> then the distance to the line lastsubjekt is too short. This distance is also too short in my view.
My guess is that therefore line-height of 16px was declared for (dd.lastpost > span), but this results displacements. My approach is therefore to assign the line-height: 16px in a.lastsubject.

@Prosk8er
li.header dt, li.header dd has a line-height of 10px, ... nothing changes. Only the words "Last Post" are output in the same line and a.lastsubjekt wins the desired distance with line-height 16px.

So I think at least.

Best Regards at all

[Prosk8er]

@Talk19Zehn i just tested your code and it isn't in line with the category title
the li header isn't suppose to be as high as it is on this website look at the height of it in prosilver for 3.3.x you'll see the difference
the code @3Di proposed is what it should be i just did it on local host and on here its working fine on index and viewforum
checked on latest firefox and chrome on latest win 10

[Talk19Zehn]

Hello Prosk8er, thank you for your test.
Okay, there is a difference about 4px (a.lastsubject). Is that correct?

BTW: It did not bother me. As intended, it was my attempt. On my part, it is only considerations to maintain the functionality. Everything is not binding.

When the code of 3Di is used, the negative margin value of 4px for the SVG-symbol "o-icon" in line 17 can be removed *) (icons.css). Is that right?
Otherwise, the SVG icon may be difficult to operate in combination to the text line (a.lastsujbect). Is this correct in my acceptance?
Here on my site - nightly: phpBB-4.0.0-a1-dev.zip, 9371604 bytes, Jul 23, 2021 8:49:02 PM

You will definitely find a good solution.

Best regards at All

Edit: *) .. sorry;
name = icon.css is wrong - it is called icons.css

[Prosk8er]

ok i just looked again and notice we need your code also. i wasn't looking at anything in li row because we were just trying to align the titles in li header

with 3di code

Screenshot 2021-07-25 072740.png (3.76 KiB) Viewed 31036 times

with Talk19Zehn code

Screenshot 2021-07-25 072908.png (5.63 KiB) Viewed 31036 times

so we need both 3Di and Talk19Zehn code to be back to normal

also instead of the lastsubject code we could remove margin-top: -4px; from

Code: Select all

.o-icon {
    vertical-align: middle !important;
    width: 14px;
    height: 14px;
    margin-top: -4px;
}

in icons.css but this however would affect all icons unless we make a new css class for it like

Code: Select all

.c-last-post-icon {
	margin-top: 0;
}

[Talk19Zehn]

Thanks for your commitment! Thank you again for your notes and test results, Prosk8er.

Well, I think we might not necessarily need my code if the CSS would be corrected for the SVG graphics "o-icon" -> (perhaps only (?)) around the negative margin value. Thus, the code of 3Di [ticket/16796] can in my opinion then be suitable. The procedures can judge the developers.

In this way, my thanks to hanakin (!) mentioned. Also to the parties on the developer level.

Best regards

[Prosk8er]

your welcome

if we want to keep prosilver original we would have to go to 3Di code and figure a correct fix for the last post content

@3Di or @hanakin i know there's been some back and forth with this but what could we do to fix the last post content

[3Di]

I had a quick look as I'm very busy with an important release, I hadn't actually noticed the icon, thanks for pointing it out. It would seem a bit more complicated but surely a solution will be found. I'll get back to it as soon as I can free myself up a bit.

[3Di]

Another solution try it out. This is just a workaround though.

1 - remove any changes and turn back to the original code.

2 - if you want to have it similar to 3.3 prosilver try content.css, line # 136

Code: Select all

li.header dt,
li.header dd {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 16px;
	text-transform: uppercase;
	border-left-width: 0;
	padding-top: 2px;
	padding-bottom: 2px;
}

3 - if you want to have it similar to 3.3 prosilver and centered vertically

change the above
padding-bottom: 2px;

to
padding-bottom: 6px;

---------

-----

[Prosk8er]

did you do any other edits cause for me that code just made the li header taller?