{"version":"1.0","type":"rich","title":"responsive left off-canvas","description":"This example demonstrates a responsive left off-canvas navigation menu that slides in and out using CSS3 transforms and transitions, with no JavaScript required. It shows a flyout panel containing placeholder text and a textarea, alongside a main content area with a toggle link. The implementation relies on the `:target` pseudo-class and the `csstransforms` class for hardware-accelerated animation, with a fallback that uses the `left` property for browsers lacking transform support. Media queries handle the responsive breakpoint at 768px, hiding the close button on wider screens.","provider_name":"VizHub AI Studio","provider_url":"https://next.vizhub.com","html":"<iframe src=\"https://next.vizhub.com/viz/gist-8275645?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"1\"></iframe>","width":960,"height":500,"cache_age":3600}