CRM-21312 Fix display of 'Recent Items' when using a bootstrap theme

[mattwire]

Overview

Before this patch, recent items is messed up on bootstrap themes. Afterwards, it is not messed up!

Before

After

Technical Details

Tested on Bartik, Adaptivetheme, bootstrap. Works well on all of them.

---

• CRM-21312: Fix display of Recent Items when using a bootstrap theme

[seamuslee001]

@mattwire I'm guessing this isn't relevant to shoreditch is it because it uses its own css or will this impact shoreditch as well?

[seamuslee001]

The code looks fine and simple and i don't think it would hurt anything just would like confirmation on impact on shoreditch first

[eileenmcnaughton]

@guanhuan @jmcclelland - see Shoreditch q

[mukeshcompucorp]

@mattwire Padding 0 is ok but, making overflow:hidden will hide view edit option from list item, can you write counter css which allows to make it visible someway properly?

Before:

After:

Hint: you can use icons to consume less space.

[jmcclelland]

@eileenmcnaughton I think you may have intended to ping jamie novak instead (not sure what his handle is)?

[mattwire]

@mukeshcompucorp Ok, take 2. I've wrapped the item name in a separate div so we can set overflow: hidden on that element and not affect the others. This also has the benefit that the hardcoded string length of 25 can be removed and it looks sensible on wider displays.

[eileenmcnaughton]

test this please

[igorpavlov-zz]

Please amend the overview to specify what is exactly fixed like "Fixed the layout for recent items, ... etc".

Please also amend the screenshots so they show the whole page. If this page supports mobile layout the best thing to do might be providing a GIF where the resizing process is seen.

"Tested on Bartik, Adaptivetheme, bootstrap. Works well on all of them." - this is not Technical Details. Technical details would be a CSS code snippet. What is provided is more something that goes under --- or in a Comment section.

[igorpavlov-zz]

I wonder would it be nicer to wrap a DIV into A? In that case the area of click will cover the whole div, not just a caption (not a change request but a thought)

[eileenmcnaughton]

Hi guys - just trying to understand the degree of testedness / agreedness of this - I don't want to get blocked by the semantics of filing in the template - it seems agreed this is an improvement in some cases but I'm not sure if we have agreement this won't cause regressions in others.

[mattwire]

@mukeshcompucorp Can you confirm you are happy with this now?

[mlutfy]

I tested on a CiviCRM with an existing Bootstrap theme (which had tweaked the CSS in a not-very-clean way, so I wanted to see if it would cause problems) and it seems OK:

So I would be in favour of merging this - risk of breakage for existing themes seems minimal.

[eileenmcnaughton]

I second @mlutfy comments & am merging - the main concern was to get Compucorp input as to whether this had any negative effects on the Shoreditch theme. An impact was identified & resolved & other comments seem to be about stylistic nuances & administrative aspects. Based on @mlutfy testing I will merge - but I suggest @guanhuan that Compucorp make a point of testing the rc / master branch

[mattwire]

@lsmithgo I'm guessing that is an issue specific to whatever theme / theme customisation you are using. Works fine on the standard themes (just checked again).

[lsmithgo]

@mattwire I'm using the standard theme (to the best of my knowledge). Problem only shows when the item title is long, eg when showing a Participant registered to an Event. See the screenshot.

[mattwire]

@lsmithgo Looks like a Joomla specific issue then... I suggest you open an issue at https://lab.civicrm.org/dev/core/issues making it clear it only affects Joomla, and ideally try and work out what the best fix for this might be (that doesn't stop it working properly on other CMS).