@kobalte/solidbase/src/default-theme/components/Footer.module.css

Fully featured, fully customisable static site generation for SolidStart

.footer {
	margin: 2rem 0;
	padding: 2rem 0;
	border-top: 1px solid
		color-mix(in hsl, var(--sb-decoration-color) 15%, transparent);
	display: flex;
	justify-content: space-between;

	& > div {
		display: flex;
		flex-direction: column;
		color: var(--sb-text-color);
		gap: 1rem;

		& > span {
			font-family: var(--sb-font-headings);
			color: var(--sb-heading-color);
		}

		&:nth-child(1) > span {
			font-size: 1.25em;
		}

		&:nth-child(2) {
			align-items: flex-end;
		}
	}
}

.socials {
	display: flex;
	gap: 0.75rem;

	& > a {
		text-decoration: none;
		overflow-y: clip;
		outline: none;

		& > img {
			height: 1.25rem;
			filter: drop-shadow(0 1000px 0 var(--sb-text-color));
			transform: translateY(-1000px);
		}

		&:hover > img,
		&:focus > img {
			filter: drop-shadow(0 1000px 0 var(--sb-heading-color));
		}
	}
}