- Header-Layout optimiert, um Temperatur und Icons korrekt anzuzeigen. - Anpassungen in der Navigation Abstand zwischen die Elemente. - Verbesserte Ausrichtung und Abstände für Header-Elemente. - Farbanpassungen und Styling-Optimierungen in der Header. -Auf verschiedene Bildschirm Auflösungen getestet (Full-HD und 2K/QHD)
21 lines
671 B
JavaScript
21 lines
671 B
JavaScript
// components/Kue705_FO.jsx
|
|
import React from "react";
|
|
|
|
const Kue705_FO = () => {
|
|
return (
|
|
<div className="border border-gray-400 w-16 h-32 flex flex-col">
|
|
{/* Erstes Kind, nimmt den restlichen Platz ein */}
|
|
<div className="bg-blue-500 flex-grow flex flex-col items-center justify-center text-white text-xs">
|
|
<div className="flex flex-col justify-start">1</div>
|
|
<div>KÜ705</div>
|
|
<div>FO</div>
|
|
</div>
|
|
{/* Die unteren Abschnitte behalten ihre festen Höhen */}
|
|
<div className="bg-green-500 w-full h-1/6"></div>
|
|
<div className="bg-blue-500 w-full h-1/6"></div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default Kue705_FO;
|