openstack/openstackdocstheme
Code Issues Proposed changes

Move version dropdown to title line

Browse Source 
Rather than use a specific line for the version dropdown, integrate it
in the docs-actions on the right of the title.

Copy some style elements (previously inherited from docs-byline) to
version-dropdown to preserve style. Play with padding and margins to
achieve proper alignement of actions.

Change-Id: Ib1bf459fda30846635f97878e6ddb05fac0317e3
This commit is contained in:
Thierry Carrez 2019-11-20 15:37:30 +01:00
parent 83efd8115d
commit a4dbd767bf
3 changed files with 22 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
openstackdocstheme/theme/openstackdocs/layout.html
View File

@ -39,21 +39,6 @@ ga('send', 'pageview');
<div class="row">
<div class="col-lg-9 col-md-8 col-sm-8 col-lg-push-3 col-md-push-4 col-sm-push-4">
{% include 'titlerow.html' %}
{%- block otherversions %}
{%- if other_versions %}
<div class="row docs-byline">
<div class="docs-updated">this page last updated: {{ last_updated }}</div>
<div class="version-dropdown">
<span>{{ _('version') }}</span>
<div class="version-dropdown-content">
{%- for ver in other_versions: %}
<p><a href="../{{pathto(ver, 1) }}" rel="nofollow">{{ ver }}</a></p>
{%- endfor %}
</div>
</div>
</div>
{%- endif %}
{%- endblock %}
<div class="row">
<div class="col-lg-12">
<div class="docs-body" role="main">

14
openstackdocstheme/theme/openstackdocs/static/css/combined.css
View File

@ -374,14 +374,20 @@ footer {
/*Docs Version Dropdown*/
.version-dropdown {
font-size: 10px;
color: #9eb5c3;
text-transform: uppercase;
position: relative;
float: right;
display: inline-block;
vertical-align: middle;
margin-right: 8px;
margin-bottom: 6px;
border: solid 1px;
padding: 5px; }
padding: 3px 5px 3px 5px; }
.version-dropdown-content {
display: none;
text-align: left;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
@ -647,7 +653,7 @@ a.docs-sidebar-section-title:hover {
.docs-actions .fa-angle-double-left {
border-left: 1px solid #dae5ee;
color: #DA422F;
padding: 0 10px; }
padding: 0 8px 0 10px; }
.docs-actions .fa-angle-double-left:hover {
color: #9A201D; }
@ -655,7 +661,7 @@ a.docs-sidebar-section-title:hover {
.docs-actions .fa-angle-double-right {
border-left: 1px solid #dae5ee;
color: #DA422F;
padding: 0 10px; }
padding: 0 8px 0 10px; }
.docs-actions .fa-angle-double-right:hover {
color: #9A201D; }

12
openstackdocstheme/theme/openstackdocs/titlerow.html
View File

@ -7,6 +7,18 @@
{%- endif %}
</div>
<div class="docs-actions">
{%- block otherversions %}
{%- if other_versions %}
<div class="version-dropdown">
<span>{{ _('version') }}</span>
<div class="version-dropdown-content">
{%- for ver in other_versions: %}
<p><a href="../{{pathto(ver, 1) }}" rel="nofollow">{{ ver }}</a></p>
{%- endfor %}
</div>
</div>
{%- endif %}
{%- endblock %}
{% if prev %}
<a href="{{ prev.link|e }}"><i class="fa fa-angle-double-left" data-toggle="tooltip" data-placement="top" title="Previous: {{ prev.title|striptags }}"></i></a>
{% endif %}