Responsiivinen korkeus: terminaali ja UI skaalautuvat viewport-korkeuteen
Terminaali: clamp(200px, 35vh, 500px) — skaalautuu ikkunan mukaan. <900px korkeus: pienempi otsikko, tiiviimmät avataret, matalampi terminaali. >1200px korkeus: isompi terminaali ja promptikenttä. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -388,7 +388,7 @@
|
|||||||
font-family: 'Courier New', Courier, monospace;
|
font-family: 'Courier New', Courier, monospace;
|
||||||
font-size:14px;
|
font-size:14px;
|
||||||
color:var(--success-color);
|
color:var(--success-color);
|
||||||
height:300px;
|
height: clamp(200px, 35vh, 500px);
|
||||||
overflow-y:auto;
|
overflow-y:auto;
|
||||||
text-align:left;
|
text-align:left;
|
||||||
white-space: pre-wrap;
|
white-space: pre-wrap;
|
||||||
@@ -688,6 +688,21 @@
|
|||||||
#code-input-container { flex-direction: column !important; }
|
#code-input-container { flex-direction: column !important; }
|
||||||
#code-send-btn { width: 100%; margin-top: 5px; }
|
#code-send-btn { width: 100%; margin-top: 5px; }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Responsiivinen korkeus */
|
||||||
|
@media (max-height: 900px) {
|
||||||
|
.terminal-panel { height: clamp(150px, 25vh, 250px); }
|
||||||
|
.agent-prompt-editor textarea { min-height: 30px; }
|
||||||
|
.container > div:first-child { margin-bottom: 6px; }
|
||||||
|
.container h1 { font-size: 22px; }
|
||||||
|
.container .sub { font-size: 12px; }
|
||||||
|
.avatar-card { padding: 6px 4px; }
|
||||||
|
.avatar-card img { width: 50px; height: 50px; margin-bottom: 4px; }
|
||||||
|
}
|
||||||
|
@media (min-height: 1200px) {
|
||||||
|
.terminal-panel { height: clamp(350px, 40vh, 600px); }
|
||||||
|
.agent-prompt-editor textarea { min-height: 80px; }
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|||||||
Reference in New Issue
Block a user