Issue #3472487: Tweaks to mobile css of SDDS components

Closes #3472487

added 36 commits

• 89f6d973...fc68ec7b - 35 commits from branch project:1.0.x
• 39528e74 - Merge branch '1.0.x' into '3472487-tweaks-to-mobile'

Compare with previous version

mentioned in merge request !37 (merged)

@alan.cole is doing some refactoring so let me see if he can take a look at this.

requested review from @alan.cole

@Bhut.Avani - Thanks for this. I have moved some of the case study frame improvements into the refactor, though I did swap from using a series of breakpoints with px based values to using percentage for positioning the frame, which reduces the code a bit.

The refactor included a re-implementation of the media queries to better support 1024 (the resolution this will be demoed at). This means the other changes relating to breakpoints likely won't be needed.

If you'd like to double-check and make sure that nothing in here is still required, that would be appreciated. Otherwise, I think we can close this MR @kepol.

@Bhut.Avani it does probably make sense to close this one. If you want to test the latest changes, please check this one:

https://www.drupal.org/project/demo_design_system/issues/3473641

I have closed the original issue for this one as fixed since Alan used some of the important parts in the refactor. Thanks

closed