Generate PDF from specific CSS class WKHTMLTOPDF - css

Is it possible to generate PDF from specific CSS class html with WKHTMLTOPDF?
I need to capture just specific class not for all page
Example :
<div class="chartup">
...
</div>

Related

Is it possible to add R Code inside an HTML tag in RMarkdown?

Is it possible to add R code chunks inside an HTML tag?
For example:
<div class="cards-list">
<div class="stat-card">
<div class="stat-icon right"><span class="bg-ontrack"></span></i></div>
<h3>Impressions</h3>
<h4 class="stat-num"><span class="txt-ontrack">{r code}</span></h4>
</div>
</div>
I need to add an R Code chunk inside an HTML tag here let's say in tag. That means the class should be applied to the output of the R code chunk.
Is this possible?

Save rendered selection with computed CSS

Suppose I want to scrape part of a page to reproduce a particular rendering with, at most, a single CSS.
I can copy the full rendering using browser console commands, but that still produces HTML with classes referencing the CSS stack. E.g.,
<h1 class="x">
<span class="y">Here's a header</span>
</h1>
<div class="z">Here's some more text with a different format</div>
Is there a way to either:
Get all styles expanded inline?
Get all referenced styles defined in a single "computed" CSS block?

Add CSS Class to reStructuredText internal reference

I would like to format an internal link - defined with :ref: - in my documentation using CSS classes.
My problem is that I cannot convert :ref:`Link <internal_link> to the following bit of HTML Link
I've tried defining a new role but that was unsuccessful too.
.. role:: ref
:class: btn btn-sm btn-primary
:ref:`Link <internal_link>`
My current solution is to use raw html and render it as such, but I cannot link the RST files but have to point to the HTML files instead (which doesn't work for PDF output).
.. role:: raw-html(raw)
:format: html
:raw-html:`Link`
Does anyone know how to add custom CSS classes to :ref:?
I'm not sure about getting the class in the link directly. But you should be able to get it in the parent with:
.. cssclass:: btn-primary
:ref:`link`
then adjust the css selector to use:
.btn-primary a

CSS in CKEDITOR - How to make a HTML code like <p><!-- pagebreak --></p> display in red color?

We used tinymce in our application and trying to migrate to CKEDITOR .
All the contents are stored in the database with <p><!-- pagebreak --></p> to do pagebreaking while generating pdf contents.
Now we are trying to migrate to CKEDITOR , the HTML code works fine and pdf generation also works fine . But the problem is that CKEDITOR doesnt display anything display for
<p><!-- pagebreak --></p> - It is like blank in WSIWYG editor .
I need to create a solution wherein CKEDITOR <p><!-- pagebreak --></p> with a CSS display ... like say a RED LINE .
I cant modify the code as it is stored in the DB , hence I need CKEDITOR to do some CSS tricks to display <p><!-- pagebreak --></p> as a red line in its editor
Is what I would do if you truly want to migrate and not have to hack any code would be to convert all the <p><!-- pagebreak --></p> in your database entries to <div class="page-break"></div> and set the css value of
.page-break
{
page-break-after:always`
}
Or to use what CKEDITOR does
<div style="page-break-after: always;">
<span style="display: none;"> </span>
</div>
Unfortunately you cannot style that HTML tag without affecting other content in that field.
You see it is defined as simply a paragraph tag with no class or other defining attributes at all (<p> as opposed to <p class="line-break">). That makes it impossible for you to "hook" your custom style into just those nodes with CSS.
The tag content is simply an HTML comment, which is never displayed and therefore cannot be styled.
You could style this if you are pulling the CK-encoded text from a database using a language like PHP for display, in which case you could do a str_replace for the HTML you noted and virtually injecting a hook such as a class name.
One other option is to use JavaScript to search the HTML for that node and dynamically inject either a class name or another node such as a horizontal rule (<hr>).
Once you have a class on just those paragraphs, the CSS you'd use would be something like:
p.line-break { border-bottom: 2px solid red; }

define mark up for generic sphinx admonitions with a specific title

I am using Sphinx to generate HTML documentation for a Python program.
I would like to use the generic admonition directive with a specific title and have it marked up in a way I can define, for example like content generated with the note directive, i.e., boxed, but with a different color (most Admonitions are not specially styled).
How do I best go about this?
If I understood your question correctly, you'd like to apply a custon CSS style to the admonition. You can do this with a :class: attibute.
For example, the following
.. admonition:: my title goes here
:class: myOwnStyle
this is the admonition text
renders as
<div class="myownstyle admonition">
<p class="first admonition-title">my title goes here</p>
<p class="last">this is the admonition text</p>
</div>
You then add your own style sheet. For example, by a custom layout.html in the _templates directory in your source directory:
{% extends "!layout.html" %}
{% set css_files = css_files + ["_static/customstyle.css"] %}
Then you can play around with CSS styles in your style sheet using a selector for the myownstyle class
To add css files more easily, put them in the _static folder and then add this to conf.py:
def setup(app):
app.add_stylesheet('custom.css')
Here is an example custom.css for overwriting the color of the title and background color of the myownstyle admonition. I used the app.add_stylesheet() call in conf.py.
.rst-content .myownstyle .admonition-title {
background: #b99976
}
.rst-content .myownstyle {
background: #e5d3b3
}

Resources