diff options
-rw-r--r-- | core/css/apps.scss | 28 |
1 files changed, 6 insertions, 22 deletions
diff --git a/core/css/apps.scss b/core/css/apps.scss index 494502e8f03..43055680e28 100644 --- a/core/css/apps.scss +++ b/core/css/apps.scss @@ -171,16 +171,12 @@ kbd { top: 22px; } - /* hide and animate deletion/collapse of subitems */ + /* hide deletion/collapse of subitems */ &.deleted, &.collapsible:not(.open) { > ul { - opacity: 0; - max-height: 0; - overflow-y: hidden; - /* bezier override the hide/slow effect due to the 2000 max-height */ - transition: max-height 1000ms cubic-bezier(0, 1, 0, 1), - opacity 250ms ease-in-out; + // NO ANIMATE because if not really hidden, we can still tab through it + display: none; } } @@ -205,10 +201,6 @@ kbd { > ul { flex: 0 1 auto; width: 100%; - transition: max-height 2000ms ease-in-out, - opacity 250ms ease-in-out; - max-height: 9999px; - opacity: 1; position: relative; > li { display: inline-flex; @@ -387,23 +379,15 @@ kbd { -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); - z-index: 50; + z-index: 105; // above a, under button + background-color: var(--color-main-background); + transition: opacity $animation-quick ease-in-out; } /* force padding on link no matter if 'a' has an icon class */ > a:first-child { padding-left: 44px; } - &:before, - > a { - transition: background-position 100ms ease-in-out, - transform 250ms ease-in-out, - opacity 100ms ease-in-out; - } - &:hover > a, - &:focus > a { - background-position-x: -50px; - } &:hover, &:focus { &:before { |