Improve mobile responsiveness
Add viewport meta tag to prevent mobile browsers from scaling down the page, and add responsive CSS for screens ≤600px to keep the UI readable. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
51227631e6
commit
735a8c1438
1 changed files with 29 additions and 0 deletions
29
index.html
29
index.html
|
|
@ -2,6 +2,7 @@
|
|||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||
<title>Paste</title>
|
||||
<style>
|
||||
* {
|
||||
|
|
@ -119,6 +120,34 @@ body {
|
|||
.hidden {
|
||||
display: none !important;
|
||||
}
|
||||
@media (max-width: 600px) {
|
||||
#line-numbers {
|
||||
font-size: 12px;
|
||||
min-width: 36px;
|
||||
padding: 10px 6px;
|
||||
}
|
||||
#plaintext {
|
||||
font-size: 12px;
|
||||
padding: 10px;
|
||||
}
|
||||
#nav {
|
||||
padding: 8px;
|
||||
gap: 8px;
|
||||
}
|
||||
.btn {
|
||||
padding: 8px 12px;
|
||||
font-size: 13px;
|
||||
}
|
||||
#url-output {
|
||||
min-width: 0;
|
||||
width: 100%;
|
||||
font-size: 12px;
|
||||
}
|
||||
#status {
|
||||
margin-left: 0;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script src="lzma.js"></script>
|
||||
</head>
|
||||
|
|
|
|||
Loading…
Reference in a new issue