UI: Add fluid resolution-based scaling for WQHD and 4K displays in index.css
This commit is contained in:
+2
-2
File diff suppressed because one or more lines are too long
+1
File diff suppressed because one or more lines are too long
-1
File diff suppressed because one or more lines are too long
Vendored
+2
-2
@@ -7,8 +7,8 @@
|
||||
<link rel="manifest" href="/manifest.webmanifest" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<title>Mission Control 2.0</title>
|
||||
<script type="module" crossorigin src="/assets/index-CNOUjLQN.js"></script>
|
||||
<link rel="stylesheet" crossorigin href="/assets/index-yPX24G-1.css">
|
||||
<script type="module" crossorigin src="/assets/index-BPaKNJdw.js"></script>
|
||||
<link rel="stylesheet" crossorigin href="/assets/index-D8yfJQ7Z.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
|
||||
@@ -210,3 +210,25 @@ input:focus, textarea:focus, select:focus {
|
||||
box-shadow: 0 0 0 2px hsl(var(--primary) / 0.15) !important;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
/* WQHD & 4K Monitor Responsive Scaling (Fluid Typography & UI Scaling) */
|
||||
@media (min-width: 1440px) {
|
||||
html {
|
||||
font-size: 16.5px;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1920px) {
|
||||
html {
|
||||
font-size: 17.5px;
|
||||
}
|
||||
}
|
||||
@media (min-width: 2560px) {
|
||||
html {
|
||||
font-size: 19px;
|
||||
}
|
||||
}
|
||||
@media (min-width: 3440px) {
|
||||
html {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -224,7 +224,7 @@ export function AgentView() {
|
||||
</div>
|
||||
|
||||
{/* The Graph Canvas Area */}
|
||||
<div ref={containerRef} className="relative w-full h-[360px] border border-border/30 rounded-xl bg-black/25 overflow-hidden flex">
|
||||
<div ref={containerRef} className="relative w-full h-96 border border-border/30 rounded-xl bg-black/25 overflow-hidden flex">
|
||||
<svg className="absolute inset-0 pointer-events-none w-full h-full">
|
||||
<defs>
|
||||
<linearGradient id="cyan-to-teal" x1="0%" y1="0%" x2="100%" y2="0%">
|
||||
|
||||
@@ -488,7 +488,7 @@ function Cockpit() {
|
||||
</div>
|
||||
|
||||
{/* The Graph Canvas Area */}
|
||||
<div ref={containerRef} className="relative w-full h-[360px] border border-border/30 rounded-xl bg-black/25 overflow-hidden flex">
|
||||
<div ref={containerRef} className="relative w-full h-96 border border-border/30 rounded-xl bg-black/25 overflow-hidden flex">
|
||||
{/* SVG Overlay behind HTML Nodes */}
|
||||
<svg className="absolute inset-0 pointer-events-none w-full h-full">
|
||||
{/* Gradients */}
|
||||
|
||||
Reference in New Issue
Block a user