How to set canvas to full size in web?

[RicardoHS]

I've looking through some issues in the repo but I see no clear way on how to do such thing.

Any instructions on how to proceed?

[daxpedda]

Winit provides no way to do this.
You can do this on your end by simply setting the size (width and height) of the canvas to 100% with CSS. This is also doable through web-sys.

Eventually Winit will support this when #696 is tackled.

[RicardoHS]

Thanks for the info. I finally managed to achieve this with some adjustems of #1491

I will leave the code here in case anyone found it helpfull

let window = WindowBuilder::new().build(&event_loop).unwrap();

web_sys::window().and_then(|win| {
    let width = win.inner_width().unwrap().as_f64().unwrap() as u32;
    let height = win.inner_height().unwrap().as_f64().unwrap() as u32;
    let factor = window.scale_factor();
    let logical = LogicalSize { width, height };
    let PhysicalSize { width, height }: PhysicalSize<u32> = logical.to_physical(factor);
    window.set_inner_size(PhysicalSize::new(width, height));
    win.document()
  })
  .and_then(|doc| {
      let dst = doc.get_element_by_id("<your_body_id_in_the_html_doc>")?;
      let canvas = web_sys::Element::from(window.canvas());
      dst.append_child(&canvas).ok()?;
      Some(())
  })
  .expect("Couldn't append canvas to document body.");

And the CSS

* { margin:0; padding:0; } 
html, body { width:100%; height:100%; }
canvas {
    background-color: black;
    display:block;
}