Inject CSS and script

[ghost]

In the configuration file, it would be nice to be able to set css and scripts to inject in the page. This way we could easily customize the style to fit our needs.

You can simply add them at the end of the head tag.

[peteruithoven]

+1 on this one.
I'd like to help out, @jeromegn, do you have a preference on how this would work?

I don't have experience with coffeescript or eco but looking through the code, it looks like we could add a css property with an array to the .documentup.json file. Then we can loop over these in the default.eco file.

[peteruithoven]

This would require online css files btw.

[peteruithoven]

Adding the following to the default.eco file:

<% if @project.config.css_files.length: %>
  <% for css_file in @project.config.css_files: %>
    <link rel="stylesheet" type="text/css" href="css_file">
  <% end %>
<% end %>

And defining the css_files as follows in the .documentup.json might work.

{
"name": "My docs",
"css_files" : ["https://mywebsite/doc/style.css"]
}

[peteruithoven]

If you are curious, these where my css tweaks. They are kind of specific for a bigger and deeper readme.

/* Create more destinction between h3 and h4 */
h2 {
  border-bottom: 2px solid #BBB;
}
h3 {
  color: #CC333F;
}
/* Make nav float and separately scrollable */
#nav {
  position: fixed;
  top: 0px;
  height: 90%;
  overflow-y: auto;
}
#content {
  margin-left: 260px
}
@media only screen and (max-width : 480px) {
  #container {
    margin: 0;
  }
  #nav {
    position: static;
  }
}
/* Make nav more compact */
#nav #sections ul {
  margin-bottom: 5px;
}
#nav #sections > li > a {
  padding: 3px 0px; 
}
#nav #sections ul li a {
  padding: 0px 15px;
}