NextERP/documentation
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[DESIGN]

Browse Source
This commit is contained in:
Elisabeth Dickinson 2021-03-04 16:48:42 +01:00
parent e74e754ace
commit b8288b7fd1
3 changed files with 192 additions and 144 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
extensions/odoo_theme/static/scss/_sphinx_basic.scss
View File

@ -22,7 +22,7 @@ div.section::after {
}
/* -- relbar ---------------------------------------------------------------- */
/*
div.related {
width: 100%;
font-size: 90%;
@ -45,7 +45,7 @@ div.related li {
div.related li.right {
float: right;
margin-right: 5px;
}
} */
/* -- search page ----------------------------------------------------------- */
@ -54,12 +54,12 @@ ul.search {
padding: 0;
}
ul.search li {
/* ul.search li {
padding: 5px 0 5px 20px;
background-image: url(file.png);
background-repeat: no-repeat;
background-position: 0 7px;
}
} */
ul.search li a {
font-weight: bold;
@ -205,7 +205,6 @@ div.body td {
}
p.rubric {
margin-top: 30px;
font-weight: bold;
}
@ -241,9 +240,9 @@ img.align-default, .figure.align-default {
text-align: center;
}
.align-default {
/* .align-default {
text-align: center;
}
} */
.align-right {
text-align: right;
@ -266,9 +265,9 @@ p.sidebar-title {
font-weight: bold;
}
div.admonition, div.topic, blockquote {
/* div.admonition, div.topic, blockquote {
clear: left;
}
} */
/* -- topics ---------------------------------------------------------------- */
@ -308,20 +307,20 @@ div.body p.centered {
/* -- content of sidebars/topics/admonitions -------------------------------- */
div.sidebar > :last-child,
/* div.sidebar > :last-child,
div.topic > :last-child,
div.admonition > :last-child {
margin-bottom: 0;
}
} */
div.sidebar::after,
/* div.sidebar::after,
div.topic::after,
div.admonition::after,
blockquote::after {
display: block;
content: '';
clear: both;
}
} */
/* -- tables ---------------------------------------------------------------- */
@ -392,9 +391,9 @@ div.figure {
padding: 0.5em;
}
div.figure p.caption {
/* div.figure p.caption {
padding: 0.3em;
}
} */
div.figure p.caption span.caption-number {
font-style: italic;
@ -548,9 +547,9 @@ dl > dd:last-child > :last-child {
margin-bottom: 0;
}
dt:target, span.highlighted {
/* dt:target, span.highlighted {
background-color: #fbe54e;
}
} */
rect.highlighted {
fill: #fbe54e;
@ -595,9 +594,9 @@ dl.glossary dt {
margin-left: 1.5em;
}
.guilabel, .menuselection {
/* .guilabel, .menuselection {
font-family: sans-serif;
}
} */
.accelerator {
text-decoration: underline;
@ -613,10 +612,10 @@ dl.glossary dt {
content: ":";
}
abbr, acronym {
/* abbr, acronym {
border-bottom: dotted 1px;
cursor: help;
}
} */
/* -- code displays --------------------------------------------------------- */
@ -672,9 +671,9 @@ table.highlighttable td.code {
overflow: hidden;
}
.highlight .hll {
/* .highlight .hll {
display: block;
}
} */
div.highlight pre,
table.highlighttable pre {
@ -716,17 +715,17 @@ div.literal-block-wrapper {
code.descname {
background-color: transparent;
font-weight: bold;
font-size: 1.2em;
/* font-size: 1.2em; */
}
code.descclassname {
background-color: transparent;
}
code.xref, a code {
/* code.xref, a code {
background-color: transparent;
font-weight: bold;
}
} */
h1 code, h2 code, h3 code, h4 code, h5 code, h6 code {
background-color: transparent;

1
extensions/odoo_theme/static/scss/bootstrap_overridden.scss vendored
View File

@ -28,6 +28,7 @@ $display-line-height: 1;
//
// For each of Bootstrap's buttons, define text, background, and border color.
$btn-font-size: $font-size-secondary;
$btn-font-weight: $fw_semibold;
$btn-focus-box-shadow: 0 0 0 transparent;

284
extensions/odoo_theme/static/style.scss
View File

@ -70,32 +70,12 @@ header.o_main_header{
}
.highlight-link {
cursor: pointer;
margin-bottom: 0;
display: inline-flex;
display: flex;
align-items: center;
a {
color: transparent;
text-decoration: none;
transition: .3s;
transition-delay: .5s;
&:before {
content:'\00d7';
display: inline-block;
font-weight: $fw_bold;
@include font-size($font-size-base);
width: 21px;
border-radius: 30px;
line-height: 21px;
background: $gray-light;
color: $white;
text-align: center;
margin: auto .5rem;
}
}
a:hover {
color: $gray
padding: 0 1rem;
@include font-size($font-size-secondary);
}
}
.o_languages {
@ -220,6 +200,11 @@ header.o_main_header{
&:not(.toctree-l1) {
.o_toc_entry_wrapper {
&:not(.o_page_toc_title) {
display: flex;
align-items: baseline;
}
> i[class^="i-"] {
display: inline-block;
margin-right: .2rem;
@ -268,7 +253,7 @@ header.o_main_header{
font-weight: $fw_bold;
color: $gray-darker;
padding-left: .5rem;
margin-bottom: 0;
margin-bottom: .5rem;
}
a {
@ -395,6 +380,8 @@ header.o_main_header{
&.has_code_col {
article.doc-body {
padding-left: 1rem;
padding-right: 1rem;
> *{
max-width: 100%;
@ -415,8 +402,11 @@ header.o_main_header{
@include code-col();
}
.o_git_link {
left: 53%;
top: .5rem;
right: calc(43% + 1rem);
}
section {
@ -427,6 +417,10 @@ header.o_main_header{
clear: left;
}
> h1 {
max-width: calc(54% - 120px);
}
> h1, > h2, > h3, > h4, > h5, > h6 {
float: none;
clear: none;
@ -440,15 +434,10 @@ header.o_main_header{
padding: 1rem;
blockquote {
font-family: $font-family-serif;
font-weight: $fw_semibold;
font-style: italic;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
color: $white;
}
pre {
font-size: 12px;
}
@ -483,29 +472,47 @@ header.o_main_header{
}
}
article {
article.doc-body {
position: relative;
.o_git_link {
@include font-size($font-size-secondary);
@include o-position-absolute($top: 1rem, $right: 1rem);
@include o-position-absolute($top: calc(#{$o-header-height} + 1rem), $right: 1rem);
i {
margin-right: .2rem;
}
}
.command {
font-family: var(--bs-font-monospace);
}
.field-list {
@include font-size($font-size-secondary);
padding: .5rem;
border: 1px solid $gray-light;
ul {
list-style: none;
}
}
code {
display: inline-block;
color: inherit;
background: $doc_code-bg;
padding: 0 .3rem;
margin: 0.1rem;
border: 1px solid $gray-light;
}
dt {
/* dt {
&:before {
@include scroll-padding()
}
} */
// Search items highlighted
dt:target, span.highlighted {
background-color: lighten($color-alpha, 50%);
}
section {
@ -521,17 +528,27 @@ header.o_main_header{
color: $o-violet-dark;
font-weight: $fw_bold;
max-width: calc(100% - 120px);
+ p {
margin-top: 1rem;
}
}
> h2 {
font-family: $font-family-serif;
color: $gray-darker;
padding-bottom: .5rem;
margin-top: .5rem;
margin-bottom: 1.5rem;
padding-bottom: .3rem;
border-bottom: 1px solid $gray-light;
}
> h3 {
color: $gray-darkest;
font-weight: $fw_extrabold;
font-weight: $fw_bold;
}
> h4, > h5, > h6 {
font-weight: $fw_semibold;
}
a.headerlink {
@ -549,19 +566,15 @@ header.o_main_header{
@include o-transition(all, .1s)
}
}
// This makes permalinks only visible on hover.
h1, h2, h3, h4, h5, h6, dt, caption, p.caption, div.code-block-caption {
&:hover > a.headerlink:after{
// This makes permalinks only visible on hover.
visibility: visible;
opacity: 1;
}
}
}
.img-fluid {
margin-bottom: 1rem;
}
}
div[class^="highlight"] {
@ -569,6 +582,7 @@ header.o_main_header{
overflow-x: auto;
border: 1px solid $gray-light;
margin: 1px 0 24px 0;
max-width: 90vw;
div[class^="highlight"] {
padding: 0px;
@ -583,29 +597,87 @@ header.o_main_header{
overflow: auto;
}
}
// fixes on pages
.guilabel, .menuselection {
font-weight: $fw_semibold;
}
.dfn{
@include font-size($font-size-secondary);
line-height: 1;
color: $o-violet;
font-weight: $fw_semibold;
&:before {
content:'?';
display: inline-block;
width: 15px;
height: 15px;
background-color: $o-violet;
border: 1px solid $o-violet;
border-radius: 20px;
text-align: center;
color: $white;
font-weight: $fw_extrabold;
margin: 0 .2rem;
}
}
.pq-patch em {
display: block;
border-radius: 4px 4px 0 0;
background: $gray-lighter;
padding: .2rem 1rem;
@include font-size($font-size-secondary);
font-weight: 600;
}
img.img-fluid:not([alt="green"]):not([alt="orange"]):not([alt="red"]) {
border: 1px solid $gray-lighter;
background: $white;
margin-bottom: 1rem;
padding: .5rem;
}
.container .container:not([class^="col"]) {
padding: 0;
margin: 0;
}
ul, ol {
text-align: left;
}
.figure {
.caption, .caption-text {
font-weight: $fw_semibold;
color: $gray;
}
.caption, .caption-text, .legend, .legend p{
font-style: italic;
margin: 0 auto;
}
&:not([class^="col"]) .legend {
max-width: 60%;
}
}
// restyle numbers on lists
ol {
list-style: none;
/* list-style: none;
counter-reset: a;
> li {
position: relative;
counter-increment: a;
&:before {
content: counter(a);
color: $o-violet;
border: 2px solid $o-violet;
@include font-size($font-size-secondary);
font-weight: bold;
line-height: 1;
text-align: center;
padding: 1px 0;
width: 20px;
height: 20px;
border-radius: 10px;
@include o-position-absolute(2px, auto, auto, -2rem);
content: counter(a) '.';
font-weight: $fw_semibold;
@include o-position-absolute(auto, auto, auto, -1.8rem);
}
} */
ol {
list-style: lower-alpha;
> li:before {
content: none;
}
}
}
@ -618,7 +690,7 @@ header.o_main_header{
// alert-danger
// alert-go_to
// alert-exercise
// alert-success
// alert-success // removed : never used in doc
.alert {
position: relative;
display: block;
@ -626,7 +698,14 @@ header.o_main_header{
border-width: 0 0 0 3px;
@include font-size($font-size-secondary);
code {
background-color: $white !important;
}
> p , > ul{
margin-bottom: .5rem;
}
> *:last-child {
margin-bottom: 0;
}
@ -637,92 +716,63 @@ header.o_main_header{
font-weight: $fw_bold;
&:before {
@include inline-icomoon($i-info, 0 .2rem 0 0);
@include inline-icomoon($i-info, 0 .2rem 0 0, baseline, $font-size-base, inherit);
@include media-breakpoint-down(md) {
display:none;
}
}
}
&.alert-success {
border-color: lighten($brand-success, 30%);
background-color: lighten($brand-success, 45%);
color: darken($brand-success, 35%);
> .alert-title, > h3 {
color: $brand-success
}
> .alert-title:before, > h3:before {
content: '#{$i-check}';
}
}
&.alert-info {
&.alert-info, &[class^="admonition"] {
border-color: tint-color($brand-info, 30%);
background-color: tint-color($brand-info, 85%);
color: shade-color($brand-info, 35%);
> .alert-title, > h3 {
color: $brand-info
}
> .alert-title:before, > h3:before {
content: '#{$i-info}';
color: $brand-info;
&:before {
content: '#{$i-info}';
}
}
}
&.alert-note {
border-color: tint-color($brand-info, 30%);
background-color: tint-color($brand-info, 85%);
color: shade-color($brand-info, 35%);
border-color: shade-color($info, 30%);
background-color: $gray-lightest;
color: shade-color($info, 55%);
> .alert-title, > h3 {
color: $brand-info
color: shade-color($info, 45%);
&:before {
content: '#{$i-note}';
}
}
> .alert-title:before, > h3:before {
content: '#{$i-note}';
}
}
&.alert-tip, &.tip {
border: none;
background-color: tint-color($info, 85%);
color: shade-color($info, 65%);
padding-left:3rem;
padding-right: 2rem;
margin-left: -3rem;
margin-right: -2rem;
border-color: shade-color($color-alpha, 10%);
background-color: $gray-lightest;
color: shade-color($color-alpha, 55%);
> .alert-title, > h3 {
color: shade-color($info, 50%);
display: inline-block;
margin-bottom: 0;
margin-right: .5rem;
color: shade-color($color-alpha, 40%);
&:before {
content: '#{$i-lightbulb}';
vertical-align: text-top;
@include font-size(1.2rem);
}
&:after {
content: ':';
}
}
> p {
display: inline-block;
}
}
&.alert-warning, &.warning {
border-color: $warning;
border-color: $brand-warning;
> .alert-title, > h3 {
color: $brand-warning;
}
> .alert-title:before, > h3:before {
content: '#{$i-warning}';
color: shade-color($brand-warning, 10%);
&:before {
content: '#{$i-warning}';
}
}
}
@ -730,11 +780,10 @@ header.o_main_header{
border-color: $danger;
> .alert-title, > h3 {
color: $brand-danger
}
> .alert-title:before, > h3:before {
content: '#{$i-danger}';
color: darken($brand-danger,20%);
&:before {
content: '#{$i-danger}';
}
}
}
@ -754,20 +803,19 @@ header.o_main_header{
&.alert-go_to {
display: inline-block;
border-color: tint-color($secondary, 60%);
background-color: tint-color($secondary, 80%);
border-width: 2px;
border-color: $o-violet;
background-color: $gray-lightest;
width: calc(50% - 1rem);
a {
color: shade-color($secondary, 35%);
color: $o-violet-dark;
}
> .alert-title, > h3 {
color: $secondary;
color: $o-violet-dark;
}
> .alert-title:before, > h3:before {
content: '#{$i-view-more}';
content: '#{$i-arrow-right}';
}
}
}