{"success":true,"data":{"block":{"id":"footer-background-card","name":"Footer Background Card","title":"Footer Background Card","category":"Footer","categorySlug":"footer","description":"A footer with background image and floating contact card. Features a full-width background image with a floating card containing profile image, personal message, CTA button, navigation links, and contact information. Ideal for creative professionals, agencies, portfolios, and businesses that want a visually striking footer with a personal touch.","thumbnail":{"desktop":"https://cdn.ing/assets/i/r/290440/803ii0wnc443so1iezix0nhcr78f/footer-background-card-desktop.png","mobile":"https://cdn.ing/assets/i/r/290441/xb6qt4mygsnl5ppcxwtuem321ve5/footer-background-card-mobile.png"},"componentPath":"blocks/footers/footer-background-card.tsx","code":"import { FooterBackgroundCard } from \"@opensite/ui/blocks/footers/footer-background-card\";\nimport { brandLogoPlaceholders } from \"@/lib/media\";\n\nexport default function Demo() {\n  return (\n    <FooterBackgroundCard\n      logo={{\n        url: \"/\",\n        src: brandLogoPlaceholders.black[2],\n        alt: \"Company Logo\",\n        title: \"Your Agency\",\n      }}\n      backgroundImage=\"https://toastability-production.s3.amazonaws.com/9ughnl9wnko2vdboib8n3wl3cxsy\"\n      profileImage=\"https://toastability-production.s3.amazonaws.com/krnuu3wc960ltazr5cu120xpzmj5\"\n      tagline=\"Sarah Mitchell\"\n      personalMessage=\"With over 15 years of experience in digital strategy and creative direction, I'm dedicated to helping brands tell their story and connect with audiences in meaningful ways. Every project is an opportunity to create something extraordinary.\"\n      ctaText=\"Let's Work Together\"\n      ctaUrl=\"#\"\n      menuItems={[\n        {\n          title: \"Services\",\n          links: [\n            { text: \"Brand Strategy\", url: \"#\" },\n            { text: \"Digital Marketing\", url: \"#\" },\n            { text: \"Web Design\", url: \"#\" },\n            { text: \"Content Creation\", url: \"#\" },\n            { text: \"SEO Optimization\", url: \"#\" },\n          ],\n        },\n        {\n          title: \"Company\",\n          links: [\n            { text: \"About\", url: \"#\" },\n            { text: \"Portfolio\", url: \"#\" },\n            { text: \"Testimonials\", url: \"#\" },\n            { text: \"Careers\", url: \"#\" },\n            { text: \"Blog\", url: \"#\" },\n          ],\n        },\n        {\n          title: \"Resources\",\n          links: [\n            { text: \"Case Studies\", url: \"#\" },\n            { text: \"White Papers\", url: \"#\" },\n            { text: \"Free Tools\", url: \"#\" },\n            { text: \"Newsletter\", url: \"#\" },\n            { text: \"Events\", url: \"#\" },\n          ],\n        },\n      ]}\n      contactTitle=\"Get In Touch\"\n      contact={{\n        phone: \"(555) 123-4567\",\n        email: \"hello@agency.com\",\n        location: \"San Francisco, CA\",\n        timezone: \"PST\",\n      }}\n      copyright=\"Your Agency\"\n      bottomLinks={[\n        { text: \"Privacy Policy\", url: \"#\" },\n        { text: \"Terms of Service\", url: \"#\" },\n        { text: \"Cookies\", url: \"#\" },\n      ]}\n      background=\"transparent\"\n    />\n  );\n}","propsSchema":{"logo":{"type":"object","description":"Logo configuration","fields":{"url":{"type":"string","description":"Logo link URL","required":true},"src":{"type":"string","description":"Logo image source","required":true},"alt":{"type":"string","description":"Logo alt text","required":true},"title":{"type":"string","description":"Logo title/brand name","required":true}},"typeLabel":"FooterBackgroundCardLogo","required":false,"mediaHints":{"path":"logo.src","roles":["logo"],"disallowedRoles":["favicon","video-thumbnail"],"minPixelClass":"small","required":false,"note":"Brand logo inside the card. LOGO IMAGE ONLY. Do not use photos, favicons, or video assets."}},"backgroundImage":{"type":"string","description":"Background image URL","required":false,"mediaHints":{"path":"backgroundImage","roles":["feature","background"],"disallowedRoles":["logo","favicon","video-thumbnail"],"minPixelClass":"large","required":false,"note":"Full-bleed background behind the card. Must be an absolute URL to a real landscape or atmospheric image. IMAGE MEDIA ONLY. Do not use logos, favicons, or video assets."}},"profileImage":{"type":"string","description":"Profile image URL","required":false,"mediaHints":{"path":"profileImage","roles":["profile","avatar"],"disallowedRoles":["logo","favicon","video-thumbnail"],"minPixelClass":"small","required":false,"note":"Round profile or avatar image inside the card. Must be an absolute URL to a real person or brand image. IMAGE MEDIA ONLY. Do not use logos, favicons, or video assets."}},"tagline":{"type":"object","description":"Tagline text","typeLabel":"React.ReactNode","required":false},"personalMessage":{"type":"object","description":"Personal message text","typeLabel":"React.ReactNode","required":false},"ctaText":{"type":"object","description":"CTA button text","typeLabel":"React.ReactNode","required":false},"ctaUrl":{"type":"string","description":"CTA button URL","required":false},"contactTitle":{"type":"object","description":"Contact section title","typeLabel":"React.ReactNode","required":false},"contact":{"type":"object","description":"Contact information","fields":{"phone":{"type":"string","description":"Phone number","required":false},"email":{"type":"string","description":"Email address","required":false},"location":{"type":"string","description":"Location","required":false},"timezone":{"type":"string","description":"Timezone","required":false}},"typeLabel":"FooterBackgroundCardContact","required":false},"menuItems":{"type":"array","description":"Menu items","items":{"type":"object","description":"","fields":{"title":{"type":"string","description":"Menu section title","required":true},"links":{"type":"array","description":"Links in this section","items":{"type":"object","description":"","fields":{"text":{"type":"string","description":"Link text","required":true},"url":{"type":"string","description":"Link URL","required":true}},"typeLabel":"FooterBackgroundCardLink"},"typeLabel":"FooterBackgroundCardLink[]","required":true}},"typeLabel":"FooterBackgroundCardMenuItem"},"typeLabel":"FooterBackgroundCardMenuItem[]","required":false},"copyright":{"type":"string","description":"Brand/company name for the copyright notice","required":false},"bottomLinks":{"type":"array","description":"Bottom links","items":{"type":"object","description":"","fields":{"text":{"type":"string","description":"Link text","required":true},"url":{"type":"string","description":"Link URL","required":true}},"typeLabel":"FooterBackgroundCardLink"},"typeLabel":"FooterBackgroundCardLink[]","required":false},"logoWrapperClassName":{"type":"string","description":"Additional CSS classes for the logo wrapper","required":false},"logoClassName":{"type":"string","description":"Additional CSS classes for the logo image","required":false},"className":{"type":"string","description":"Additional CSS classes for the section wrapper","required":false},"cardClassName":{"type":"string","description":"Additional CSS classes for the card wrapper","required":false},"gridClassName":{"type":"string","description":"Additional CSS classes for the grid layout","required":false},"profileSectionClassName":{"type":"string","description":"Additional CSS classes for the profile section","required":false},"profileImageClassName":{"type":"string","description":"Additional CSS classes for the profile image","required":false},"taglineClassName":{"type":"string","description":"Additional CSS classes for the tagline","required":false},"messageClassName":{"type":"string","description":"Additional CSS classes for the personal message","required":false},"ctaClassName":{"type":"string","description":"Additional CSS classes for the CTA button","required":false},"menuSectionClassName":{"type":"string","description":"Additional CSS classes for menu sections","required":false},"menuTitleClassName":{"type":"string","description":"Additional CSS classes for menu titles","required":false},"menuLinkClassName":{"type":"string","description":"Additional CSS classes for menu links","required":false},"contactSectionClassName":{"type":"string","description":"Additional CSS classes for the contact section","required":false},"contactTitleClassName":{"type":"string","description":"Additional CSS classes for the contact title","required":false},"contactItemClassName":{"type":"string","description":"Additional CSS classes for contact items","required":false},"bottomClassName":{"type":"string","description":"Additional CSS classes for the bottom section","required":false},"copyrightClassName":{"type":"string","description":"Additional CSS classes for the copyright section","required":false},"bottomLinksClassName":{"type":"string","description":"Additional CSS classes for bottom links","required":false},"background":{"type":"string","description":"Section background variant","typeLabel":"SectionBackground","required":false},"containerClassName":{"type":"string","description":"Additional CSS classes for the container","required":false},"spacing":{"type":"object","description":"Section spacing variant","fields":{},"typeLabel":"SectionSpacing","required":false},"pattern":{"type":"object","description":"Optional background pattern","fields":{},"typeLabel":"PatternName","required":false},"patternOpacity":{"type":"number","description":"Pattern opacity (0-1)","required":false},"optixFlowConfig":{"type":"object","description":"Optional Optix Flow configuration for","fields":{"apiKey":{"type":"string","description":"API key for OptixFlow service","required":true},"compression":{"type":"number","description":"Compression level (0-100)","required":false}},"typeLabel":"OptixFlowConfig","required":false},"sectionId":{"type":"string","description":"Optional Section ID","required":false}},"exampleProps":{"logo":{"url":"/","src":"https://cdn.ing/assets/i/r/287635/1tmeh86afyxszfz7hbmvcc0oct8w/logo-dark.png","alt":"Agency Logo","title":"Agency"},"backgroundImage":"https://cdn.ing/assets/i/r/308196/g6bbn73f7gxal82uu49m9prfd0u8/workplace-in-cafe.webp","profileImage":"https://cdn.ing/assets/i/r/289144/9thob27iku9i72elwvz5j03z6482/glamorous-nightlife-portrait-woman-burgundy-dress-upscale-bar.jpg","tagline":"Sarah Mitchell","personalMessage":"15 years of digital strategy experience, dedicated to helping brands connect with audiences.","ctaText":"Let's Work Together","ctaUrl":"#","menuItems":[{"title":"Services","links":[{"text":"Brand Strategy","url":"#"},{"text":"Web Design","url":"#"}]},{"title":"Company","links":[{"text":"About","url":"#"},{"text":"Portfolio","url":"#"}]}],"contactTitle":"Get In Touch","contact":{"email":"hello@agency.com","phone":"(555) 123-4567","location":"San Francisco, CA","timezone":"PST"},"copyright":"Agency LLC","bottomLinks":[{"text":"Privacy Policy","url":"#"},{"text":"Terms","url":"#"}]},"dependencies":["@opensite/ui"],"tags":["footer","background","image","card","creative","portfolio","agency","personal","visual"],"performance":{},"importantUsageNotes":"All media src values must be absolute URLs to real assets; relative paths and placeholder media variables are not allowed. backgroundImage must be an absolute URL to a real background image. profileImage must be an absolute URL to a real profile/portrait image. menuItems use { title, links: [{ text, url }] }. bottomLinks use { text, url }. contact.phone/email/location are plain strings.","usageRequirements":{"requiredProps":[],"propConstraints":{},"mediaSlots":{"backgroundImage":{"path":"backgroundImage","roles":["feature","background"],"disallowedRoles":["logo","favicon","video-thumbnail"],"minPixelClass":"large","required":false,"note":"Full-bleed background behind the card. Must be an absolute URL to a real landscape or atmospheric image. IMAGE MEDIA ONLY. Do not use logos, favicons, or video assets."},"profileImage":{"path":"profileImage","roles":["profile","avatar"],"disallowedRoles":["logo","favicon","video-thumbnail"],"minPixelClass":"small","required":false,"note":"Round profile or avatar image inside the card. Must be an absolute URL to a real person or brand image. IMAGE MEDIA ONLY. Do not use logos, favicons, or video assets."},"logo":{"path":"logo.src","roles":["logo"],"disallowedRoles":["favicon","video-thumbnail"],"minPixelClass":"small","required":false,"note":"Brand logo inside the card. LOGO IMAGE ONLY. Do not use photos, favicons, or video assets."}}}}},"timestamp":"2026-06-27T20:12:43.145Z"}