Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
top: 0;
@media (min-width: 700px) {
left: 2rem;
}
`;
// Generic, reusable component for displaying icon and label
export const LabeledIcon = ({ icon: Icon, label }) => (
{label}
);
export const ToggleInner = styled.span`
display: flex;
justify-content: center;
height: 2.3rem;
position: relative;
bottom: 0.5rem;
@media (min-width: 1000px) {
position: static;
}
svg {
height: 2.5rem;
max-width: 2.3rem;
width: 2.3rem;
display: block;
position: relative;
width: 100%;
`;
const MenuContent = styled.nav`
display: block;
`;
const MenuList = styled.ul`
position: relative;
list-style: none;
margin: 0;
/* left: calc(50% - 50vw);
width: 100vw; */
`;
const ToggleText = styled.span`
margin-right: 1.6rem;
* {
fill: currentColor;
}
`;
const MenuListItem = styled.li`
position: relative;
border-style: solid;
border-width: 0.1rem 0 0 0;
border-color: #dcd7ca;
display: flex;
flex-wrap: wrap;
line-height: 1;
justify-content: flex-start;
margin: 0;
margin: 0;
padding-top: 24px;
padding-bottom: 8px;
box-sizing: border-box;
`;
const AuthorName = styled.span`
color: rgba(12, 17, 43, 0.9);
font-size: 0.9em;
`;
const StyledLink = styled(Link)`
padding: 15px 0;
`;
const PublishDate = styled.span`
color: rgba(12, 17, 43, 0.9);
font-size: 0.9em;
`;
const Excerpt = styled.div`
line-height: 1.6em;
color: rgba(12, 17, 43, 0.8);
`;
`;
const EntryTitleLink = styled(Link)`
color: #000000;
text-decoration: none;
&:hover {
text-decoration: underline;
}
`;
const AuthorName = styled.span`
color: rgba(12, 17, 43, 0.9);
font-size: 0.9em;
`;
const PublishDate = styled.span`
color: rgba(12, 17, 43, 0.9);
font-size: 0.9em;
`;
const Excerpt = styled.div`
line-height: 1.6em;
color: rgba(12, 17, 43, 0.8);
`;
`;
const ArchiveHeaderInner = SectionContainer;
const ArchiveTitle = styled.h1`
font-size: 2.4rem;
font-weight: 700;
letter-spacing: -0.026666667em;
margin: 0;
@media (min-width: 700px) {
font-size: 3.2rem;
}
`;
const ColoredText = styled.span`
color: ${props => props.color};
text-transform: capitalize;
`;
{link ? {children} : children}
);
};
const MetaIcon = styled.span`
flex-shrink: 0;
margin-right: 1rem;
`;
const MetaText = styled.span`
a {
color: inherit;
text-decoration: none;
}
:hover {
text-decoration: underline;
}
`;
const ListItem = styled.li`
align-items: center;
display: flex;
flex-wrap: nowrap;
flex-shrink: 0;
letter-spacing: -0.016875em;