Files
bodyshop/client/src/components/courtesy-car-fuel-select/courtesy-car-fuel-select.component.jsx
2021-03-30 17:13:33 -07:00

41 lines
1015 B
JavaScript

import { Slider } from "antd";
import React, { forwardRef } from "react";
import { useTranslation } from "react-i18next";
const CourtesyCarFuelComponent = (props, ref) => {
const { t } = useTranslation();
const marks = {
0: {
style: {
color: "#f50",
},
label: <strong>{t("courtesycars.labels.fuel.empty")}</strong>,
},
13: t("courtesycars.labels.fuel.18"),
25: t("courtesycars.labels.fuel.14"),
38: t("courtesycars.labels.fuel.38"),
50: t("courtesycars.labels.fuel.12"),
63: t("courtesycars.labels.fuel.58"),
75: t("courtesycars.labels.fuel.34"),
88: t("courtesycars.labels.fuel.78"),
100: {
style: {
color: "#008000",
},
label: <strong>{t("courtesycars.labels.fuel.full")}</strong>,
},
};
return (
<Slider
ref={ref}
marks={marks}
step={null}
style={{ marginLeft: "2rem", marginRight: "2rem" }}
{...props}
/>
);
};
export default forwardRef(CourtesyCarFuelComponent);