toast.scss 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
  1. /*!
  2. * SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors
  3. * SPDX-License-Identifier: AGPL-3.0-or-later
  4. */
  5. @use 'variables';
  6. @import 'functions';
  7. .toastify.toast {
  8. min-width: 200px;
  9. background: none;
  10. background-color: var(--color-main-background);
  11. color: var(--color-main-text);
  12. box-shadow: 0 0 6px 0 var(--color-box-shadow);
  13. padding: 12px;
  14. padding-inline-end: 34px;
  15. margin-top: 45px;
  16. position: fixed;
  17. z-index: 9000;
  18. border-radius: var(--border-radius);
  19. .toast-close {
  20. position: absolute;
  21. top: 0;
  22. inset-inline-end: 0;
  23. width: 38px;
  24. opacity: 0.4;
  25. padding: 12px;
  26. @include icon-color('close', 'actions', variables.$color-black, 2, true);
  27. background-position: center;
  28. background-repeat: no-repeat;
  29. text-indent: 200%;
  30. white-space: nowrap;
  31. overflow: hidden;
  32. &:hover, &:focus, &:active {
  33. cursor: pointer;
  34. opacity: 1;
  35. }
  36. }
  37. }
  38. .toastify.toastify-top {
  39. inset-inline-end: 10px;
  40. }
  41. .toast-error {
  42. border-inline-start: 3px solid var(--color-error);
  43. }
  44. .toast-info {
  45. border-inline-start: 3px solid var(--color-primary-element);
  46. }
  47. .toast-warning {
  48. border-inline-start: 3px solid var(--color-warning);
  49. }
  50. .toast-success {
  51. border-inline-start: 3px solid var(--color-success);
  52. }