changes
This commit is contained in:
parent
88b749f25f
commit
ac34561ca8
134
content/root.css
134
content/root.css
@ -81,11 +81,6 @@ body {
|
||||
[data-theme="light"] .theme-icon .sun { display: none; }
|
||||
[data-theme="dark"] .theme-icon .moon { display: none; }
|
||||
|
||||
@media (max-width: 100px) {
|
||||
.header-controls {
|
||||
gap: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.settings-button, .users-button, .theme-button {
|
||||
top: 20px;
|
||||
@ -348,3 +343,132 @@ button.scroll:hover {
|
||||
#status, #username-status {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* Normal mobile devices */
|
||||
@media screen and (max-width: 768px) {
|
||||
.container {
|
||||
padding: 10px;
|
||||
padding-bottom: 70px;
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.radchat {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.current-user {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.header-controls {
|
||||
top: 10px;
|
||||
gap: 15px;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.settings-button, .users-button, .theme-button {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
}
|
||||
|
||||
.settings-icon, .users-icon, .theme-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.username-section, .users-section {
|
||||
top: 60px;
|
||||
width: 90%;
|
||||
max-width: 300px;
|
||||
left: 50%;
|
||||
right: auto;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.messages-section {
|
||||
margin-top: 50px;
|
||||
margin-bottom: 70px;
|
||||
}
|
||||
|
||||
.message {
|
||||
padding: 8px 0;
|
||||
}
|
||||
|
||||
.message .content {
|
||||
font-size: 0.95em;
|
||||
}
|
||||
|
||||
.message-section {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.message-container {
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
textarea {
|
||||
font-size: 16px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 8px 15px;
|
||||
}
|
||||
|
||||
.video-embed, .image-embed {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.radchat {
|
||||
font-size: 1.5em;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
/* Improve touch targets */
|
||||
.delete-button {
|
||||
padding: 8px 12px;
|
||||
opacity: 1; /* Always visible on mobile */
|
||||
}
|
||||
|
||||
@media (orientation: landscape) {
|
||||
.messages-section {
|
||||
margin-top: 45px;
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
.message-section {
|
||||
padding: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Small mobile devices */
|
||||
@media screen and (max-width: 380px) {
|
||||
.radchat {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.current-user {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.header-controls {
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.settings-button, .users-button, .theme-button {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
.message .content {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
}
|
||||
|
@ -14,7 +14,7 @@
|
||||
<body>
|
||||
<div class="container">
|
||||
<div class="radchat">
|
||||
RadChat
|
||||
RadChat
|
||||
</div>
|
||||
<div class="header-controls">
|
||||
<button class="users-button" onclick="toggleUsers()">
|
||||
|
Loading…
x
Reference in New Issue
Block a user