diff --git a/README.md b/README.md index 2966e48..3693309 100644 --- a/README.md +++ b/README.md @@ -38,7 +38,7 @@ Distributed under the MIT License. See [LICENSE](LICENSE) for more information.

Back to top :arrow_up:

-[GIF_PATH]: assets/ +[GIF_PATH]: assets/github/gif.gif [GOOGLE_URL]: https://fonts.google.com/ [JS_ICON_URL]: https://icons8.com/icon/108784/javascript [ICONS8_URL]: https://icons8.com diff --git a/assets/github/gif.gif b/assets/github/gif.gif new file mode 100644 index 0000000..c8b0d56 Binary files /dev/null and b/assets/github/gif.gif differ diff --git a/css/style.css b/css/style.css index 81c2bd5..f787181 100644 --- a/css/style.css +++ b/css/style.css @@ -2,8 +2,10 @@ --font-sans: "Inter", sans-serif; --font-mono: "Ubuntu Mono", monospace; --white-color: #fff; - --black-color: #000; - --dark-gray-color: #4d4e53; + --black-color: #141314; + --link-color: #004bee; + --darker-gray-color: #313235; + --dark-gray-color: #3c3d40; --light-gray-color: #f5f5f5; --js-yellow-color: #ffd600; --font-size: 1.2rem; @@ -20,6 +22,21 @@ code { color: var(--light-gray-color); } + + pre { + color: var(--light-gray-color); + background-color: var(--dark-gray-color); + } + + .clipboard-btn { + color: var(--white-color); + background-color: var(--darker-gray-color); + } + + article a, + footer a { + color: var(--link-color); + } } body { @@ -37,6 +54,11 @@ section { padding-bottom: 1rem; } +pre, +button { + border-radius: 5px; +} + nav { position: fixed; padding-left: 2rem; @@ -183,7 +205,6 @@ strong { font-weight: bold; } -/* code, */ pre { font-size: 1.1rem; font-family: var(--font-mono); @@ -213,6 +234,7 @@ pre { right: 0.5rem; bottom: 0.5rem; padding: 0.5rem; + background-color: #d4d4d4; font-family: var(--font-sans); font-size: 1rem; border: none; @@ -229,11 +251,15 @@ pre { footer { display: flex; - justify-content: space-between; + justify-content: space-evenly; font-size: 0.9rem; margin-left: 1rem; margin-right: 1rem; + span { + margin-right: 1rem; + } + a { text-decoration: none; } @@ -258,7 +284,6 @@ footer { } footer { - justify-content: space-around; text-align: center; line-height: 1.1; diff --git a/script.js b/script.js index 14325a5..d4b611b 100644 --- a/script.js +++ b/script.js @@ -26,7 +26,7 @@ function addClipboardBtns() { function addClipboardEvent(clipboardBtn, preTagContent) { clipboardBtn.onclick = () => { - navigator.clipboard.write(preTagContent); + navigator.clipboard.writeText(preTagContent); clipboardBtn.innerText = "Copied!"; setTimeout(() => { clipboardBtn.innerText = "Copy";