Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Re-creating Bragdocs with Eleventy
/*
Styling for the content section of each Bragdoc entry, such as:
- Links
- Images
- Blockquotes
- Codeblocks
- Tables
*/
a {
color: var(--link-text);
}
a:hover {
color: var(--link-hover);
}
ul, ol {
padding-left: 1.25em;
}
ul li {
list-style: disc;
line-height: 1.5em;
}
img, p > img {
width: 100%;
margin-bottom: 1em;
margin-top: 1em;
}
blockquote {
border-left: 3px solid var(--quote-block-edge);
padding-left: 1em;
line-height: 2em;
font-style: italic;
width: 100%
}
blockquote > p {
color: var(--quote-block-text);
}
pre > code {
display: inline-block;
width: 100px;
font-family: 'Roboto Mono', monospace;
padding: 1em;
}
pre {
background: var(--code-block);
color: var(--code-text);
display: block;
font-size: 0.9em;
overflow-x: auto;
}
table,
td,
th {
border-collapse: collapse;
padding:0.5em;
}
table {
margin-top: 1em;
padding: 0;
display: block;
overflow-x: auto;
}
td, th {
min-width: 100px;
text-align: left;
}
td {
border: 1px solid var(--table-border);
}
th {
border-top: 1px solid var(--table-border);
border-left: 1px solid var(--table-border);
border-right: 1px solid var(--table-border);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment