function MainComponent() { const [reputationScore, setReputationScore] = React.useState(85); return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center h-screen bg-[#282c34] p-4", __source: { fileName: "", lineNumber: 4, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-lg w-full bg-[#1c1f26] p-8 rounded-lg shadow-lg", __source: { fileName: "", lineNumber: 5, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-[#FFFFFF] font-roboto text-3xl mb-6 text-center", __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, "Web3 Reputation Dashboard"), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-4", __source: { fileName: "", lineNumber: 9, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-roboto text-xl text-[#FFFFFF]", __source: { fileName: "", lineNumber: 10, columnNumber: 11 }, __self: this }, "Reputation Score")), /*#__PURE__*/ React.createElement("div", { className: "bg-[#121212] w-full mb-8 h-6 rounded-full overflow-hidden", __source: { fileName: "", lineNumber: 12, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-[#00B2FF] h-full", style: { width: `${reputationScore}%` }, __source: { fileName: "", lineNumber: 13, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center", __source: { fileName: "", lineNumber: 18, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-ethereum text-[#FFFFFF] text-4xl", __source: { fileName: "", lineNumber: 19, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-roboto text-xl text-[#FFFFFF]", __source: { fileName: "", lineNumber: 20, columnNumber: 11 }, __self: this }, `Score: ${reputationScore}`)))); }