You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
30 lines
714 B
30 lines
714 B
import type React from "react";
|
|
|
|
import { BoltIcon } from "@heroicons/react/24/outline";
|
|
|
|
import { Card } from "../Card.js";
|
|
|
|
export interface BatteryWidgetProps {
|
|
batteryLevel: number;
|
|
voltage: number;
|
|
}
|
|
|
|
export const BatteryWidget = ({
|
|
batteryLevel,
|
|
voltage,
|
|
}: BatteryWidgetProps): JSX.Element => {
|
|
return (
|
|
<Card>
|
|
<div className="flex w-20 bg-slate-700 p-3">
|
|
<BoltIcon className="m-auto h-12 text-white" />
|
|
</div>
|
|
<div className="w-full">
|
|
<div className="flex h-8 bg-slate-100">
|
|
<span className="m-auto text-lg font-medium">Power</span>
|
|
</div>
|
|
<span>{batteryLevel}</span>
|
|
<span>{voltage}</span>
|
|
</div>
|
|
</Card>
|
|
);
|
|
};
|
|
|