hh-ui-components
Version:
19 lines • 1.79 kB
JavaScript
import React from "react";
import classNames from "classnames";
export var QuantitySelector = function (_a) {
var _b = _a.className, className = _b === void 0 ? "" : _b;
var classes = classNames({
"": true
});
return (React.createElement("div", { className: "".concat(classes, " ").concat(className, " transition-all duration-300 flex bg-warmTone-2 rounded-[50px] w-[100px] h-[40px] px-20 md:px-20-md lg:px-20 2xl:px-20-2xl border border-warmTone-2 hover:border-black 2xl:w-[6.944vw] 2xl:h-[2.778vw] 2xl:rounded-[3.472vw] ") },
React.createElement("button", { className: "outline-none", "aria-label": "decrease" },
React.createElement("svg", { className: "", width: "100%", height: "100%", viewBox: "0 0 14 14", fill: "none", role: "img", xmlns: "http://www.w3.org/2000/svg", "aria-labelledby": "Minus" },
React.createElement("path", { d: "M0 7H14", stroke: "#000" }))),
React.createElement("div", { className: "flex items-center justify-center" },
React.createElement("input", { type: "text", value: "1", readOnly: true, "aria-label": "Quantity", className: "input-var w-full text-center text-body-large-lg md:text-body-large-lg 2xl:text-body-large-16-2xl text-lnk outline-none bg-transparent" })),
React.createElement("button", { className: "outline-none", "aria-label": "decrease" },
React.createElement("svg", { className: className, width: "100%", height: "100%", viewBox: "0 0 14 14", role: "img", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-labelledby": "Plus" },
React.createElement("path", { d: "M0 7H14", stroke: "#000" }),
React.createElement("path", { d: "M7 0V14", stroke: "#000" })))));
};
//# sourceMappingURL=QuantitySelector.js.map