Made adjustments to the padding when viewed on a smaller screen

This commit is contained in:
abrendan 2024-01-04 21:00:23 +00:00
parent 7bd7e14910
commit 831834728d
2 changed files with 8 additions and 3 deletions

View File

@ -12,7 +12,7 @@
<body onload = "onload()">
<div id = "Main">
<audio id = "Ding" src = "Ding.mp3"> </audio>
<h1 id = "Title"> MicDropMessages V1.5 </h1>
<h1 id = "Title"> MicDropMessages V1.6 </h1>
<p>Welcome to MicDropMessages! This small webbased application allows you to chat with your friends anonymously! To start, enter your username and enter a chatroom.</p>
<div id = "AccessPort">
<label id = "NameLabel"> Username </label>

View File

@ -104,11 +104,16 @@ body.dark-mode .input {
background-color:#000000;
color:#ffffff;
}
@media (max-width: 600px) {
@media (max-width: 800px) {
label {
width: auto; /* Full width on narrow screens */
}
#Main {
width: 100%; /* Full width on narrow screens */
}
.container, .content, body {
padding-left: 20px; /* Increase the left padding */
padding-right: 20px; /* Increase the right padding */
}
}