diff --git a/CHANGELOG.md b/CHANGELOG.md index 6666995..eb41ad0 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -13,6 +13,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Changed +- Convert code block header to a flexbox. - Get rid of dashed outline on article hover in article list. - Make comment actions slimmer. - Make navabr menu/search open animation nicer (scale up instead of just fading from transparency). diff --git a/sass/_buttons.scss b/sass/_buttons.scss index d3879be..76e1c91 100644 --- a/sass/_buttons.scss +++ b/sass/_buttons.scss @@ -2,7 +2,6 @@ display: flex; flex-direction: row; justify-content: space-between; - align-items: baseline; margin-block-start: 4rem; } diff --git a/sass/_pre-container.scss b/sass/_pre-container.scss index b377763..38da0c0 100644 --- a/sass/_pre-container.scss +++ b/sass/_pre-container.scss @@ -5,6 +5,9 @@ .header { --shimmer: rgb(from var(--accent-color) r g b / calc(var(--color-opacity) * 2)); + display: flex; + justify-content: space-between; + align-items: center; border-radius: var(--rounded-corner) var(--rounded-corner) 0 0; background-image: linear-gradient(to right, var(--fg-muted-1) 50%, var(--shimmer) 75%, var(--fg-muted-1) 100%); background-size: 200%; @@ -12,14 +15,13 @@ height: 2.5rem; span { - vertical-align: middle; margin-inline-start: 0.75rem; color: var(--fg-muted-5); font-weight: bold; + line-height: 1; } button { - float: inline-end; appearance: none; transition: var(--transition); cursor: pointer; diff --git a/templates/partials/copy_button.html b/templates/partials/copy_button.html index d205888..d4d4f0a 100644 --- a/templates/partials/copy_button.html +++ b/templates/partials/copy_button.html @@ -23,8 +23,8 @@ // Code block header let header = document.createElement("div"); header.classList.add("header"); - header.appendChild(button); header.appendChild(title); + header.appendChild(button); // Container that holds header and the code block itself let container = document.createElement("div");