codeblock.css
Advanced tools
+1
-1
| { | ||
| "name": "codeblock.css", | ||
| "version": "1.1.2", | ||
| "version": "1.1.3", | ||
| "description": "263 bytes to make pretty code blocks using only CSS. Much like Prism.js but without any highlighting.", | ||
@@ -5,0 +5,0 @@ "main": "codeblock.min.css", |
+28
-2
@@ -43,5 +43,5 @@ <p align="center"> | ||
| <div id="code"> | ||
| <span id="lang">javascript</span> | ||
| <span id="lang">html</span> | ||
| <pre> | ||
| <!-- your code here --> | ||
| <!-- your code here --> | ||
| </pre> | ||
@@ -55,2 +55,28 @@ </div> | ||
| If you'd like to add a title to the code block, you'll have to do this: | ||
| ```html | ||
| <div id="code"> | ||
| <div id="info"> | ||
| <span id="title">example 1</span> | ||
| <span id="lang">html</span> | ||
| </div> | ||
| <pre> | ||
| <div id="code"> | ||
| <div id="info"> | ||
| <span id="title">example 1</span> | ||
| <span id="lang">html</span> | ||
| </div> | ||
| <pre> | ||
| <!-- your code here --> | ||
| </pre> | ||
| </div> | ||
| </pre> | ||
| </div> | ||
| ``` | ||
| Which will look like this: | ||
| <img src="https://raw.githubusercontent.com/thecodrr/codeblock.css/master/assets/preview1.png" width="700"> | ||
| ## Theming: | ||
@@ -57,0 +83,0 @@ |
5639
13.42%108
31.71%