hak8or/blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Shine the code block header on copy

Browse Source
This commit is contained in:
daudix
2024-07-18 02:38:37 +03:00
parent 19e976375c
commit 61adc17752
1 changed files with 57 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
sass/_containers.scss
View File

@ -10,10 +10,21 @@
.header { .header {
border-radius: var(--rounded-corner) var(--rounded-corner) 0 0; border-radius: var(--rounded-corner) var(--rounded-corner) 0 0;
background-color: var(--fg-muted-1); background-image: linear-gradient(to right, var(--fg-muted-1) 50%, var(--primary-color-alpha) 75%, var(--fg-muted-1) 100%);
background-size: 200%;
padding: 0.25rem; padding: 0.25rem;
height: 2.5rem; height: 2.5rem;
&:has(button.active) {
animation: active-fill var(--transition-long);
@keyframes active-fill {
to {
background-position-x: -200%;
}
}
}
span { span {
vertical-align: middle; vertical-align: middle;
margin-inline-start: 0.75rem; margin-inline-start: 0.75rem;
@ -21,13 +32,6 @@
font-weight: bold; font-weight: bold;
line-height: normal; line-height: normal;
} }
}
pre {
margin: 0;
box-shadow: none;
border-radius: 0 0 var(--rounded-corner) var(--rounded-corner);
}
button { button {
float: inline-end; float: inline-end;
@ -73,4 +77,11 @@
height: 1rem; height: 1rem;
} }
} }
}
pre {
margin: 0;
box-shadow: none;
border-radius: 0 0 var(--rounded-corner) var(--rounded-corner);
}
} }