🇮🇳India @Preeti.chawla

Hi,

I checked both issues on the 11.x-dev version. The breadcrumb display on mobile was not working correctly, but it’s functioning well after applying the patch. However, I couldn’t reproduce the primary issue; it works fine without any patch. So I’ve created a merge request for patch #33.

preeti.chawla → made their first commit to this issue’s fork.

In line with CSS3 standards, using double colons (::) for pseudo-elements like ::before and ::after is recommended to differentiate them from pseudo-classes

• Technical Accuracy: ::before is technically correct for pseudo-elements like ::before and ::after, following the CSS3 standard, which differentiates pseudo-elements (::) from pseudo-classes (:).
• Browser Support: Older browsers, such as IE8, support only the single-colon :before. All modern browsers support both, favoring backward compatibility.
• Consistency: While ::before is preferred, some developers use :before for historical consistency, especially when older browser support is needed

I attempted to troubleshoot and resolve this issue locally using various methods, such as applying max-width and utilizing media queries.

I discovered a potential solution that involves using media queries specifically for cases where the font size is set to large or very large.

CSS for Font Size-Specific Adjustments
To detect when the user has changed their default font size, I recommend using the @supports rule. This allows for adjustments to the form layout or text styles accordingly:

css
@supports (font-size: var(--font-size-large)) {

.layout-form {
display: grid;
grid-template-rows: auto 1fr;
grid-template-columns: minmax(0, 3fr) minmax(22.5rem, 1fr);
gap: var(--space-l);
}

.layout-region--main,
.layout-region--footer {
grid-column: 1;
margin-inline: auto;
width: var(--layout-region-edit-width);
}

/* When the layout has vertical tabs */
.layout-region--main:has(.vertical-tabs),
.layout-region--main:has(.vertical-tabs) ~ .layout-region--footer {
width: var(--layout-region-edit-extended-width);
}

/* Push sidebar down to horizontal align with form section. */
.layout-region--secondary {
grid-row: span 2;
margin-block-start: var(--space-l);
}

@media (max-width: 40rem) {
.layout-form {
grid-template-columns: 1fr;
}
}
}

I have tested the above solution locally, and it is working well. Please refer to the screenshot for reference.

After reviewing all the comments and scenarios with the themes (Carlo, Olivero, and Stark), I found that adding an ellipsis makes the title less readable and unclear.

