css style for document

[lazarusA]

where should I pass the Styles for the main document? I tried in

Page(; style=Styles(,..))

and

App(; style=Styles(,...)

but none of them are the way

[SimonDanisch]

Just put it in the outermost div!

App() do 
   DOM.div(Styles(...), your_page)
end

Let me know if that works!

[lazarusA]

🙅‍♂️I also tried that one. Sorry I didn't include it here.

DOM.div(grid; style=Styles(
            "height" => "100vh",
            "margin" => "0px",
            "background-color" => "#1a1a1a",
            "padding" => "0px",
            # "margin-left" => "0px",
            CSS("body" => "margin: 0; padding: 0; overflow: hidden; background-color: #1a1a1a;")
        ))

and nope. I don't find the body, or my syntax is off.

[SimonDanisch]

You can create the whole document with DOM.body/meta/html

[sprig]

I think the confusion might be due to a bug in how styles get included:

julia> ss=Styles(CSS("height"=>"100%","width"=>"100%","background"=>"black"))
 {
  height: 100%;
  width: 100%;
  background: black;
}


julia> string(DOM.div(style=ss))
"<div style=\" {&#10;  height: 100%;&#10;  width: 100%;&#10;  background: black;&#10;}&#10;\"></div>"

And wrapping in App will not make a black page. On the other hand, directly writing the style as a literal string in style=... works.
This is Bonito v4.0.1 With Julia 1.11 on Arm Mac.

[sprig]

My apologies - in my case I was trying to render the html directly in order to push to electron (I know about the electron integration, but I preferred to manage the window myself). However, the page was still making calls to the bonito server, and they were getting blocked by cors. As far as I understand this was the cause of the error, since the page renders correctly both in browser and in electron when loading the url.