diff --git a/extensions/odoo_theme/static/img/poule.svg b/extensions/odoo_theme/static/img/poule.svg new file mode 100644 index 000000000..0ad0dac42 --- /dev/null +++ b/extensions/odoo_theme/static/img/poule.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/extensions/odoo_theme/static/scss/_mixins.scss b/extensions/odoo_theme/static/scss/_mixins.scss index 4585e49f0..e8fa932e4 100644 --- a/extensions/odoo_theme/static/scss/_mixins.scss +++ b/extensions/odoo_theme/static/scss/_mixins.scss @@ -127,3 +127,38 @@ width: 43%; height: calc(100% - 3rem); } + +@mixin o-easter-egg($width: 100%, $height: 30px, $img: '/_static/img/poule.svg' ){ + position: relative; + // Easter Egg on hover 5s + &:after { + content: ''; + display: block; + width: $width; + height: $height; + @include o-position-absolute(auto, 0, 0, 0); + background-image: url('#{$img}'); + background-color: $white; + background-repeat: no-repeat; + opacity: 0; + visibility: hidden; + @include o-transition(all, .5s, ease-out, .5s); + } + &:hover:after { + opacity: 1; + visibility: visible; + @include o-transition(all, .5s, ease-in, 5s); + } +} + +@function valid-radius($radius) { + $return: (); + @each $value in $radius { + @if type-of($value) == number { + $return: append($return, max($value, 0)); + } @else { + $return: append($return, $value); + } + } + @return $return; +} \ No newline at end of file diff --git a/extensions/odoo_theme/static/style.scss b/extensions/odoo_theme/static/style.scss index 3129336a9..8c9e86bef 100644 --- a/extensions/odoo_theme/static/style.scss +++ b/extensions/odoo_theme/static/style.scss @@ -23,6 +23,9 @@ body { @include o-scroll-padding() } } + abbr[title="Pull Request"] { + @include o-easter-egg(); + } } .hidden { @@ -57,25 +60,7 @@ header.o_main_header{ span { @include font-size($font-size-base); color: $o-violet; - position: relative; - &:after { - content: ''; - display: block; - width: 100%; - height: 20px; - @include o-position-absolute(0, 0, 0, 0); - background-color: white; - background-image: url(/_static/img/ducky.svg); - background-repeat: no-repeat; - opacity: 0; - visibility: hidden; - @include o-transition(all, .5s, ease-out, .5s); - } - &:hover:after { - opacity: 1; - visibility: visible; - @include o-transition(all, .5s, ease-in, 5s); - } + @include o-easter-egg($img:'/_static/img/ducky.svg'); } } @include media-breakpoint-up(xl) {