Posting data via fetch and handling network errors
I personally think that You can easily handle part of the error handling logic in the catch block however at the moment You are listening for the specific response status do specify what went wrong during the API connection process.
MDN says:

You can use a catch block to handle all exceptions that may be generated in the try block.

try/catch works in a way that if anything fails on the try block, then the rest of the code (in the try block) is ignored and the script execution goes to the catch block. If something goes wrong then the error object is created and passed to the catch block as a parameter .catch(err). From this object You might be able to handle part of the error handling logic. Take a look at the below links:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/try...catch
https://javascript.info/try-catch
Moreover:

data variable can be a const
Instead of writing .style.display = &quot;none&quot;; use YourElement.classList.add('YourNewSexyClass') and use CSS for styling :)
innerHTML is not a good practice. Take a look here -&gt; https://developer.mozilla.org/en-US/docs/Web/API/Element/innerHTML#security_considerations
url variable should a const
data variable should be a const


let data = {
    &quot;Username&quot;: emailAddress,
    &quot;Password&quot;: Password,
  }


can be changed like so (get rid of capital letters here)
let data = {
    username: emailAddress,
    password: password
  }

so that You can change it to
let data = {
    username: emailAddress,
    password
  }