@codinix/device-mockup
Version:
Beautiful responsive mockups for phone, tablet, laptop and desktop — React components, no images needed.
6 lines (5 loc) • 759 B
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import macKeyboard from "../../assets/mac-keyboard.png";
export const LaptopMockup = ({ children }) => {
return (_jsxs("div", { className: "flex flex-col items-center gap-0", children: [_jsx("div", { className: "border-[3px] border-[#b2b0af] rounded-[16px] border-b-0", children: _jsx("div", { className: "relative w-[700px] h-[420px] rounded-[12px] shadow-[0_30px_60px_rgba(0,0,0,0.3)] border-[15px] border-t-[24px] border-black bg-black overflow-hidden", children: _jsx("div", { className: "w-full h-full bg-white", children: children }) }) }), _jsx("img", { src: macKeyboard, alt: "Laptop Keyboard", className: "w-[870px] mt-[-4px] select-none pointer-events-none touch-none" })] }));
};