61 lines
2.3 KiB
JavaScript
61 lines
2.3 KiB
JavaScript
import React from "react";
|
|
import { Icon } from "@iconify/react"; // Für Iconify Icons
|
|
|
|
function Kue705FO({
|
|
isolationswert,
|
|
schleifenwiderstand,
|
|
modulName,
|
|
kueVersion,
|
|
}) {
|
|
return (
|
|
<div className="relative bg-gray-300 w-[116px] h-[390px] border border-gray-400">
|
|
{/* Hauptkörper - Linker Bereich */}
|
|
<div className="absolute top-[1.352px] left-[1.352px] w-[113.202px] h-[242.492px] bg-littwin-blue border-[1.5px] border-gray-400"></div>
|
|
|
|
{/* Innenrahmen weiß */}
|
|
<div className="absolute top-[3.375px] left-[3.375px] w-[109.125px] h-[238.5px] border-[3px] border-white"></div>
|
|
|
|
{/* Rechte Spalte */}
|
|
<div className="absolute top-[3.375px] right-0 w-[37.5px] h-[238.5px] border-[3px] border-white"></div>
|
|
|
|
{/* Oberer kleiner Block in der rechten Spalte */}
|
|
<div className="absolute top-[3.375px] right-0 w-[37.5px] h-[37.052px] border-[3px] border-white"></div>
|
|
|
|
{/* Text KÜ705-FO */}
|
|
<h3 className="absolute top-[19.871px] left-[25.541px] text-white font-bold text-[9px]">
|
|
KÜ705-FO
|
|
</h3>
|
|
|
|
{/* Modulname und Version */}
|
|
<div className="absolute top-[220px] left-[10px] text-white text-[8px]">
|
|
<p>Version: {kueVersion}</p>
|
|
</div>
|
|
|
|
{/* Isolationswert */}
|
|
<div className="absolute top-[100px] left-[10px] text-white text-[8px]">
|
|
<p>Isolationswert: </p>
|
|
<p>{isolationswert} kOhm</p>
|
|
</div>
|
|
|
|
{/* Kabelüberwachung-Modul-Name */}
|
|
<div className="absolute top-[130px] left-[10px] text-white text-[8px]">
|
|
<p>ModulName: {modulName}</p>
|
|
</div>
|
|
{/* Schleifenwiderstand */}
|
|
<div className="absolute top-[270px] left-[10px] text-white text-[8px]">
|
|
<p>Schleifenwiderstand: {schleifenwiderstand} kOhm</p>
|
|
</div>
|
|
|
|
{/* Unterer Bereich - Schleifenwiderstand und Messkurve */}
|
|
<div className="absolute bottom-0 left-[1.095px] w-[113.182px] h-[105.864px] bg-gray-300 border-[1.5px] border-gray-400">
|
|
{/* Messkurve Button */}
|
|
<div className="absolute bottom-[1.5px] left-[13.49px] w-[91.428px] h-[14.544px] bg-littwin-blue flex items-center justify-center">
|
|
<span className="text-white text-[9px]">Messkurve</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default Kue705FO;
|