Core Apps patient page look and feel different on desktop browsers

@mogoodrich , see PR below

and screenshot

Great, thanks @mozzy, I just merged this in!

1 Like

Thanks @reagan for working on that . i merged it in .

I think now generally we have fixed all UI issues to do with the patient dashbord

see screen shot from current qa-server ,
NB Health Trend Summary widget fixed and also the Actions Column now looks better , over wrapping issues corrected

1 Like

is there still additional work needed on this ticket? felt it would have been better to ship out too as we do the testing. @mozzy @ruhanga @dkayiwa

In this ticket https://issues.openmrs.org/browse/RA-1703 , there is work being done to refactor the ObsAcrossEncounter table into a grid which has caused some undesirable effects on the ui due to the css classes referenced as seen here https://issues.openmrs.org/browse/RA-1702. I had earlier done some work here to address the overflow issue of table content https://issues.openmrs.org/browse/RA-1698 however this doesnt work with the refactor. @cioan what could be the benefit of the refactor? @dkayiwa @mogoodrich @mozzy @mksd @ruhanga

@reagan sorry about that… it looks like we have both been working on the same areas and may have disrupted your changes.

We implemented RA-1703 in an attempt to fix an issue we had with the Obs Across Encounter table becoming too wide… you can see the ā€œbeforeā€ and ā€œafterā€ of our changes here:

Before:

After:

What is strange, is the ā€œbeforeā€ screenshot was taken after the change was added to make the widget scrollable, but the widget didn’t become scrollable… is there anything in particular we need to do to make it scrollable?

Regarding the fact that RA-1703 broke other changes, can that just be fixed by changing some of the CSS class names we added in obsacrossencounter? Or make sure the style changes we apply there are only limited to that widget? Regardless of whether or not we go with a grid or a table for this particular widget, I think we’d want to be able to support using a grid within a widget.

And good point about the columns being fixed width… do you know if there’s any Bootstrap support for flex-width columns?

Thanks! Mark

Thanks @mogoodrich.

About this, unfortunately the PR on the scroll-able capability of the widget is not merged yet. Maybe we would have somewhat had this solved before the changes on RA-1703. A couple of changes are still being made on RA-1703 and hopefully we will have the pending issues resolved.

Ah, okay @ruhanga! I think we are definitely willing to consider the scrolling solution instead of the Bootsrap version if it’s better a solution… is there a way to we could demo the scrollable solution? We could even temporarily revert part of RA-1703 if that is helpful?

1 Like

Sure, thanks @mogoodrich. Here is a simple GIF to demonstrate the effect of RA-1699. scrollable_obs_across_encounters_widget

1 Like

@ddesimone what do you think of the above design?

If this works for us, I would advocate for reverting the switch to bootstrap grid (sorry, I realize that was my suggestion, but @reagan made a good point about bootstrap grid not supported dynamic column sizes), but keeping the ability to specify whether to use a FSN or shortname.

fyi @cioan @ddesimone

1 Like

Thanks @mogoodrich. I agree this is an improvement and would recommend going ahead with it!

Thanks @ddesimone!

@ruhanga @reagan do you need us to revert the change to the Bootstrap grid, or can you just merge your changes and overwrite those changes?

Thanks @mogoodrich, I overrode the changes and I guess we are good to merged RA-1699’s PR.

1 Like

Thanks @ruhanga I just merged.

2 Likes

Thanks guys for taking care of all thse issues , am very excited ,the patient dashbord is stable again. Am going to release the new version of core apps 1.27.0 ,before we break it again :smile:

and at this time , is there any blocker /issue that would stop us from haveing the full release for reff app ??

cc @mogoodrich @reagan @ruhanga @samuel34 @ssmusoke

2 Likes

No blockers on my end!

1 Like

cc @mozzy @ruhanga

2 Likes