_ConfirmDialog.scss 1.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. .confirmation-dialog {
  2. .modal {
  3. box-shadow: 0 2px 2px 0 $black-10;
  4. left: 0;
  5. margin: auto;
  6. position: fixed;
  7. right: 0;
  8. top: 20%;
  9. width: 400px;
  10. }
  11. section {
  12. margin: 0;
  13. }
  14. .modal-message {
  15. display: flex;
  16. padding: 16px;
  17. padding-bottom: 0;
  18. p {
  19. margin: 0;
  20. margin-bottom: 16px;
  21. }
  22. }
  23. .actions {
  24. border: 0;
  25. display: flex;
  26. flex-wrap: nowrap;
  27. padding: 0 16px;
  28. button {
  29. margin-inline-end: 16px;
  30. padding-inline-end: 18px;
  31. padding-inline-start: 18px;
  32. white-space: normal;
  33. width: 50%;
  34. &.done {
  35. margin-inline-end: 0;
  36. margin-inline-start: 0;
  37. }
  38. }
  39. }
  40. .icon {
  41. margin-inline-end: 16px;
  42. }
  43. }
  44. .modal-overlay {
  45. background: var(--newtab-overlay-color);
  46. height: 100%;
  47. left: 0;
  48. position: fixed;
  49. top: 0;
  50. width: 100%;
  51. z-index: 11001;
  52. }
  53. .modal {
  54. background: var(--newtab-modal-color);
  55. border: $border-secondary;
  56. border-radius: 5px;
  57. font-size: 15px;
  58. z-index: 11002;
  59. }