diff options
Diffstat (limited to 'examples/with-markdown-plugins/src')
| -rw-r--r-- | examples/with-markdown-plugins/src/layouts/main.astro | 2 | ||||
| -rw-r--r-- | examples/with-markdown-plugins/src/styles/global.css | 53 |
2 files changed, 54 insertions, 1 deletions
diff --git a/examples/with-markdown-plugins/src/layouts/main.astro b/examples/with-markdown-plugins/src/layouts/main.astro index e0a60c7ad..467f16951 100644 --- a/examples/with-markdown-plugins/src/layouts/main.astro +++ b/examples/with-markdown-plugins/src/layouts/main.astro @@ -9,7 +9,7 @@ const { content } = Astro.props; <link rel="icon" type="image/x-icon" href="/favicon.ico" /> <title>{content.title}</title> - <link rel="stylesheet" href="/global.css" /> + <link rel="stylesheet" href={Astro.resolve('../styles/global.css')}> <style> .nav { border-bottom: 1px solid #ccc; diff --git a/examples/with-markdown-plugins/src/styles/global.css b/examples/with-markdown-plugins/src/styles/global.css new file mode 100644 index 000000000..ea585d269 --- /dev/null +++ b/examples/with-markdown-plugins/src/styles/global.css @@ -0,0 +1,53 @@ +body { + font-family: system-ui; +} + +.content { + max-width: 640px; + margin: 40px auto; + padding: 0 20px; +} + +.title { + position: relative; +} +.title a { + position: absolute; + display: block; + height: 100%; + width: 100%; + color: inherit; +} + +.title a:before { + position: absolute; + right: 100%; + display: block; + content: '#'; + margin-right: 0.2em; + visibility: hidden; + opacity: 0.5; +} + +.title:hover a:before { + visibility: visible; +} + +.remark-code-title, +pre[class^='language-'] { + padding: 10px; + margin: 0; +} + +.remark-code-title { + border-bottom: 1px solid rgba(0, 0, 0, 0.05); + border-radius: 4px 4px 0 0; + background: rgba(0, 0, 0, 0.08); + font-family: monospace; + font-weight: bold; +} + +pre[class^='language-'] { + background: rgba(0, 0, 0, 0.05); + border-radius: 0 0 4px 4px; +} |