tools-modal.component.scss 1002 B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. //
  2. .example-list {
  3. width: 100%;
  4. border: solid 1px #ccc;
  5. min-height: 60px;
  6. display: block;
  7. background: white;
  8. border-radius: 4px;
  9. overflow: hidden;
  10. }
  11. .example-box {
  12. padding: 20px 10px;
  13. border-bottom: solid 1px #ccc;
  14. color: rgba(0, 0, 0, 0.87);
  15. display: flex;
  16. position: relative;
  17. flex-direction: column;
  18. // align-items: center;
  19. justify-content: space-between;
  20. box-sizing: border-box;
  21. cursor: move;
  22. background: white;
  23. font-size: 14px;
  24. }
  25. .cdk-drag-preview {
  26. box-sizing: border-box;
  27. border-radius: 4px;
  28. box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),
  29. 0 8px 10px 1px rgba(0, 0, 0, 0.14),
  30. 0 3px 14px 2px rgba(0, 0, 0, 0.12);
  31. }
  32. .cdk-drag-placeholder {
  33. opacity: 0;
  34. }
  35. .cdk-drag-animating {
  36. transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
  37. }
  38. .example-box:last-child {
  39. border: none;
  40. }
  41. .example-list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder) {
  42. transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
  43. }