[IMP][CSS] Revamp of the .o_spoiler element to use same code as alerts

This commit is contained in:
Elisabeth Dickinson 2022-12-29 09:19:39 +01:00 committed by Antoine Vandevenne (anv)
parent 61e5bf08b5
commit 699fdc0ceb
2 changed files with 24 additions and 12 deletions

View File

@ -92,7 +92,7 @@ $accordion-button-color: $accordion-color !default;
$accordion-button-active-color: $accordion-button-color !default;
$accordion-button-bg: $accordion-bg !default;
$accordion-button-active-bg: $accordion-button-bg !default;
$accordion-button-focus-box-shadow: transparent;
$accordion-icon-transform: rotate(0deg) !default;
//Alert

View File

@ -1006,8 +1006,14 @@ header {
//------------------------------------------------------------------------------
.o_spoiler {
border-color: tint-color($dark, 30%);
background-color: $o-accordion-bg;
$background: shift-color($o-accordion-bg, $alert-bg-scale);
$border: shift-color($o-accordion-bg, $alert-border-scale);
$color: shift-color($o-accordion-bg, $alert-color-scale);
@if (contrast-ratio($background, $color) < $min-contrast-ratio) {
$color: mix($o-accordion-bg, color-contrast($background), abs($alert-color-scale));
}
@include alert-variant($background, $border, $color);
.accordion-button {
&::after {
@ -1020,17 +1026,23 @@ header {
}
.accordion-body {
#wrap & { // FIXME: Temporary workaround to take priority over pre-existing rules.
> *:first-child {
margin-top: $o-margin-s;
}
> *:first-child {
margin-top: $o-margin-s;
}
code, div[class^="highlight"] {
border-color: tint-color($dark, 50%);
> p , > ul {
margin-bottom: .5rem;
}
&:first-child:last-child {
margin-bottom: 0;
}
> *:last-child {
margin-bottom: 0;
}
code, div[class^="highlight"] {
border-color: tint-color($dark, 50%);
&:first-child:last-child {
margin-bottom: 0;
}
}
}