Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Provide a convenient way to add custom CSS styles #7

Open
danijar opened this issue Aug 5, 2019 · 9 comments
Open

Provide a convenient way to add custom CSS styles #7

danijar opened this issue Aug 5, 2019 · 9 comments
Labels

Comments

@danijar
Copy link
Owner

danijar commented Aug 5, 2019

Adding custom CSS is possible in two ways:

doc.add_html('<style></style>')
doc.add_html('<link rel="stylesheet" href="path/to/style.css">')

We could add doc.add_style(filename) that copies the file into the output directory for the user.

@danijar danijar added the feature label Aug 5, 2019
@sonwanesuresh95
Copy link

Should we add stylesheet from a path or have it in data folder so that we can copy it to output folder?

@epogrebnyak
Copy link
Contributor

epogrebnyak commented Aug 12, 2019

doc.add_style("path/to/style.css") can p0ssibly do the copying from any path, not necessarily the data folder.

@sonwanesuresh95
Copy link

I've function ready for this, should I push and create a PR?

@epogrebnyak
Copy link
Contributor

@danijar - are you ready for a PR on this feature?

@danijar
Copy link
Owner Author

danijar commented Aug 12, 2019

This sounds good. The PR should also change the Handout class to add the existing default styles this way if possible.

The only question I have remaining here is how to handle HTML-only features if we plan to add support for LaTeX in the future. The original plan was to have all functions work for all backends except add_html() and add_latex(). One answer would be to have add_html(style=path) as API rather than add_style(path). What do you think?

@RAJAT--PALIWAL
Copy link

RAJAT--PALIWAL commented Aug 13, 2019

@danijar @sonwanesuresh95 @epogrebnyak Would it not be better to move every stylesheet and script file in output folder first and then iterate through them to generate the basic structure using _generate().

For example:
if there are 3 stylesheets, style.css, bootstrap.css and highlight.css
Then,
While iterating output folder, we can find them and run a loop to get.
['<link rel="stylesheet" href="style.css">', '<link rel="stylesheet" href="bootstrap.css">', '<link rel="stylesheet" href="highlight.css">']

and we can append them to <head> in _generate()

@danijar
Copy link
Owner Author

danijar commented Aug 14, 2019

That would mean all JS files that happen to be in the output directory will be included in the HTML head, right?

@RAJAT--PALIWAL
Copy link

Yes, this is correct.

@danijar
Copy link
Owner Author

danijar commented Aug 16, 2019

I thought quite a bit about the implementation of this now:

  • Going forward we'll move the everything HTML related to an exporter class to also support generating LaTeX outputs. Thus, we should keep everything that's HTML specific in either add_html() or in _generate().
  • To keep things simple, let's not change how the default scripts are included in the header for now. We can add user scripts and styles in the body of the HTML document using the existing HTML block.
  • For this, we need a _add_file(path) method. If path is a URL, it should download the file and otherwise copy it to self._directory / path.name.

I suggest as API to add scripts and styles:

def add_html(string=None, style=None, script=None, show=False):
  if bool(string) = bool(style) + bool(script) != 1:
    raise KeyError('Should provide exactly one of string, style, script arguments.')
  if style:
    self._add_file(style)
    string = '<link rel="stylesheet" href="{}">'.format(style)
  if script:
    self._add_file(script)
    string = '<script src="{}">'.format(script)
  # Existing function body...

What do you think? Happy to discuss.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

4 participants