.mini-holder { position: absolute; padding: 4px; bottom: 80px; right: 24px; width: 56px; pointer-events: none; flex-direction: column-reverse !important; core-tooltip{ transform: scale(0); transition-property: transform; transition-duration: 0.3s; transition-timing-function: ease-in-out; margin: 4px; } &.active { pointer-events: auto; core-tooltip{ transform: scale(1); } core-tooltip:nth-child(2){ transition-delay: 0.1s; } core-tooltip:nth-child(3){ transition-delay: 0.2s; } core-tooltip:nth-child(4){ transition-delay: 0.3s; } core-tooltip:nth-child(5){ transition-delay: 0.4s; } } } .expand-menu { &::shadow core-icon { transition: transform 0.3s ease-in-out; } &.active::shadow core-icon{ transform: rotate(405deg); } }