diff --git a/assets/css/app.scss b/assets/css/app.scss index c41deb0..ffabfd0 100644 --- a/assets/css/app.scss +++ b/assets/css/app.scss @@ -167,35 +167,35 @@ pre[class*="language-"] { } .small-menu { + $radius: 8px; + background: $color-small-menu-background; padding: 5px; position: fixed; bottom: 0; width: 100%; z-index: 2000; + border-top-right-radius: $radius + 5; + border-top-left-radius: $radius + 5; .navigation { padding-top: 0; - display: none; - margin-top: 10px; + margin-bottom: 10px; + max-height: 0; + overflow: hidden; + transition: max-height 0.8s ease-in-out; li { - $radius: 8px; - &:first-child, &:first-child a { border-top-right-radius: $radius; border-top-left-radius: $radius; } - - &:last-child, &:last-child a { - border-bottom-right-radius: $radius; - border-bottom-left-radius: $radius; - } } } &.is-open .navigation { - display: block; + max-height: 800px; + transition: max-height 0.8s ease-in-out; } .logo-svg { diff --git a/templates/module/_navigation.html.twig b/templates/module/_navigation.html.twig index 533c7c8..748663d 100644 --- a/templates/module/_navigation.html.twig +++ b/templates/module/_navigation.html.twig @@ -55,10 +55,6 @@
- - {{ include('module/_logo.html.twig') }} - - + + {{ include('module/_logo.html.twig') }} + +