Steps to reproduce: /claro/css/components/form.css

1. go to /claro/css/components/form.css file
2. we have written IE11 specific css for placeholder. :-ms-input-placeholder {color: var(--color--gray-30) !important; } which is not required. Because yarn compiles the ::placeholder to :-ms-input-placeholder for IE11 support.
3. Adding screen-recording to better understanding.

Resolution:

::placeholder {
  color: var(--color--gray-30);
}

/* IE 10 and 11 needs this set as important. */
:-ms-input-placeholder {
  color: var(--color--gray-30) !important;
}

This code compiles to

:-ms-input-placeholder {
  color: #7e96a7;
}

::placeholder {
  color: #7e96a7;
}

/* IE 10 and 11 needs this set as important. */

:-ms-input-placeholder {
  color: #7e96a7 !important;
}

So we can remove this extra line of code.

/* IE 10 and 11 needs this set as important. */
:-ms-input-placeholder {
  color: var(--color--gray-30) !important;
}
CommentFileSizeAuthor
#5 3213103-5.patch910 bytesranjith_kumar_k_u
#2 3213103-2.patch918 bytesgauravvvv

Comments

Gauravmahlawat created an issue. See original summary.

gauravvvv’s picture

Status: Active » Needs review
StatusFileSize
new918 bytes

I have removed the extra piece of code in patch #2, Please review.

Version: 9.3.x-dev » 9.4.x-dev

Drupal 9.3.0-rc1 was released on November 26, 2021, which means new developments and disruptive changes should now be targeted for the 9.4.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

bnjmnm’s picture

This may potentially be fixed as part of the work on #3254202: Remove IE11 Support from Claro

ranjith_kumar_k_u’s picture

StatusFileSize
new910 bytes
bnjmnm’s picture

Status: Needs review » Postponed (maintainer needs more info)
Issue tags: +Needs issue summary update

The proposed solution in the issue summary (and the patch in #5) suggests removing this:

/* IE 10 and 11 needs this set as important. */
:-ms-input-placeholder {
  color: var(--color--gray-30) !important;
}

Because what is left compiles to this:

:-ms-input-placeholder {
  color: #7e96a7;
}

::placeholder {
  color: #7e96a7;
}

That includes removing an !important, and there's a comment specifically stating the !important is necessary in IE11, so why would we just remove that? Its not a duplicate as stated in the issue summary, it is there to to add specificity for the IE use case.

It's possible the !important isn't needed anymore due to other changes, but we'd need evidence of that before we could justify removing something that was clearly intentional.

gauravvvv’s picture

Hi @bnjmnm This issue was created in the reference of #3252084: [meta] Remove support for IE11 , removing support of IE11 from Drupal.

bnjmnm’s picture

#7

Hi @bnjmnm This issue was created in the reference of #3252084: [meta] Remove support for IE11 , removing support of IE11 from Drupal.

This additional confusing to me, perhaps you can help clear it up.

  • This issue was created on 10 May 2021. The #3252084 issue was created several months later on 1 Dec 2021 at 10:07 EST, so I'm not sure how this issue could have spawned from that
  • Removing IE support can only happen in Drupal 10, this issue is set to 9.4
  • The suggested solution in the issue summary includes keeping the -ms-input-placeholder pseudo, not sure how it would be related to removing IE support

I suppose it's even more important that the issue summary be updated as it's not currently clear what this issue is looking to address.

Version: 9.4.x-dev » 9.5.x-dev

Drupal 9.4.0-alpha1 was released on May 6, 2022, which means new developments and disruptive changes should now be targeted for the 9.5.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 9.5.x-dev » 10.1.x-dev

Drupal 9.5.0-beta2 and Drupal 10.0.0-beta2 were released on September 29, 2022, which means new developments and disruptive changes should now be targeted for the 10.1.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

quietone’s picture

Status: Postponed (maintainer needs more info) » Closed (outdated)

IE is no longer supported and the code changed in the patch was removed in #3254202: Remove IE11 Support from Claro.

Closing as outdated.

quietone’s picture

Issue tags: +Bug Smash Initiative