soames-gatsby-theme
Version:
A customizable Gatsby theme for personal websites using WordPress as a headless CMS.
16 lines (15 loc) • 1.38 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const SoamesGalleryMenu = ({ attributes }) => {
const { images, links, labels, css } = attributes;
const menuItems = images.map((image, i) => ({
id: `icon_${i}`,
imageUrl: image.replace(/['""]+/g, '"'),
label: labels?.[i],
link: links?.[i],
css: css?.[i],
}));
return ((0, jsx_runtime_1.jsx)("section", { className: "features1 soames-gallery-menu", children: (0, jsx_runtime_1.jsx)("div", { className: "container-fluid", children: (0, jsx_runtime_1.jsx)("div", { className: "media-container-row", children: menuItems.map(menuItem => ((0, jsx_runtime_1.jsx)("div", { className: "card p-3 col-md-12 col-lg-3", children: (0, jsx_runtime_1.jsxs)("div", { className: "card-wrapper", children: [(0, jsx_runtime_1.jsx)("div", { className: "card-img", children: (0, jsx_runtime_1.jsx)("a", { href: menuItem.link, children: (0, jsx_runtime_1.jsx)("img", { src: menuItem.imageUrl, alt: menuItem.label ?? "", title: menuItem.label ?? "" }) }) }), (0, jsx_runtime_1.jsx)("div", { className: "card-box", children: (0, jsx_runtime_1.jsx)("h4", { className: "card-title pb-3 mbr-fonts-style display-7", children: menuItem.label }) })] }) }, menuItem.id))) }) }) }));
};
exports.default = SoamesGalleryMenu;