search

jackocnr / intl-tel-input

A JavaScript plugin for entering and validating international telephone numbers
https://intl-tel-input.com
MIT License
7.38k stars 1.93k forks source link

[Feature Request] Dark mode on documentation. #1588

Closed anthony0030 closed 2 months ago

anthony0030 commented 2 months ago

I can't find the code for the documentation, BUT here is a suggestion to reduce eye pain when reading documentation.


/* SPF 50+ for dark mode users */
@media (prefers-color-scheme: dark) {
  :root {
    --bs-body-bg: var(--bs-dark);
    --bs-body-color: var(--bs-light);
    --bs-code-color: #FF99CC;
    --bs-link-color: #60A0FF;
    --bs-link-hover-color: #A0C7FF;
  }
}

/* As navlink color is hardcoded */
.iti-sidebar .nav-link {
  color: var(--bs-body-color);
}

/* As the input inherits the text color, possible bug */
.iti {
  color:  var(--bs-dark);
}

If I knew how to contribute to the documentation code I would make this as a pull request.

jackocnr commented 2 months ago

Love it, thanks! I'll add this CSS to the demo site when I get a moment. And yes, I should create a public repo for the demo site code at some point...

jackocnr commented 2 months ago

That's now live, thanks again.

anthony0030 commented 2 months ago

It looks great! I will review it more later.

jackocnr commented 2 months ago

Relevant: https://github.com/jackocnr/intl-tel-input/issues/1608