Contact section

[1ns4n3T5]

Bro, your template is pretty good, but it has one issue. In the contact section, users can't see their input text in the text field, even though the values are accepted (checked via inspect). How can I fix that?

edit : solve that issue.

[cal-jamo]

@1ns4n3T5 how did you end up solving it?

[Kyazs]

@cal-jamo by Explicitly define dark mode class for toggling on the file index.scss

since there's light-mode. do the opposite for the dark-mode

[dark-dylan-dev]

Might be a bit late to reply to this issue but it's better later than never.

As Kyazs said, in the index.scss file, explicitely define .dark-mode as the inverse of .light-mode and add the following attributes in both light and dark mode.

The following sample is for light mode, so inverse the colors for the dark mode :

  .MuiInputBase-root {
    color: #0d1116 !important;
    background-color: white !important;
  }

  .MuiInputBase-input {
    color: #0d1116 !important;
    background-color: transparent !important;
  }

  .MuiFormLabel-root {
    color: #0d1116 !important;
  }
  
  .MuiFormHelperText-root {
    color: #0d1116 !important;
  }

This overrides the material UI used by default.
And in Contact.scss modify the background color of fieldset to transparent.
So from this :

fieldset {
  background-color: white;
}

To this :

fieldset {
  background-color: transparent;
}

In the end, this should look like this :

• Dark mode :
  
• Light mode :
  

Hope I helped you, have a good day :)