Threaded View: Why Does the Font Size Decrease?

[mwolfenstein]

Hello Discussions Redesign Team and Fellow Community Members,

First, I'm thrilled that the threaded view is finally available. I would have preferred much clearer communication on when it was going to be available, but now that it's here I can actually let my faculty know that this tool is a viable option for them.

One immediate concern I have with the threaded view is the font size in replies. For some reason, the font size for replies is .875 rem. The smaller size is definitely not necessary to indicate that the reply has a parent comment since the indentation makes that abundantly evident, and I'm very concerned about the readability of the smaller font for users who don't have great vision.

What exactly was the design justification for making the reply font smaller, and has this been thoroughly tested with an array of users with different visual acuity to make sure that there is not a problem for users with lower acuity or a visual impairment?

Best,
-Moses

[venitk]

As a middle aged person who has not yet transitioned to reading glasses, I also found the diminished font size to be a problem. 

[Shar]

Hi Moses! @mwolfenstein 

Yeah, tiny font is a problem for me too. I did some CSS tweaks to increase the font and border the replies. Also, the replies do not continue to indent endlessly (yay!) but stop at 2 levels from the initial reply post.

Here's the screenshot result of my CSS. code below.

Threaded discussions redesigned

I think that this code will be stable and I have in use on a live course right now. But we'll see when enforcement date rolls around. I only added this code to the main CSS and not the mobile.

I decided to style the reply borders in the same way the light grey border around the discussion prompt is styled. The initial reply is darkcyan and thread replies are darkorchid. By default, when the discussion loads it will show all the darkcyan replies.

/** Discussion redesign - Jan 2024 **/
/* border on first reply in thread */
.css-8rac1c-view-flexItem {
	border-bottom-left-radius: 0.25rem;
	border-width: 0.0625rem;
	border-radius: 0.25rem;
	border-style: solid;
	border-color: darkcyan;
}

/* border on thread reply text */
.css-1hatz2-view-flexItem	{
	border-width: 0.0625rem;
	border-radius: 0.25rem;
	border-style: solid;
	border-color: darkorchid;
}

/* font size on thread reply text */
.css-138gh4t-view .user_content {
	font-size: 1rem;
}

And for me the font is the biggest improvement. My hope is that when Discussions Redesign is enforced that these little wrinkles will be all ironed out and my CSS alterations will not be needed.

Happy new year!
Cheers - Shar ⭐