Enhance responsive design: Adjust container positioning and border styles for smaller screens

This commit is contained in:
2026-03-05 02:51:32 +11:00
parent b79cbf0545
commit 134e917cac
2 changed files with 27 additions and 4 deletions

View File

@@ -2,7 +2,7 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Lit.ruv.wtf Terminal</title> <title>Lit.ruv.wtf Terminal</title>
<meta name="description" content="Interactive terminal interface for Lit.ruv.wtf - A retro-styled command line experience with chat, documentation, and more."> <meta name="description" content="Interactive terminal interface for Lit.ruv.wtf - A retro-styled command line experience with chat, documentation, and more.">

View File

@@ -184,9 +184,16 @@ body {
/* Responsive adjustments */ /* Responsive adjustments */
@media (max-width: 768px) { @media (max-width: 768px) {
.crt-border-overlay {
border-width: 40px;
border-image-width: 40px;
}
.container { .container {
width: 98vw; top: 40px;
height: 95vh; left: 40px;
right: 40px;
bottom: 50px;
border-radius: 4px; border-radius: 4px;
} }
@@ -215,6 +222,18 @@ body {
} }
@media (max-width: 480px) { @media (max-width: 480px) {
.crt-border-overlay {
border-width: 25px;
border-image-width: 25px;
}
.container {
top: 25px;
left: 25px;
right: 25px;
bottom: 35px;
}
.terminal-title { .terminal-title {
letter-spacing: 1px; letter-spacing: 1px;
font-size: 10px; font-size: 10px;
@@ -234,11 +253,15 @@ body {
.header-link { .header-link {
padding: 2px 4px; padding: 2px 4px;
} }
}
.status-right { .status-right {
display: none; display: none;
} }
/* Prevent iOS auto-zoom on input focus */
.terminal-inline-input {
font-size: 16px;
}
} }
/* Scrollbar styling */ /* Scrollbar styling */