page fixes (uses container-fluid on main)

This commit is contained in:
Elisabeth Dickinson 2021-03-08 18:18:39 +01:00
parent 1335686c4d
commit f91c2aea27
3 changed files with 24 additions and 25 deletions

View File

@ -79,7 +79,7 @@
{% set main_classes = main_classes + ['doc-toc'] %} {# TODO EDI do you use this ?#} {% set main_classes = main_classes + ['doc-toc'] %} {# TODO EDI do you use this ?#}
{% endif %} {% endif %}
<main class="{{ ' '.join(main_classes) }}"> <main class="container-fluid {{ ' '.join(main_classes) }}">
<div id="o_content"> <div id="o_content">
{% if pagename == master_doc %} {% if pagename == master_doc %}
{# Custom landing page on the root of the documentation #} {# Custom landing page on the root of the documentation #}

View File

@ -240,6 +240,10 @@ $o-side-nav-width: 350px;
$o-on-page-width: 25%; $o-on-page-width: 25%;
$o-header-white: #ffffff; $o-header-white: #ffffff;
// has_code_col pages
$o-halfpage-width: 54%;
$o-codecol-width: 43%;
// Paths and Prefixes // Paths and Prefixes
$website-img-base-url: "../img/"; $website-img-base-url: "../img/";
$website-2x-prefix: "2x_"; $website-2x-prefix: "2x_";

View File

@ -286,12 +286,12 @@ header.o_main_header{
#wrap { #wrap {
margin-top: $o-header-height; margin-top: $o-header-height;
display: flex;
justify-content: space-between;
padding: 0 1rem;
@include media-breakpoint-up(lg) { @include media-breakpoint-up(lg) {
padding: 0; display: flex;
justify-content: space-between;
}
code { code {
display: inline-block; display: inline-block;
color: inherit; color: inherit;
@ -301,6 +301,9 @@ header.o_main_header{
border: 1px solid $gray-light; border: 1px solid $gray-light;
overflow-wrap: anywhere; overflow-wrap: anywhere;
} }
iframe {
max-width: 100%;
} }
main { main {
@ -309,13 +312,14 @@ header.o_main_header{
@include media-breakpoint-up(lg) { @include media-breakpoint-up(lg) {
left: $o-side-nav-width; left: $o-side-nav-width;
width: calc(100vw - #{$o-side-nav-width} - #{$o-on-page-width}); max-width: calc(100vw - (#{$o-side-nav-width} + var(--bs-gutter-x, 1.5rem)) - #{$o-on-page-width});
padding: 3rem; padding: 3rem;
margin: 0;
} }
&.index, &.doc-toc, &.has_code_col { &.index, &.doc-toc, &.has_code_col {
@include media-breakpoint-up(lg) { @include media-breakpoint-up(lg) {
width: calc(100vw - #{$o-side-nav-width} ); max-width: calc(100vw - (#{$o-side-nav-width} + var(--bs-gutter-x, 1.5rem)) );
} }
} }
@ -401,20 +405,10 @@ header.o_main_header{
&.has_code_col { &.has_code_col {
article.doc-body { article.doc-body {
padding-left: 1rem;
padding-right: 1rem;
> *{ > *{
max-width: 100%; max-width: 100%;
} }
section {
position: relative;
display:block;
float: left;
width: 100%;
}
@include media-breakpoint-up(lg) { @include media-breakpoint-up(lg) {
width: 100%; width: 100%;
padding-right: 0; padding-right: 0;
@ -426,20 +420,18 @@ header.o_main_header{
.o_git_link { .o_git_link {
top: .5rem; right: calc(#{$o-codecol-width} + 2rem);
right: calc(43% + 1rem);
} }
section { section {
> * { > * {
width: 54.633333%; width: $o-halfpage-width;
/* max-width: 600px; */
float: left; float: left;
clear: left; clear: left;
} }
> h1 { > h1 {
max-width: calc(54% - 120px); max-width: calc(#{$o-halfpage-width} - 120px);
} }
> h1, > h2, > h3, > h4, > h5, > h6 { > h1, > h2, > h3, > h4, > h5, > h6 {
@ -448,7 +440,7 @@ header.o_main_header{
} }
.doc-aside { .doc-aside {
width: 43%; width: $o-codecol-width;
float: none; float: none;
clear: none; clear: none;
margin-left: 57%; margin-left: 57%;
@ -514,9 +506,12 @@ header.o_main_header{
ul { ul {
list-style: none; list-style: none;
} padding-left: 0;
}
li {
padding-bottom: .5rem;
}
}
} }
/* dt { /* dt {