Last active
April 17, 2021 08:31
-
-
Save Ddedalus/0c7855c75b0f6aee1b117281eb172af9 to your computer and use it in GitHub Desktop.
CSS to style HTML preview of slides written in pandoc
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
1. Place this in | |
%USERPROFILE%\.vscode\extensions\shd101wyy.markdown-preview-enhanced-0.5.16\node_modules\@shd101wyy\mume\styles\preview_theme | |
2. Add to VSCode settings: | |
"markdown-preview-enhanced.previewTheme": "slides.css", | |
*/ | |
/*! | |
Font definitions takes from: | |
* LaTeX.css (https://latex.now.sh/) | |
* MIT Licence | |
*/ | |
@font-face { | |
font-family: 'Latin Modern'; | |
font-style: normal; | |
font-weight: normal; | |
font-display: swap; | |
src: url('./fonts/LM-regular.woff2') format('woff2'), url('./fonts/LM-regular.woff') format('woff'), url('./fonts/LM-regular.ttf') format('truetype'); | |
} | |
@font-face { | |
font-family: 'Latin Modern'; | |
font-style: italic; | |
font-weight: normal; | |
font-display: swap; | |
src: url('./fonts/LM-italic.woff2') format('woff2'), url('./fonts/LM-italic.woff') format('woff'), url('./fonts/LM-italic.ttf') format('truetype'); | |
} | |
@font-face { | |
font-family: 'Latin Modern'; | |
font-style: normal; | |
font-weight: bold; | |
font-display: swap; | |
src: url('./fonts/LM-bold.woff2') format('woff2'), url('./fonts/LM-bold.woff') format('woff'), url('./fonts/LM-bold.ttf') format('truetype'); | |
} | |
@font-face { | |
font-family: 'Latin Modern'; | |
font-style: italic; | |
font-weight: bold; | |
font-display: swap; | |
src: url('./fonts/LM-bold-italic.woff2') format('woff2'), url('./fonts/LM-bold-italic.woff') format('woff'), url('./fonts/LM-bold-italic.ttf') format('truetype'); | |
} | |
@font-face { | |
font-family: 'Libertinus'; | |
font-style: normal; | |
font-weight: normal; | |
font-display: swap; | |
src: url('./fonts/Libertinus-regular.woff2') format('woff2'); | |
} | |
@font-face { | |
font-family: 'Libertinus'; | |
font-style: italic; | |
font-weight: normal; | |
font-display: swap; | |
src: url('./fonts/Libertinus-italic.woff2') format('woff2'); | |
} | |
@font-face { | |
font-family: 'Libertinus'; | |
font-style: normal; | |
font-weight: bold; | |
font-display: swap; | |
src: url('./fonts/Libertinus-bold.woff2') format('woff2'); | |
} | |
@font-face { | |
font-family: 'Libertinus'; | |
font-style: italic; | |
font-weight: bold; | |
font-display: swap; | |
src: url('./fonts/Libertinus-bold-italic.woff2') format('woff2'); | |
} | |
@font-face { | |
font-family: 'Libertinus'; | |
font-style: normal; | |
font-weight: 600; | |
font-display: swap; | |
src: url('./fonts/Libertinus-semibold.woff2') format('woff2'); | |
} | |
@font-face { | |
font-family: 'Libertinus'; | |
font-style: italic; | |
font-weight: 600; | |
font-display: swap; | |
src: url('./fonts/Libertinus-semibold-italic.woff2') format('woff2'); | |
} | |
/* Use LaTeX default font and make the letters bigger: better for VS code preview */ | |
body { | |
font-family: 'Latin Modern', Georgia, Cambria, 'Times New Roman', Times, serif; | |
font-size: 100%; | |
} | |
/* Make equations larger so that they match the text */ | |
.MathJax { | |
font-size: 1rem !important; | |
} | |
/* Justified paragraphs */ | |
p { | |
text-align: justify; | |
} | |
.notes { | |
background-color: rgb(243, 243, 243); | |
color: rgb(94, 94, 94); | |
padding: 5px; | |
font-size: 80%; | |
} | |
/* Visible line between each slide */ | |
h1 { | |
/* border-top: 1px solid #999999; */ | |
padding-top: 30px; | |
padding-bottom: 15px; | |
} | |
h2 { | |
/* border-top: 1px solid #999999; */ | |
padding-top: 5px; | |
} | |
.columns { | |
display: flex; | |
flex-direction: row; | |
} | |
.column { | |
flex-grow: 1; | |
flex-basis: 50%; | |
padding-left: 5px; | |
padding-right: 5px; | |
} | |
hr { | |
border: white; | |
border-top: 1px solid #999999; | |
} | |
table, th, td { | |
border: 1px solid black; | |
border-collapse: collapse; | |
padding: 7pt; | |
margin-left: auto; | |
margin-right: auto; | |
} | |
/* Make images easier to work with */ | |
/* img { | |
max-width: 100%; | |
height: auto; | |
display: block; | |
} | |
textarea { | |
width: 100%; | |
} */ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment