public/hugo-theme-terminal
1
0
Fork 0
forked from mirrors/hugo-theme-terminal
Code Pull Requests Activity

Fix/Change code block styling

Browse Source
This commit is contained in:
panr
2020-01-06 09:31:18 +01:00
parent 7ac0deff87
commit ec262730ac
7 changed files with 39 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
source/css/main.css
View File

@ -134,7 +134,7 @@ code {
}
pre {
background: transparent;
background: transparent !important;
padding: 20px 10px;
margin: 40px 0;
font-size: .95rem;

61
source/css/prism.css
View File

@ -6,6 +6,10 @@ https://prismjs.com/download.html#themes=prism-tomorrow&languages=markup+css+cli
* @author Rose Pritchard
*/
:root {
--code-margin: 40px;
}
code[class*="language-"],
pre[class*="language-"] {
background: none;
@ -31,18 +35,19 @@ pre[class*="language-"] {
/* Code blocks */
pre[class*="language-"] {
margin: 0;
padding: 0;
overflow: auto;
}
:not(pre) > code[class*="language-"],
pre[class*="language-"] {
border-radius: 8px;
border-radius: 0;
}
/* Inline code */
:not(pre) > code[class*="language-"] {
padding: .1em;
border-radius: .3em;
border-radius: 0;
white-space: normal;
}
@ -86,35 +91,31 @@ pre[class*="language-"].line-numbers > code {
}
.line-numbers-rows > span {
pointer-events: none;
display: block;
counter-increment: linenumber;
}
.line-numbers-rows > span {
pointer-events: none;
display: block;
counter-increment: linenumber;
}
.line-numbers-rows > span:before {
content: counter(linenumber);
color: #999;
display: block;
padding-right: 0.8em;
text-align: right;
}
.line-numbers-rows > span:before {
content: counter(linenumber);
color: #999;
display: block;
padding-right: 0.8em;
text-align: right;
}
.code-toolbar {
position: relative;
margin: 40px 0;
padding: 20px 0;
border-top: 1px solid rgba(255, 255, 255, .1);
border-bottom: 1px solid rgba(255, 255, 255, .1);
+ .code-toolbar {
border-top: 0;
margin-top: -40px;
}
margin: var(--code-margin) 0;
padding: 20px;
border: 1px solid rgba(255, 255, 255, .1);
+ .code-toolbar,
+ .highlight,
+ .highlight .code-toolbar {
border-top: 0;
margin-top: calc(-1 * var(--code-margin));
}
pre, code {
@ -126,10 +127,15 @@ pre[class*="language-"].line-numbers > code {
}
}
.highlight + .highlight .code-toolbar {
border-top: 0;
margin-top: calc(-1 * var(--code-margin));
}
div.code-toolbar > .toolbar {
position: absolute;
top: .3em;
right: .2em;
top: 10px;
right: 10px;
transition: opacity 0.3s ease-in-out;
opacity: 0;
}
@ -164,11 +170,11 @@ div.code-toolbar > .toolbar button,
div.code-toolbar > .toolbar span {
color: #bbb;
font-size: .8em;
padding: 0 .5em;
padding: 10px;
background: #f5f2f0;
background: rgba(224, 224, 224, 0.2);
box-shadow: 0 2px 0 0 rgba(0,0,0,0.2);
border-radius: .5em;
border-radius: 0;
}
div.code-toolbar > .toolbar a:hover,
@ -177,7 +183,6 @@ div.code-toolbar > .toolbar button:hover,
div.code-toolbar > .toolbar button:focus,
div.code-toolbar > .toolbar span:hover,
div.code-toolbar > .toolbar span:focus {
color: inherit;
text-decoration: none;
}