Cutlery/calibre
1
0
Fork 0
mirror of https://github.com/kovidgoyal/calibre.git synced 2025-07-07 10:14:46 -04:00
Code Issues Packages Projects Releases Wiki Activity

Better fix for static top nav bar

Browse Source 
Use CSS grids. The earlier solution caused links to go to slightly
incorrect positions.
This commit is contained in:
Kovid Goyal 2020-11-27 13:21:51 +05:30
parent 5a69e8841c
commit 197ec8c441
No known key found for this signature in database
GPG Key ID: 06BC317B515ACE7C
2 changed files with 72 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
manual/resources/custom.css
View File

@ -5,32 +5,6 @@
* Distributed under terms of the GPLv3 license. * Distributed under terms of the GPLv3 license.
*/ */
@media screen and (max-width: 875px) {
body {
padding-top: 0;
padding-bottom: 0;
}
div.related { display: none; }
ul { margin-left: 0.75em; } /* fix bullets being displayed outside container */
}
@media screen and (min-width: 876px) {
div.related {
height: 3.5ex;
display: flex;
align-items: center;
box-sizing: border-box;
position: fixed; top: 0
}
div.related > ul { flex-grow: 10; }
div.sphinxsidebar { overflow-y: auto; max-height: calc(100vh - 25px) }
div.document { margin-top: 3.5ex; }
}
div.document, div.footer {
width: auto; /* fix horizontal scrollbar if screen is less that 940px */
}
pre, code { pre, code {
white-space: pre-wrap; white-space: pre-wrap;
} }

89
manual/templates/layout.html
View File

@ -1,6 +1,7 @@
{% extends "!layout.html" %} {% extends "!layout.html" %}
{%- block extrahead %} {%- block extrahead %}
{% if not embedded %}
<!-- Quantcast Choice. Consent Manager Tag v2.0 (for TCF 2.0) --> <!-- Quantcast Choice. Consent Manager Tag v2.0 (for TCF 2.0) -->
<!-- See https://www.quantcast.com/protect/sites username is email --> <!-- See https://www.quantcast.com/protect/sites username is email -->
<script type="text/javascript" async=true> <script type="text/javascript" async=true>
@ -169,20 +170,64 @@
!function(a,b){var c=b.getElementsByTagName("script")[0],d=b.createElement("script"),e="https://a.pub.network/manual-calibre-ebook-com";e+=freestar.debug?"/qa/pubfig.min.js":"/pubfig.min.js",d.async=!0,d.src=e,c.parentNode.insertBefore(d,c)}(window,document); !function(a,b){var c=b.getElementsByTagName("script")[0],d=b.createElement("script"),e="https://a.pub.network/manual-calibre-ebook-com";e+=freestar.debug?"/qa/pubfig.min.js":"/pubfig.min.js",d.async=!0,d.src=e,c.parentNode.insertBefore(d,c)}(window,document);
freestar.initCallback = function () { (freestar.config.enabled_slots.length === 0) ? freestar.initCallbackCalled = false : freestar.newAdSlots(freestar.config.enabled_slots) } freestar.initCallback = function () { (freestar.config.enabled_slots.length === 0) ? freestar.initCallbackCalled = false : freestar.newAdSlots(freestar.config.enabled_slots) }
</script> </script>
<style type="text/css">
@media screen and (max-width: 875px) {
body {
padding-top: 0;
padding-bottom: 0;
}
div.related { display: none; }
ul { margin-left: 0.75em; } /* fix bullets being displayed outside container */
}
@media screen and (min-width: 876px) {
body {
display: grid;
grid-template-rows: [top] 3.5ex [r] auto;
grid-template-columns: [left] 220px [c] auto;
height: 100vh; width: 100vw;
max-height: 100vh; max-width: 100vw;
}
div.related {
height: 3.5ex;
display: flex;
align-items: center;
box-sizing: border-box;
grid-row-start: top; grid-row-end: span 1;
grid-column-start: left; grid-column-end: span 2;
}
div.documentwrapper {
grid-row-start: r; grid-row-end: span 1;
grid-column-start: c; grid-column-end: span 1;
overflow: auto;
}
div.related > ul { flex-grow: 10; }
div.sphinxsidebar {
overflow-y: auto;
grid-row-start: r; grid-row-end: span 1;
grid-column-start: left; grid-column-end: span 2;
position: static;
}
div.document { margin-top: 0; }
}
div.document, div.footer {
width: auto; /* fix horizontal scrollbar if screen is less that 940px */
}
</style>
{% endif %}
{% endblock %} {% endblock %}
{%- block relbar1 %}{{ relbar() }}{% endblock %} {%- block relbar1 %}{{ relbar() }}{% endblock %}
{%- block content %} {%- block content %}
<div class="document">
{{ sidebar() }} {{ sidebar() }}
{%- block document %} {%- block document %}
<div class="documentwrapper"> <div class="documentwrapper">
{%- if render_sidebar %} <div class="body" role="main">
<div class="bodywrapper">
{%- endif %}
{% if not embedded %} {% if not embedded %}
<div class="body" role="main">
<div id="ad-container" style="text-align:center"> <div id="ad-container" style="text-align:center">
<div align="center" data-freestar-ad="__970x90 __336x280" id="manualcalibre-ebook_leaderboard_atf"> <div align="center" data-freestar-ad="__970x90 __336x280" id="manualcalibre-ebook_leaderboard_atf">
<script data-cfasync="false" type="text/javascript"> <script data-cfasync="false" type="text/javascript">
@ -190,16 +235,26 @@
</script> </script>
</div> </div>
</div> </div>
{% endif %} {% endif %}
{% block body %} {% endblock %} {% block body %} {% endblock %}
</div> <div class="footer" role="contentinfo">
{%- if render_sidebar %} {%- if show_copyright %}
</div> {%- if hasdoc('copyright') %}
{%- endif %} {% trans path=pathto('copyright'), copyright=copyright|e %}&#169; <a href="{{ path }}">Copyright</a> {{ copyright }}.{% endtrans %}
</div> {%- else %}
{%- endblock %} {% trans copyright=copyright|e %}&#169; Copyright {{ copyright }}.{% endtrans %}
<div class="clearer"></div> {%- endif %}
</div> {%- endif %}
{%- endblock %} {%- if last_updated %}
{% trans last_updated=last_updated|e %}Last updated on {{ last_updated }}.{% endtrans %}
{%- endif %}
{%- if show_sphinx %}
{% trans sphinx_version=sphinx_version|e %}Created using <a href="https://www.sphinx-doc.org/">Sphinx</a> {{ sphinx_version }}.{% endtrans %}
{%- endif %}
</div> <!-- end content-footer -->
</div> <!-- end class="body" -->
</div> <!-- end documentwrapper -->
{%- endblock document %}
{%- endblock content %}
{%- block footer -%} {%- endblock footer -%}