function MainComponent({ src, alt, width, height, period }) { const periodStyle = `flex flex-col items-center bg-[#F3F4F6] p-4 rounded-lg shadow-md`; return /*#__PURE__*/ React.createElement("div", { className: periodStyle, __source: { fileName: "", lineNumber: 4, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: src, alt: alt, className: `w-[${width}px] h-[${height}px] m-2`, __source: { fileName: "", lineNumber: 5, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-[#1F2937]", __source: { fileName: "", lineNumber: 6, columnNumber: 7 }, __self: this }, period)); } function StoryComponent() { return /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 p-8", __source: { fileName: "", lineNumber: 13, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MainComponent, { src: "images/nokia-1865.png", alt: "Logo Nokia 1865-1896", width: "200", height: "100", period: "1865-1896", __source: { fileName: "", lineNumber: 14, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { src: "images/nokia-1-1896.png", alt: "Logo Nokia 1 1896-1956", width: "200", height: "100", period: "1896-1956", __source: { fileName: "", lineNumber: 15, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { src: "images/nokia-t5-1956.png", alt: "Logo Nokia T5 1956-1986", width: "200", height: "100", period: "1956-1986", __source: { fileName: "", lineNumber: 16, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { src: "images/nokia-1-1986.png", alt: "Logo Nokia 1 1986-1989", width: "200", height: "100", period: "1986-1989", __source: { fileName: "", lineNumber: 17, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { src: "images/nokia-2-1989.png", alt: "Logo Nokia 2 1989-1990", width: "200", height: "100", period: "1989-1990", __source: { fileName: "", lineNumber: 18, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { src: "images/nokia-5r-1990.png", alt: "Logo Nokia 5r 1990-1995", width: "200", height: "100", period: "1990-1995", __source: { fileName: "", lineNumber: 19, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { src: "images/nokia-1995.png", alt: "Logo Nokia 1995-1999", width: "200", height: "100", period: "1995-1999", __source: { fileName: "", lineNumber: 20, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { src: "images/nokia-1999.png", alt: "Logo Nokia 1999-2008", width: "200", height: "100", period: "1999-2008", __source: { fileName: "", lineNumber: 21, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { src: "images/iphone-galaxy-nokia-2008.png", alt: "Logo iPhone Galaxy Nokia 2008-2017", width: "200", height: "100", period: "2008-2017", __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { src: "images/rac-nokia-iphone-2017.png", alt: "Logo RÄÇ Nokia iPhone 2017-2021", width: "200", height: "100", period: "2017-2021", __source: { fileName: "", lineNumber: 23, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { src: "images/nokia-iphone-power-2021.png", alt: "Logo Nokia iPhone Power 2021-2022", width: "200", height: "100", period: "2021-2022", __source: { fileName: "", lineNumber: 24, columnNumber: 7 }, __self: this })); }