soames-gatsby-theme
Version:
A customizable Gatsby theme for personal websites using WordPress as a headless CMS.
16 lines (15 loc) • 1.23 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const SoamesIconList = ({ attributes }) => {
const { images, links, labels, css } = attributes;
const icons = images.map((image, i) => ({
id: `icon_${i}`,
imageUrl: image.replace(/['""]+/g, '"'),
label: labels?.[i] ?? null,
link: links?.[i] ?? null,
css: css?.[i] ?? null,
}));
return ((0, jsx_runtime_1.jsx)("section", { className: "soames-section", children: (0, jsx_runtime_1.jsx)("div", { className: "container", children: (0, jsx_runtime_1.jsx)("div", { className: "d-flex flex-wrap align-items-center justify-content-center", children: icons.map((icon) => ((0, jsx_runtime_1.jsxs)("a", { className: `d-flex flex-column align-items-center text-decoration-none p-2 ${icon.css ?? ''}`, href: icon.link ?? "#", target: "_blank", rel: "noreferrer", children: [(0, jsx_runtime_1.jsx)("img", { className: "d-block mb-2", src: icon.imageUrl, alt: icon.label ?? "", height: "116", loading: "lazy" }), (0, jsx_runtime_1.jsx)("span", { className: "text-muted", children: icon.label })] }, icon.id))) }) }) }));
};
exports.default = SoamesIconList;