hangerthem.com/components/divider.tsx
2024-08-11 20:09:50 +02:00

41 lines
646 B
TypeScript

"use client"
import styled from "styled-components"
const DividerContainer = styled.div`
display: flex;
align-items: center;
justify-content: center;
gap: 1rem;
padding: 1rem 0;
`
const DividerLine = styled.div`
width: 40%;
height: 1px;
background-color: rgb(var(--white));
border: none;
@media (min-width: 768px) {
width: 20%;
}
`
const DividerSquare = styled.div`
width: 1rem;
height: 1rem;
transform: rotate(45deg);
background-color: rgb(var(--white));
`
const Divider = () => {
return (
<DividerContainer>
<DividerLine />
<DividerSquare />
<DividerLine />
</DividerContainer>
)
}
export default Divider