/
githubmirror
/
angular
Обзор
Документация
Войти
/
githubmirror
/
angular
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
main
integration/animations/src/app/app.component.css
95 строк
2 KB
Jessica Janiuk
fix(core): prevent child animation elements from being orphaned
04 мар 2026, 19:21
04 мар 2026, 19:21
9e64147
Код
Авторство
О чём код?
.example-list { width: 500px; max-width: 100%; border: solid 1px #ccc; min-height: 60px; display: block; background: white; border-radius: 4px; overflow: hidden; } .example-box { padding: 20px 10px; border-bottom: solid 1px #ccc; color: rgba(0, 0, 0, 0.87); display: flex; flex-direction: row; align-items: center; justify-content: space-between; box-sizing: border-box; cursor: move; background: white; font-size: 14px; } .cdk-drag-preview { box-sizing: border-box; border-radius: 4px; box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12); } .cdk-drag-placeholder { opacity: 0; } .cdk-drag-animating { transition: transform 250ms cubic-bezier(0, 0, 0.2, 1); } .example-box:last-child { border: none; } .example-list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder) { transition: transform 250ms cubic-bezier(0, 0, 0.2, 1); } .example-custom-placeholder { background: #ccc; border: dotted 3px #999; min-height: 60px; transition: transform 250ms cubic-bezier(0, 0, 0.2, 1); } .ease-in-animation { animation: ease-in-animation 1500ms; } .ease-out-animation { animation: ease-out-animation 1500ms; } @keyframes ease-in-animation { from { height: 0; } to { height: 75px; } } @keyframes ease-out-animation { from { height: 75px; } to { height: 0; } } .short-animation { animation: short-animation 50ms; } @keyframes short-animation { from { opacity: 1; } to { opacity: 0; } }