diff --git a/CHANGELOG.md b/CHANGELOG.md index 90c66457f1..118e54178a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -216,6 +216,7 @@ Passing an owned value `window` to `Surface` will return a `Surface<'static>`. S ### Examples - remove winit dependency from hello-compute example by @psvri in [#4699](https://github.com/gfx-rs/wgpu/pull/4699) +- Made the examples page not crash on Chrome on Android, and responsive to screen sizes by @Dinnerbone in [#4958](https://github.com/gfx-rs/wgpu/pull/4958) ## v0.18.1 (2023-11-15) diff --git a/examples/static/index.html b/examples/static/index.html index bbd3ce1685..135c04d810 100644 --- a/examples/static/index.html +++ b/examples/static/index.html @@ -23,10 +23,21 @@ flex-direction: column; } - .banner { + #banner { background: #dee; padding: 0.5em 0; border-bottom: 1px solid #abb; + + @media only screen and (max-width: 1000px) { + max-height: 0; + transition: max-height 0.15s ease; + overflow: hidden; + padding: 0; + } + } + + #banner.visible { + max-height: 100%; } .banner-prefix { @@ -95,12 +106,36 @@ /* This forces CSS to ignore the width/height of the canvas, this is needed for WebGL */ contain: size; } + + + #menu-button { + display: none; + + @media only screen and (max-width: 1000px) { + display: block; + width: 30px; + height: 33px; + margin: 0 auto; + } + } + + #menu-button span { + display: block; + width: 100%; + height: 3px; + margin: 6px auto; + background-color: #333; + transition: all 0.3s ease-in-out; + } +