How pass bootstrapp css to Template in LocalReporting

Shadowman4205

Hello,
i am using this to generate pdf

var rs = new LocalReporting().UseBinary(JsReportBinary.GetBinary()).AsUtility().Create();
            var report = await rs.RenderAsync(new RenderRequest
            {
                Template = new Template
                {
                    Recipe = Recipe.PhantomPdf,
                    Engine = Engine.None,
                    Content = "<style> h1 {color: red } .test {color: blue }</style><h1>Hello World </h1> <p class=\"test\">Test</p>"
                }
            });

How can i pass bootstrapp css styles? i tried using "<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"></link> <style> h1 {color: red } .test {color: blue }</style><h1>Hello World </h1> <p class="test">Test</p>"

jan_blaha

Link from cdn should work.
Do you have link in html head tag?

Also from docs

Using a responsive CSS framework such as Bootstrap for printing to PDF may not be the best idea. However, it still works. You need to keep in mind that the output PDF typically won't look the same as HTML, because Bootstrap includes different printing styles under @media print.

Shadowman4205

Hello this html string i passing

<html><head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"><style>.text-primary { color:blue; }</style></head><body><p class="text-primary">Helo World</p> <p class="bg-info">Info</p></body></html>

and i am getting pdf without any style and the class inside style does not apply etheir cause of link,
but if i use this

<html><head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"><style>.text-primary { color:blue; }</style></head><body><p class="text-primary">Helo World</p> <p class="bg-info">Info</p></body></html>

this is working well, i guess something going on when i use link tag, any suggestion?

jan_blaha

Try to save that html and open it in chrome and print it. You will see the color is removed.
I repeat again

You need to keep in mind that the output PDF typically won't look the same as HTML, because Bootstrap includes different printing styles under @media print.

Also one link here
https://stackoverflow.com/questions/33410724/bootstrap-print-css-removes-background-color/36742058#36742058

Shadowman4205

So it is better use custom styles, what i need for my pdf.

Thank you.

jan_blaha

You can also download bootstrap without print styles and use it.
However I would recommend using custom styles. Bootstrap is great but not designed for static pdf purpose I think.