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

[IMP][CSS] Cleanup admonitions (alerts)

Browse Source
This commit is contained in:
Elisabeth Dickinson 2022-12-15 13:46:18 +01:00 committed by Antoine Vandevenne (anv)
parent 0f911e984b
commit 5b6705fecc
3 changed files with 64 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -70,3 +70,10 @@ $accordion-button-bg: $accordion-bg !default;
$accordion-button-active-bg: $accordion-button-bg !default; $accordion-button-active-bg: $accordion-button-bg !default;
$accordion-icon-transform: rotate(0deg) !default; $accordion-icon-transform: rotate(0deg) !default;
//Alert
$alert-border-width: 3px;
$alert-border-scale: 0;
$alert-border-radius: 0 3px 3px 0;
$alert-bg-scale: -87%;
$alert-color-scale: 40%;

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

@ -906,21 +906,8 @@ header {
//------------------------------------------------------------------------------ //------------------------------------------------------------------------------
// Alerts // Alerts
//------------------------------------------------------------------------------ //------------------------------------------------------------------------------
// alert-info
// alert-note
// alert-tip
// alert-warning
// alert-danger
// alert-example
// alert-exercise
// alert-go_to
.alert { .alert {
position: relative; border-width: 0 0 0 $alert-border-width;
display: inline-block;
border-radius: 0;
border-width: 0 0 0 3px;
width: 100%;
@include font-size($font-size-secondary); @include font-size($font-size-secondary);
code, div[class^="highlight"] { code, div[class^="highlight"] {
@ -932,6 +919,7 @@ header {
> p , > ul { > p , > ul {
margin-bottom: .5rem; margin-bottom: .5rem;
} }
> *:last-child { > *:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
@ -950,133 +938,88 @@ header {
} }
} }
&.alert-info, &[class^="admonition"] { // Custom Admonitions
border-color: tint-color($brand-info, 30%); &[class^="admonition"] {
background-color: tint-color($brand-info, 85%); @extend .alert-info;
color: shade-color($brand-info, 35%);
> .alert-title, > h3 { code, div[class^="highlight"] {
color: $brand-info; border-color: tint-color($info, 30%);
&:before { }
content: '#{$i-info}'; }
}
// Note
&.alert-primary {
> .alert-title:before, > h3:before {
content: '#{$i-note}';
} }
code, div[class^="highlight"] { code, div[class^="highlight"] {
border-color: tint-color($brand-info, 30%); border-color: tint-color($primary, 30%);
} }
} }
&.alert-note { // See Also
border-color: shade-color($info, 30%); &.alert-secondary {
background-color: $gray-lightest; > .alert-title:before, > h3:before {
color: shade-color($info, 55%); content: '#{$i-arrow-right}';
> .alert-title, > h3 {
color: shade-color($info, 45%);
&:before {
content: '#{$i-note}';
}
} }
}
&.alert-tip, &.tip { a {
border-color: shade-color($color-alpha, 10%); color: $secondary;
background-color: $gray-lightest;
color: shade-color($color-alpha, 55%);
> .alert-title, > h3 {
color: shade-color($color-alpha, 40%);
&:before {
content: '#{$i-lightbulb}';
@include font-size(1.2rem);
}
}
}
&.alert-warning, &.warning {
border-color: $brand-warning;
> .alert-title, > h3 {
color: shade-color($brand-warning, 10%);
&:before {
content: '#{$i-warning}';
}
} }
code, div[class^="highlight"] { code, div[class^="highlight"] {
border-color: tint-color($brand-warning, 50%); border-color: tint-color($secondary, 50%);
} }
} }
&.alert-danger { // Tip
border-color: $danger; &.alert-tip {
background-color: $o-gray-bg;
> .alert-title, > h3 { > .alert-title:before, > h3:before {
color: darken($brand-danger, 20%); content: '#{$i-lightbulb}';
@include font-size(1.2rem);
&:before {
content: '#{$i-danger}';
}
}
code, div[class^="highlight"] {
border-color: tint-color($brand-danger, 50%);
} }
} }
&.alert-example { // Example
border-color: tint-color($doc_example, 30%); &.alert-success {
background-color: tint-color($doc_example, 90%);
color: shade-color($doc_example, 35%);
> .alert-title, > h3 {
color: shade-color($doc_example, 35%);
}
> .alert-title:before, > h3:before { > .alert-title:before, > h3:before {
content: '#{$i-knowledge}'; content: '#{$i-knowledge}';
} }
code, div[class^="highlight"] { code, div[class^="highlight"] {
border-color: tint-color($doc-example, 50%); border-color: tint-color($success, 50%);
} }
} }
&.alert-exercise { // Warning & Important
border-color: tint-color($doc_exercise, 30%); &.alert-warning {
background-color: tint-color($doc_exercise, 90%); > .alert-title:before, > h3:before {
color: shade-color($doc_exercise, 35%); content: '#{$i-warning}';
> .alert-title, > h3 {
color: shade-color($doc_exercise, 35%);
} }
code, div[class^="highlight"] {
border-color: tint-color($warning, 50%);
}
}
// Danger
&.alert-danger {
> .alert-title:before, > h3:before {
content: '#{$i-danger}';
}
code, div[class^="highlight"] {
border-color: tint-color($danger, 50%);
}
}
// Exercises
&.alert-dark {
> .alert-title:before, > h3:before { > .alert-title:before, > h3:before {
content: '#{$i-exercise}'; content: '#{$i-exercise}';
} }
code, div[class^="highlight"] { code, div[class^="highlight"] {
border-color: tint-color($doc-exercise, 50%); border-color: tint-color($dark, 50%);
}
}
&.alert-go_to {
border-color: $o-violet;
background-color: $gray-lightest;
a {
color: $o-violet-dark;
}
> .alert-title, > h3 {
color: $o-violet-dark;
}
> .alert-title:before, > h3:before {
content: '#{$i-arrow-right}';
}
code, div[class^="highlight"] {
border-color: tint-color($o-violet, 50%);
} }
} }
} }

13
extensions/odoo_theme/translator.py
View File

@ -10,15 +10,12 @@ from sphinx.writers.html5 import HTML5Translator
# └── Odoo Translator # └── Odoo Translator
ADMONITION_MAPPING = { ADMONITION_MAPPING = {
# ???: 'alert-success', # The alert classes have been replaced by default BS classes to reduce number of scss lines.
'note': 'alert-primary',
'note': 'alert-note',
'hint': 'alert-info',
'tip': 'alert-tip', 'tip': 'alert-tip',
'seealso': 'alert-go_to', 'seealso': 'alert-secondary',
'warning': 'alert-warning', 'warning': 'alert-warning',
'attention': 'alert-warning', 'attention': 'alert-warning',
@ -28,8 +25,8 @@ ADMONITION_MAPPING = {
'danger': 'alert-danger', 'danger': 'alert-danger',
'error': 'alert-danger', 'error': 'alert-danger',
'example': 'alert-example', 'example': 'alert-success',
'exercise': 'alert-exercise', 'exercise': 'alert-dark',
} }