Improve styling for HTML Export #353
Conversation
… of comma separated string
…o can have same-level links now.
…nto bonus_style_points
* Indent HTML sections based on level Implements doorstop-dev#128 by using the mdx_outline extension for python-markdown, which groups every heading into an appropriate <section> tag according to its header level. * Remove Python 3.3 support * Update dependencies * Update code to comply with latest rules * Remove pipenv workaround * Update tooling * Make output more coherent when using headers In the newly added 'header' beta feature, the header was added on a separate line in the Markdown and HTML outputs, like this: ``` ## 1.1 REQ002 {#REQ002 } ##Header Text ... ``` But the 'text' output does something different and puts the header to the right of the UID. I believe this is the intended format for this feature, so this commit changes the above output to: ``` ## 1.1 REQ002 Header {#REQ002 } Text ... ``` The TOC entry in the HTML output is updated accordingly. * Update wording * Document that Python 3.4+ is required * Add 'header' tags to some of the sample requirements * Add Gitter badge Closes doorstop-dev#286 * Add icon (linux) * Put uid to the right of the title * Only display uid once when no header exists * Allow user to resize font * Make some display only field in the UI uneditable * Add icon (windows) * Fix crashes related to selected item index in the GUI Was occuring when: - There were no item to select - The selected index was greater than the number of items in the new document being selected * main() returns the exit code instead of exiting * surround self.ignore trigger in try finally block * Make uid clickable link in the GUI. This has been done for: - The items text - The children links - The parent links * Replace Listview outline by a Treeview * Fix coding standard issues * Fix GUI tests issues * Fix GUI tests issues * Fix GUI tests issues * Fix GUI tests issues * Fix coding standard issues * Disable PyLint duplicate-code check * Fix coding standard issues * Fix documentation standard issues * Split pylint rules on to separate lines * Bump version to 1.5b1 * Bump version to 1.5b2 * Fix indentation for rST * Update tooling * Update tree styling
This reverts commit 780edde.
Implements doorstop-dev#128 by using the mdx_outline extension for python-markdown, which groups every heading into an appropriate <section> tag according to its header level.
In the newly added 'header' beta feature, the header was added on a
separate line in the Markdown and HTML outputs, like this:
```
## 1.1 REQ002 {#REQ002 }
##Header
Text ...
```
But the 'text' output does something different and puts the header to
the right of the UID. I believe this is the intended format for this
feature, so this commit changes the above output to:
```
## 1.1 REQ002 Header {#REQ002 }
Text ...
```
The TOC entry in the HTML output is updated accordingly.
Was occuring when: - There were no item to select - The selected index was greater than the number of items in the new document being selected
… jacebrowning-develop
…nto bonus_style_points
|
Would like to get some feedback from everyone with regards to the styling first. Then I can update the unit tests to reflect the changes. |
| @@ -522,6 +537,7 @@ def _lines_html(obj, linkify=False, extensions=EXTENSIONS, | |||
|
|
|||
| if toc: | |||
| toc_md = _table_of_contents_md(obj, True) | |||
| toc_md = '[🡨 Index](index.html) \n\n ' + toc_md # Add a link to index | |||
There was a problem hiding this comment.
The character before "Index" doesn't render for me. I just see a [?].
|
I think the new styling looks great! Maybe the index should be wrapped in |
|
I think it looks good too, thanks for making the improvements. If the content of an item, e.g. an image is very wide and you scroll the navbar overlaps the content. Do you now how to fix the navbar vertically but have it scroll off horizontally? The navbar is wider (3) now and the main content narrower which makes the above problem worse. Even before this change we aren't using the full width for some reason. A navbar of 2 columns and a content of 10 would probably be better for my documents but perhaps other people are using longer headings? When I try the -b header option (I handn't noticed this before) I get blank names for items where I haven't added the header attribute yet. This seems to be the desired behaviour but doesn't look great. I think the UID could be displayed if a header isn't defined. I should probably open a separate Issue for that? |
Yes I will look into that.
Is this what you meant?
I have not tested anything with very wide images, since I don't use them myself and there is no sample in the repo for these. Making the content be full width currently also makes all the text become full width. It's easier on the eyes to read multiple shorter lines of text than one long line of text, which would be why I think the template was not using full width. (just my speculation) But for charts or other images, wider content container should be used. I think that should be a different pull request though. I made the navbar width 3 because it can fit it more English words comfortably, and there is more whitespace to separate nav with content. I have no strong feelings if using 2. Ideally the navbar should be collapsible/draggable such that this is a non-issue. |
|
Additionally, we may want to pull the header concept out of "beta" so that document publishing is consistent. |
|
@rickeywang Still working on this? |
|
I think we can close this PR in favour of #371 since @michaelnt has done some work to update the unit tests and fixed the outstanding issues. |
Changed the index page formatting to use sans-serif and default bootstrap styling so it is consistent with other HTML pages that were generated.
<hr>between items for better visibility.<h1>-b headerflag is used for the Header beta feature, then the contents of each item's header will be displayed instead of the item's ID