diff options
| author | Matthias Krüger <matthias.krueger@famsik.de> | 2024-08-21 19:35:14 +0200 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2024-08-21 19:35:14 +0200 |
| commit | ade33251f1d528443d1a4f04d5ad0ae7fc278c77 (patch) | |
| tree | 89b18e936fc359ad2834673d494578b5ac9bc0f6 | |
| parent | a3f644ef203aab63f9e6239ec6fdaa5fe5acab59 (diff) | |
| parent | 9d7574f9b0925a5b681e19e81f96ad8d5f2a5be2 (diff) | |
| download | rust-ade33251f1d528443d1a4f04d5ad0ae7fc278c77.tar.gz rust-ade33251f1d528443d1a4f04d5ad0ae7fc278c77.zip | |
Rollup merge of #129284 - notriddle:notriddle/animate-target=light, r=GuillaumeGomez
rustdoc: animate the `:target` highlight This approach is, roughly, based on how Discourse does it. It came up while discussing [some other possible sidebar changes](https://rust-lang.zulipchat.com/#narrow/stream/266220-t-rustdoc/topic/Moving.20deprecated.20items.20out.20of.20the.20way), as a design that made rapid scanning easier while avoiding the inherent trade-offs in summarizing. https://github.com/user-attachments/assets/f7a8fec3-70a5-40a1-92ea-bfdffbd61c22
| -rw-r--r-- | src/librustdoc/html/static/css/rustdoc.css | 13 | ||||
| -rw-r--r-- | tests/rustdoc-gui/target.goml | 2 |
2 files changed, 14 insertions, 1 deletions
diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css index eb5a5d935e2..28df8d3f011 100644 --- a/src/librustdoc/html/static/css/rustdoc.css +++ b/src/librustdoc/html/static/css/rustdoc.css @@ -1547,10 +1547,23 @@ instead, we check that it's not a "finger" cursor. margin-left: 24px; } +@keyframes targetfadein { + from { + background-color: var(--main-background-color); + } + 10% { + background-color: var(--target-border-color); + } + to { + background-color: var(--target-background-color); + } +} + :target { padding-right: 3px; background-color: var(--target-background-color); border-right: 3px solid var(--target-border-color); + animation: 0.65s cubic-bezier(0, 0, 0.1, 1.0) 0.1s targetfadein; } .code-header a.tooltip { diff --git a/tests/rustdoc-gui/target.goml b/tests/rustdoc-gui/target.goml index 82bd34ed274..92846f8e01d 100644 --- a/tests/rustdoc-gui/target.goml +++ b/tests/rustdoc-gui/target.goml @@ -11,7 +11,7 @@ define-function: ( [theme, background, border], block { call-function: ("switch-theme", {"theme": |theme|}) - assert-css: ("#method\.a_method:target", { + wait-for-css: ("#method\.a_method:target", { "background-color": |background|, "border-right": "3px solid " + |border|, }) |