Footer issue in search-before-header template
Post here questions and problems related to editing and publishing DITA content.
-
- Posts: 55
- Joined: Tue Mar 13, 2018 6:07 pm
Footer issue in search-before-header template
Post by steinbacherGE »
We have added the search-before-header template to our GE custom template and the search field is working as expected. Thank you very much for adding this customization!
https://github.com/oxygenxml/oxygen-pub ... ore-header
But, we are now seeing an issue with the footer for larger bookmaps that have several chapters. It looks like this is related to the footer-fix.css file.
The footer is not getting pushed down to the bottom of the page for large bookmaps (tiles or toc). It hovers over the content links on the main page.
Any suggestions?
Thanks,
Leroy Steinbacher
https://github.com/oxygenxml/oxygen-pub ... ore-header
But, we are now seeing an issue with the footer for larger bookmaps that have several chapters. It looks like this is related to the footer-fix.css file.
The footer is not getting pushed down to the bottom of the page for large bookmaps (tiles or toc). It hovers over the content links on the main page.
- whfooter-toc.png (27.83 KiB) Viewed 1847 times
- whfooter-tiles.png (26.56 KiB) Viewed 1847 times
Thanks,
Leroy Steinbacher
Re: Footer issue in search-before-header template
Hello,
I have fixed the position of the footer section and pushed the changes to the samples repository.
In footer-fix.css I have replaced:
with
Please let me know if the issue still occurs on your side.
You can also remove the footer-fix.css file from your template as it is out of scope of the search-before-header Publishing template.
I have included it in the template to avoid the footer section not being pushed to the bottom of the page when the height of the page content was smaller than the height of the viewport.
Regards,
Alin
I have fixed the position of the footer section and pushed the changes to the samples repository.
In footer-fix.css I have replaced:
Code: Select all
body {
height: 100vh;
}
Code: Select all
body {
min-height: 100vh;
}
You can also remove the footer-fix.css file from your template as it is out of scope of the search-before-header Publishing template.
I have included it in the template to avoid the footer section not being pushed to the bottom of the page when the height of the page content was smaller than the height of the viewport.
Regards,
Alin
Alin Balasa
Software Developer
<oXygen/> XML Editor
http://www.oxygenxml.com
Software Developer
<oXygen/> XML Editor
http://www.oxygenxml.com
-
- Posts: 55
- Joined: Tue Mar 13, 2018 6:07 pm
Re: Footer issue in search-before-header template
Post by steinbacherGE »
Thanks for the fix. This resolves the issue.
I have one more question. In the search-in-header template, is it possible to force the search input field to the right hand side instead of wrapping down to the second, or third line?
Thanks,
Leroy
I have one more question. In the search-in-header template, is it possible to force the search input field to the right hand side instead of wrapping down to the second, or third line?
- search-in-header.png (23.57 KiB) Viewed 1823 times
Thanks,
Leroy
Re: Footer issue in search-before-header template
Hello,
I have updated the template as follows:
- Main flex items in the header section (title, menu + index terms link, search input) will not wrap
- The content within each item can still wrap independently (e.g.: menu items will warp on multiple lines if there is no enough space)
- Title and search input have a minimum width (150px) - if the title exceeds this width and there is no space available it will also wrap on multiple lines
search-in-header.css additions:
Regards,
Alin
I have updated the template as follows:
- Main flex items in the header section (title, menu + index terms link, search input) will not wrap
- The content within each item can still wrap independently (e.g.: menu items will warp on multiple lines if there is no enough space)
- Title and search input have a minimum width (150px) - if the title exceeds this width and there is no space available it will also wrap on multiple lines
search-in-header.css additions:
Code: Select all
@media only screen and (min-width : 768px) {
.wh_top_menu_and_indexterms_link.navbar-collapse {
display: flex !important;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
}
.wh_header_flex_container {
flex-wrap: nowrap;
}
.wh_header_flex_container .wh_search_input {
padding-left: 1em;
min-width: 150px;
}
.wh_publication_title {
min-width: 150px;
}
}
Alin
Alin Balasa
Software Developer
<oXygen/> XML Editor
http://www.oxygenxml.com
Software Developer
<oXygen/> XML Editor
http://www.oxygenxml.com
-
- Posts: 55
- Joined: Tue Mar 13, 2018 6:07 pm
Re: Footer issue in search-before-header template
Post by steinbacherGE »
Thanks for the update. This is a great improvement.
Re: Footer issue in search-before-header template
Hi Alin,
Leroy has left the company and I'm looking at this feature implementation. One thing I notice is that when we use the search and the predictive text displays, if there are chapter titles underneath, they aren't covered up by the predictive box.
Is it something that can be adjusted in the CSS?
Justin
Leroy has left the company and I'm looking at this feature implementation. One thing I notice is that when we use the search and the predictive text displays, if there are chapter titles underneath, they aren't covered up by the predictive box.
- PredictiveTextBleeding.png (21.34 KiB) Viewed 1656 times
Justin
- Attachments
-
- PredictiveTextBleeding.png (21.34 KiB) Viewed 1656 times
Re: Footer issue in search-before-header template
Hi Justin,
You can fix the issue by increasing the "z-index" property of the pop-up menu in CSS.
For example:
I have also updated our templates samples.
Regards,
Alin
You can fix the issue by increasing the "z-index" property of the pop-up menu in CSS.
For example:
Code: Select all
.ui-autocomplete {
z-index: 10000;
}
Regards,
Alin
Alin Balasa
Software Developer
<oXygen/> XML Editor
http://www.oxygenxml.com
Software Developer
<oXygen/> XML Editor
http://www.oxygenxml.com
Return to “DITA (Editing and Publishing DITA Content)”
Jump to
- Oxygen XML Editor/Author/Developer
- ↳ Feature Request
- ↳ Common Problems
- ↳ DITA (Editing and Publishing DITA Content)
- ↳ SDK-API, Frameworks - Document Types
- ↳ DocBook
- ↳ TEI
- ↳ XHTML
- ↳ Other Issues
- Oxygen XML Web Author
- ↳ Feature Request
- ↳ Common Problems
- Oxygen Content Fusion
- ↳ Feature Request
- ↳ Common Problems
- Oxygen JSON Editor
- ↳ Feature Request
- ↳ Common Problems
- Oxygen PDF Chemistry
- ↳ Feature Request
- ↳ Common Problems
- Oxygen Feedback
- ↳ Feature Request
- ↳ Common Problems
- Oxygen XML WebHelp
- ↳ Feature Request
- ↳ Common Problems
- XML
- ↳ General XML Questions
- ↳ XSLT and FOP
- ↳ XML Schemas
- ↳ XQuery
- NVDL
- ↳ General NVDL Issues
- ↳ oNVDL Related Issues
- XML Services Market
- ↳ Offer a Service