I think we should follow the approach which is in this MR (https://git.drupalcode.org/project/drupal/-/merge_requests/5290/diffs?co...) for better readability and understanding."

I have created new patch with proposed solution in last comment to resolve the issue. Please review

Preeti.chawla → made their first commit to this issue’s fork.

@robindh Please add more info or some screenshot to reproduce the bug

HI @thakurnishant_06, Patch#12 applied successfully and color of View field working fine as per design. Moving to RTBC

@Grimreaper I have applied #3 MR applied successfully and removed classes from button. Button border looks fine attaching screenshot as well We can move forward to RTBC

HI @thakurnishant_06, I have applied patch#10 and applied succesfully.
But I want to highlight something related to this
View tab is visible but it's not matching with the design, As per theme the colour of tab should be green and background colour should be white.

I am attaching Current screenshot after patch and another for what we exactly need. Please check

@alok_singh I have reviewed patch#2 and applied successfully. After applied patch checkbox icons placement working fine.
Steps to Reproduce

1. Go to site
2. Go to /user/register
3. Check at bottom icon placement

Moving to RTBC

HI @shweta__sharma Please add more details or steps to reproduce to understand the proper issue.

Hi @Gauravvvv
I have checked with Claro theme, button are working fine as expected. Please add more details to reproduce it

@AnkitSharma8110 I have reviewed patch#2, Applied successfully and admin menu works as expected. Good to RTBC+1

@alok_singh I have installed Ajans theme with version 6.0.2. At my end without applying any patch or MR, Read more button themed already in blue colour. Please see screenshot for reference. We can move further with this issue

@shweta__sharma I have Created a patch#2 to fix this issue. Blank styling will not be visible after this patch.

@cedewey The screenshot is from GIN Admin theme and issue listed is in Claro issues, this makes confusion. Please correct the theme name and screenshot
Thanks

@bandanasharma I have reviewed the patch#2, search icons placement looks good, We can move to RTBC+1

@Tanuja Bohra I have created another patch, Now Footer and powered by Drupal menu both will visible. Please review

I have created another patch where I have fixed the extra spacing and refractor above patch css in correct file. Please review

@Meeni_Dhobale @DeepaliJ At my end alignment working fine without applying any patch on Drupal9.5 and Drupal10.1.x.Please see screenshot

To see the third level menu as per comment #3 we need to change block settings. And for theme the three level menu I have created another patch which will work in both the Versions Drupal9.5 and 10.1. Adding screenshot with Version name
Please review

HI @W01F Thanks for your feedback, As per your feedback I have created another patch#4. Now on double click menu are not open-close. Please review

I have created a patch#2 to improve hamburger menu in Mobile. Added some delay while click on Hamburger menu. I have added video with Before and After state.
Please review

@snehal-chibde I have reviewed patch #10, applied successfully and dotted line working fine

@djsagar I have applied patch#4, applied successfully and search icons working fine. We can move to RTBC +1

@djsagar I have applied patch#3 and applied successfully, trigger button visible properly. Just want to highlight this trigger button was not working fine in light mode as well. After patch#3 working fine in both the cases. Adding screenshot of Light mode before patch
We can move to RTBC+1

@djsagar I have applied the patch#2 and applied successfully. Header region sticky issue fix and working fine in Mobile. We can move to RTBC+1

@aamouri To Reproduce this issue need API and Agency key to Enable site studio (Cohesion).

I am working on it

@stefan.korn I have applied the patch #2 and applied successfully. The separator alignment working fine in GIN. We are good to RTBC +1

I have created a patch#4 to fix this issue. Please review

I am working on it

@alok_singh @shweta__sharma There are two ways to test the right spacing.
If we put image in

tag then above patch#2 working fine but if we add image in outside the

tag then need to add code of one line which I have added in my patch#6
Please review and check the inter diff as well

I am working on it

@chrisck Hi, created a patch to fix that issue. Please review.

I am working on it

@chrisck Above MR changes giving error while apply and Please add code in tableselect.scss file for particular this issue and that should compile in Gin.css.
And if add manually your css changes, UI distort at my end

@bnjmnm Now I have tried to apply patch with this version Drupal9.5 and Gin 8.x-3.x-dev, Patch applied successfully but icons still not visible for me

@bnjmnm I have not able to apply patch. There is something wrong, Even I have tried to add code manually and I check "buttonBorder" variable not declared anywhere

@Vidushi Mehta I have applied #4 to review and patch applied successfully. View's modal popup icons working fine, Adding Screenshot Before and After state as well. Moving to RTBC

@gisle longwave Sorry for all, but my intension was not deleting or hiding another's patch. As you can see my patch is #3 and also commented first on this "working on it" but at the same time _utsavsharma submitted the patch. You can chechk the time as well. I have not refresh my page before submitting. And later not was hiding my patch by mistake clicked on hide on another patch

@fnalb2 @_utsavsharma I have reviewed a Patch#4, Patch applied successfully.

I am working on it

@DieterHolvoet @saschaeggi I have applied MR!177 changes, And after adding MR changes entity label working fine. Attached screenshot before and after state. Moving to RTBC

I have created new patch which will work in latest 2.x.dev. By this Toolbar menu will be visible in Gin theme. Please apply and test for same.

@Jay Jangid I have created another patch with interdiff, please apply and check. Adding Screenshot as well

@saschaeggi I have done all steps as mentioned and applied the MR-!281 changes. After the MR changes buttons are working fine or clickable. Attached video as well for reference
Moving to RTBC

@sakthi_dev I have installed all as mentioned in steps and successfully applied the patch, I have tested on local and It's working fine.
Adding Screenshot before and after state. And moving to RTBC

@sakthi_dev I have done all steps as mentioned, And successfully applied patch#2, it's working fine. adding screenshot as well.
Moving to RTBC

@sakthi_dev I have done all steps as mentioned, And successfully applied patch#2, it's working fine. adding screenshot as well.
Moving to RTBC

HI @jvogt I have installed Environment Indicator module as mentioned, I have verified the vertical toolbar menus with above Patch#3, it working fine.

@MrDaleSmith Then we should hold this issue till the error issue will close, because when the error will fix then only we can save menu with icons and no link behaviour.

@hudri I have installed Gin Admin Theme and bulk node view as mentioned in Steps, After applied the compiled CSS patch it's working fine. Toggle convert to checkbox

@arnabcse2013 I have installed Collapsible Drag 'n Drop with Version: 8.x-2.x-dev as mentioned. And check with GIN and OLIVERO backend theme, arrow alignment gets distorted in both. But after apply patch css, working fine.

Arrow alignment with Olivero Admin theme

Arrow alignment with GIN Admin theme

@Utkarsh_33 I applied the CSS from comment #9 and it working or looks fine on the preview and other modal dialogs. please refer Screenshot
Before

/Users/preeti.chawla/Desktop/Screenshot 2023-07-10 at 3.59.57 PM.png

After

/Users/preeti.chawla/Desktop/Screenshot 2023-07-10 at 3.59.45 PM.png

@MrDaleSmith
I have installed Simple Menu Icons with Version: 3.0.x-dev as mentioned.Tried to add icons in menu, After click on save the menu is not saved. I checked in logs I saw one error related to same module.The error is (Undefined constant "FILE_STATUS_PERMANENT" in simple_menu_icons_menu_link_content_form_submit()).
So I am creating new issue with link of this ticket

@infohome
As I have checked in above description, reference ticket is in postponed state and this ticket is dependent on reference ticket.( https://www.drupal.org/project/drupal/issues/3174774 📌 Enable option to "sticky" the sidebar within Olivero Postponed ). So we have to set postpone for this as well.

@lauriii
Please explain more on this, what exactly do we need to improve in forced colors mode for vertical tabs menu

@ady1503 I have Installed Drupal version 10.1.x-dev as mentioned and tested on my local, Its working fine as expected.
Enabled Olivero theme and add menu - Dropdown menu working fine
And Recent content block also shown with no Ajax issues in both the cases LoggedIN and anonymous

Please refer screenshot