Footer 2

Renders a complex footer with company info, newsletter, links, and social icons. It includes animated transitions for layout elements. Use when a detailed footer with multiple sections is needed.

byEdu Calvo from Smoothui

Installation

terminal

pnpm dlx layro-cli add @educlopez/footer-2

npx layro-cli add @educlopez/footer-2

npx layro-cli add @educlopez/footer-2

bunx layro-cli add @educlopez/footer-2

New project? Start with init. Writes third-party code and installs packages with scripts off.

Code

Dependencies

Demo

"use client";

import Field, { FieldLabel } from "@/components/smoothui/field";
import Input from "@/components/smoothui/input";
import SmoothButton from "@/components/smoothui/smooth-button";
import { motion, useReducedMotion } from "motion/react";

const ANIMATION_DURATION = 0.6;
const DELAY_INCREMENT = 0.1;
const HOVER_SCALE = 1.1;
const TAP_SCALE = 0.9;
const DELAY_PRODUCT = DELAY_INCREMENT * 2;
const DELAY_COMPANY = DELAY_INCREMENT * 3;
const DELAY_SUPPORT = DELAY_INCREMENT * 4;