draggable-sheet.scss 1007 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. .draggable-sheet {
  2. &-wrapper {
  3. width: 100vw;
  4. position: absolute;
  5. bottom: 0;
  6. }
  7. &-shade {
  8. position: absolute;
  9. top: 0;
  10. left: 0;
  11. width: 100%;
  12. height: 100%;
  13. background-color: var(--td-overlay-bg-color, var(--td-font-gray-2, rgba(0, 0, 0, 0.6)));
  14. transition-property: opacity;
  15. transition-duration: var(--td-overlay-transition-duration, 300ms);
  16. transition-timing-function: ease;
  17. }
  18. &-container {
  19. height: 100%;
  20. overflow: hidden;
  21. color: var(--td-text-color-primary);
  22. background-color: var(--td-bg-color-container);
  23. border-top-left-radius: 25px;
  24. border-top-right-radius: 25px;
  25. }
  26. &-bar {
  27. display: flex;
  28. flex-direction: column;
  29. justify-content: center;
  30. align-items: center;
  31. padding: 8px 0;
  32. background-color: var(--td-bg-color-container);
  33. .indicator {
  34. background-color: #939393;
  35. border-radius: 3px;
  36. height: 4px;
  37. width: 80px;
  38. }
  39. .title {
  40. margin-top: 8px;
  41. }
  42. }
  43. }