1
0
mirror of https://github.com/cotes2020/jekyll-theme-chirpy.git synced 2025-12-18 05:41:31 +00:00

Add clipboard button to code block

This commit is contained in:
Cotes Chung
2021-09-09 22:09:07 +08:00
parent 7dc7a7efc8
commit 2537283beb
2 changed files with 34 additions and 3 deletions

View File

@@ -166,6 +166,10 @@ div {
background: var(--code-header-bg);
border-top-left-radius: $code-radius;
border-top-right-radius: $code-radius;
display: flex;
justify-content: space-between;
align-items: center;
line-height: 1.85rem;
// language badge
&::before {
@@ -176,6 +180,29 @@ div {
text-transform: uppercase;
padding-left: 1em;
}
// clipboard
button {
border: 0;
background-color: inherit;
border-top-right-radius: $code-radius;
color: var(--highlight-lineno-color);
&:hover {
background-color: gray;
color: white;
}
&:focus {
outline: none;
}
i {
font-size: 85%;
}
}
}
@media all and (max-width: 576px) {
@@ -187,7 +214,11 @@ div {
.code-header {
border-radius: 0;
padding: 0 0.4rem;
padding-left: 0.4rem;
button {
border-top-right-radius: 0;
}
}
}
}