ARCHIVE/xrpl-dev-portal
1
0
Fork 0
mirror of https://github.com/XRPLF/xrpl-dev-portal.git synced 2025-11-20 11:45:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improve 3-col layout on narrow viewports

Browse Source
This commit is contained in:
mDuo13
2018-04-25 16:48:07 -07:00
parent c87f79174e
commit 9c8ffdf7c5
2 changed files with 16 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
assets/css/devportal.css
View File

@@ -372,12 +372,6 @@ pre code {
list-style-type: none;
}
.dev_nav_wrapper {
position: fixed;
width: 100%;
overflow-y: scroll;
top: 130px;
}
td {
border: 1px solid #dbdde2;
padding: 0.2em;
@@ -713,17 +707,17 @@ th {
max-height: calc(100% - 150px);
max-width: 16.66667%;
overflow: auto;
z-index: 10;
}
/* Responsive design for different viewscreens -------------------------------*/
@media (max-width: 768px) {
.dev_nav_wrapper,
.sidebar {
#page-toc-wrapper {
position: static;
display: block;
clear: both;
overflow-y: inherit;
position: static;
max-width: 100%;
}
.main {
@@ -799,17 +793,6 @@ th {
#goog-gt-tt {
display: none;
}
.dev_nav_wrapper {
position: static !important;
}
.sidebar:before {
display: none !important;
}
.sidebar {
padding-top: 0 !important;
display: block !important;
float: none !important;
}
h1 {
page-break-before: always;
}

22
tool/template-base.html
View File

@@ -70,22 +70,26 @@
<div class="container-fluid" role="document" id="main_content_wrapper">
<div class="row">
{% if currentpage.sidebar != "disabled" %}
<aside class="sidebar col-md-3 col-xl-2 p-0" role="complementary">
{% block left_sidebar %}
{% include "template-sidebar_nav.html" %}
{% endblock %}
<!-- Right sidebar first so it's at the beginning for mobile layouts -->
{% if currentpage.sidebar != "disabled" and currentpage.sidebar != "left_only" %}
<aside class="right-sidebar col-md-3 col-xl-2 p-0 order-md-last" role="complementary">
{% block right_sidebar %}{% endblock %}
</aside>
{% endif %}
<main class="main {% if currentpage.sidebar == "left_only" %}col-md-9 col-xl-10{% elif currentpage.sidebar == "disabled" %}col-md-12 col-xl-12{% else %}col-md-6 col-xl-8{% endif %} p-0" role="main" id="main_content_body">
<!-- main column -->
<main class="main {% if currentpage.sidebar == "left_only" %}col-md-8 col-xl-10{% elif currentpage.sidebar == "disabled" %}col-md-12 col-xl-12{% else %}col-md-6 col-xl-8{% endif %} p-0" role="main" id="main_content_body">
{% block breadcrumbs %}
{% include 'template-breadcrumbs.html' %}
{% endblock %}
{% block main %}{% endblock %}
</main>
{% if currentpage.sidebar != "disabled" and currentpage.sidebar != "left_only" %}
<aside class="right-sidebar col-md-3 col-xl-2 p-0" role="complementary">
{% block right_sidebar %}{% endblock %}
{% if currentpage.sidebar != "disabled" %}
<!-- Left sidebar last so it's at the end for mobile -->
<aside class="sidebar col-md-3 col-xl-2 p-0 order-md-first" role="complementary">
{% block left_sidebar %}
{% include "template-sidebar_nav.html" %}
{% endblock %}
</aside>
{% endif %}
</div>