diff options
author | Arun Mathai <me@arunmathaisk.in> | 2025-01-14 17:27:28 +0530 |
---|---|---|
committer | Arun Mathai <me@arunmathaisk.in> | 2025-01-16 10:36:25 +0530 |
commit | 156f1eb9623a54843a728936b08851cdb7aa21e3 (patch) | |
tree | 2f2b16f94cd37d93026fa5532b8f06a7ac9eda09 /assets | |
parent | 86bb1d6cda6a59a05d24558c83b6e3c780138f96 (diff) |
feat(copy-code): To allow user to copy contents within code block to clipboard
fix(ui): corrections told by tomfran
fix(ui): add more contrast to button.
fix(ui): loading js as deferred
Diffstat (limited to 'assets')
-rw-r--r-- | assets/css/main.css | 19 | ||||
-rw-r--r-- | assets/css/vars.css | 1 |
2 files changed, 20 insertions, 0 deletions
diff --git a/assets/css/main.css b/assets/css/main.css index 61eca0a..c25d741 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -74,7 +74,26 @@ a { /* Code blocks */ +.copy-code-button { + background-color: var(--background); + font-family: var(--font-mono); + padding: 3px 6px; + font-size: 0.8em; + border-radius: var(--copy-code-button-border-radius); + position: absolute; + top: 10px; + right: 10px; + z-index: 1; + display: none; + border: 1px solid var(--code-border); +} + +pre:hover .copy-code-button { + display: block; +} + pre { + position: relative; padding: var(--code-padding); border: 1px solid var(--code-border); overflow: scroll; diff --git a/assets/css/vars.css b/assets/css/vars.css index 995cf2e..b28df63 100644 --- a/assets/css/vars.css +++ b/assets/css/vars.css @@ -44,6 +44,7 @@ /* Code */ --code-padding: 1.5rem; --code-border-radius: 10px; + --copy-code-button-border-radius: 7px; /* Social section */ --social-icons-bottom-margin: 3rem; |