Contrib.social

Fix the style of media items when Media Library in Grid mode in LTR and RTL

Open on Drupal.org →
Created on 26 July 2023, about 1 year ago
Updated 10 September 2023, 12 months ago

Problem/Motivation

After 📌 Update Drupal Core from ~10.0 to ~10.1.0 and remove committed patches Fixed
And 📌 Update The Gin Admin theme from 3.0.0-rc4 to 3.0.0-rc5 and keep needed patches Fixed
Facing number of issues for Claro + Gin + Drupal Core Media Library styling
Which effect both LTR and RTL
📌 Fix right-to-left (RTL) view of video cover images when used with the Edge to Edge option Fixed

Proposed resolution

  • Reset the size for the media-library-item--grid to 14rem in all @media breakpoints, not use the percentage way of doing that, Which provided by Claro and Gin
  • Having Varbase Media custom variables, which could be changed in Custom Generated Vartheme BS5 them for a targeted project
// Varbase Media custom variables
// -----------------------------------------------------------------------------

:root {
  --varbase-media-video-player-icon-size: 4.5rem;
  --varbase-media-video-player-icon: url('../../images/play.svg');
}

Remaining tasks

  • ✅ File an issue about this project
  • ✅ Addition/Change/Update/Fix to this project
  • ✅ Testing to ensure no regression
  • ➖ Automated unit/functional testing coverage
  • ➖ Developer Documentation support on feature change/addition
  • ➖ User Guide Documentation support on feature change/addition
  • ✅ Accessibility and Readability
  • ✅ Code review from 1 Varbase core team member
  • ✅ Full testing and approval
  • ✅ Credit contributors
  • ✅ Review with the product owner
  • ✅ Update Release Notes and Update Helper on new feature change/addition
  • ✅ Release Varbase 10.0.0-beta1 → , varbase_media-10.0.0-alpha5 →

Varbase update type

  • ✅ No Update
  • ➖ Optional Update
  • ➖ Forced Update
  • ➖ Forced Update if Unchanged

User interface changes

Varbase Media - Grid page for Media Library - ultrawide screen size - LTR
→

Varbase Media - Grid page for Media Library - Standard screen size - LTR
→

Varbase Media - Grid page for Media Library - Tablets screen size - LTR
→

Varbase Media - Grid page for Media Library - ultrawide screen size - RTL
→

Varbase Media - Grid page for Media Library - Standard screen size - RTL
→

Varbase Media - Grid page for Media Library - Tablets screen size - RTL
→

Using the Media Library modal widget in LTR
→

Using the Media Library modal widget in RTL
→

API changes

  • N/A

Data model changes

  • N/A

Release notes snippet

  • Issue #3377189 → : Fixed the style of media items when Media Library in Grid mode in LTR and RTL
📌 Task
Status

Fixed

Version

10.0

Component

Code

Created by

🇯🇴Jordan Rajab Natshah Jordan

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

contrib.social Blog FAQ Discussions
Production build 0.71.5 2024