toastvibe/dist/index.css.map

ToastVibe is a lightweight, customizable, and flexible toast notification library for React.

{"version":3,"sources":["../src/styles/styles.css"],"sourcesContent":["/* Base Toast Styles */\r\n.toast {\r\n  padding: 12px 20px;\r\n  border-radius: 8px;\r\n  color: white;\r\n  font-size: 14px;\r\n  font-family: Arial, sans-serif;\r\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);\r\n  margin: 8px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  max-width: 300px;\r\n  animation: fadeIn 0.3s ease-in-out;\r\n  background: linear-gradient(135deg, #3498db, #2980b9); /* Default gradient */\r\n  transition: transform 0.3s ease, opacity 0.3s ease, background 0.5s ease;\r\n}\r\n\r\n.toast:hover {\r\n  transform: translateY(-2px); /* Slight lift on hover */\r\n  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3); /* Enhanced shadow on hover */\r\n}\r\n\r\n/* Toast Types */\r\n.toast-pending {\r\n  background: linear-gradient(135deg, #3498db, #2980b9); /* Gradient for pending toasts */\r\n}\r\n\r\n.toast-success {\r\n  background: linear-gradient(135deg, #2ecc71, #27ae60); /* Gradient for success toasts */\r\n}\r\n\r\n.toast-warning {\r\n  background: linear-gradient(135deg, #f1c40f, #f39c12); /* Gradient for warning toasts */\r\n}\r\n\r\n.toast-error {\r\n  background: linear-gradient(135deg, #e74c3c, #c0392b); /* Gradient for error toasts */\r\n}\r\n\r\n/* Rich Colors */\r\n.toast.rich-colors {\r\n  animation: colorChange 2s infinite alternate;\r\n}\r\n\r\n@keyframes colorChange {\r\n  0% {\r\n    background: linear-gradient(135deg, var(--toast-color), var(--toast-color-dark));\r\n  }\r\n  100% {\r\n    background: linear-gradient(135deg, var(--toast-color-dark), var(--toast-color));\r\n  }\r\n}\r\n\r\n.toast-pending.rich-colors {\r\n  --toast-color: #3498db;\r\n  --toast-color-dark: #2980b9;\r\n}\r\n\r\n.toast-success.rich-colors {\r\n  --toast-color: #2ecc71;\r\n  --toast-color-dark: #27ae60;\r\n}\r\n\r\n.toast-warning.rich-colors {\r\n  --toast-color: #f1c40f;\r\n  --toast-color-dark: #f39c12;\r\n}\r\n\r\n.toast-error.rich-colors {\r\n  --toast-color: #e74c3c;\r\n  --toast-color-dark: #c0392b;\r\n}\r\n\r\n/* Close Button */\r\n.toast-close {\r\n  background: none;\r\n  border: none;\r\n  color: white;\r\n  cursor: pointer;\r\n  margin-left: 10px;\r\n  font-size: 16px;\r\n  font-weight: bold;\r\n  transition: opacity 0.2s ease;\r\n}\r\n\r\n.toast-close:hover {\r\n  opacity: 0.8;\r\n}\r\n\r\n/* Toast Container */\r\n.toast-container {\r\n  position: fixed !important;\r\n  z-index: 9999 !important;\r\n}\r\n\r\n.toast-container.top-left {\r\n  top: 20px;\r\n  left: 20px;\r\n}\r\n\r\n.toast-container.top-right {\r\n  top: 20px;\r\n  right: 20px;\r\n}\r\n\r\n.toast-container.bottom-left {\r\n  bottom: 20px;\r\n  left: 20px;\r\n}\r\n\r\n.toast-container.bottom-right {\r\n  bottom: 20px;\r\n  right: 20px;\r\n}\r\n\r\n.toast-container.top-center {\r\n  top: 20px;\r\n  left: 50%;\r\n  transform: translateX(-50%);\r\n}\r\n\r\n.toast-container.bottom-center {\r\n  bottom: 20px;\r\n  left: 50%;\r\n  transform: translateX(-50%);\r\n}\r\n\r\n.toast-container.center {\r\n  top: 50%;\r\n  left: 50%;\r\n  transform: translate(-50%, -50%);\r\n}\r\n\r\n/* Animations */\r\n@keyframes fadeIn {\r\n  from {\r\n    opacity: 0;\r\n  }\r\n  to {\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n/* Position-Based Text Animations */\r\n.toast-container.top-left .toast {\r\n  animation: slideInLeft 0.5s ease-in-out;\r\n}\r\n\r\n.toast-container.top-right .toast {\r\n  animation: slideInRight 0.5s ease-in-out;\r\n}\r\n\r\n.toast-container.top-center .toast {\r\n  animation: slideInTop 0.5s ease-in-out;\r\n}\r\n\r\n.toast-container.bottom-center .toast {\r\n  animation: slideInBottom 0.5s ease-in-out;\r\n}\r\n\r\n@keyframes slideInLeft {\r\n  from {\r\n    transform: translateX(-100%);\r\n    opacity: 0;\r\n  }\r\n  to {\r\n    transform: translateX(0);\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n@keyframes slideInRight {\r\n  from {\r\n    transform: translateX(100%);\r\n    opacity: 0;\r\n  }\r\n  to {\r\n    transform: translateX(0);\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n@keyframes slideInTop {\r\n  from {\r\n    transform: translateY(-100%);\r\n    opacity: 0;\r\n  }\r\n  to {\r\n    transform: translateY(0);\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n@keyframes slideInBottom {\r\n  from {\r\n    transform: translateY(100%);\r\n    opacity: 0;\r\n  }\r\n  to {\r\n    transform: translateY(0);\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n/* Loading Spinner */\r\n.toast-loading {\r\n  display: flex;\r\n  align-items: center;\r\n  margin-left: 10px;\r\n}\r\n\r\n.toast-loading-spinner {\r\n  border: 2px solid rgba(255, 255, 255, 0.3);\r\n  border-top: 2px solid white;\r\n  border-radius: 50%;\r\n  width: 16px;\r\n  height: 16px;\r\n  animation: spin 1s linear infinite;\r\n}\r\n\r\n@keyframes spin {\r\n  0% {\r\n    transform: rotate(0deg);\r\n  }\r\n  100% {\r\n    transform: rotate(360deg);\r\n  }\r\n}\r\n\r\n/* Toast Message */\r\n.toast-message {\r\n  flex: 1; /* Ensures the message takes up available space */\r\n  margin-right: 10px; /* Adds spacing between message and close button */\r\n}\r\n\r\n/* Toast Icon */\r\n.toast-icon {\r\n  margin-right: 10px; /* Adds spacing between icon and message */\r\n  font-size: 18px; /* Adjust icon size */\r\n}"],"mappings":"AACA,CAAC,MADD,QAEW,KAAK,KAFhB,cAGiB,IACf,MAAO,KACP,UAAW,KACX,YAAa,KAAK,CAAE,WACpB,WAAY,EAAE,IAAI,KAAK,MAPzB,OAQU,IACR,QAAS,KACT,YAAa,OACb,gBAAiB,cACjB,UAAW,MACX,UAAW,OAAO,IAAK,YACvB,WAAY,gBAAgB,MAAhB,CAAwB,OAAxB,CAAiC,SAC7C,WAAY,UAAU,IAAK,IAAI,CAAE,QAAQ,IAAK,IAAI,CAAE,WAAW,IAAK,IACtE,CAEA,CAjBC,KAiBK,OACJ,UAAW,WAAW,MACtB,WAAY,EAAE,IAAI,KAAK,SACzB,CAGA,CAAC,cACC,WAAY,gBAAgB,MAAhB,CAAwB,OAAxB,CAAiC,QAC/C,CAEA,CAAC,cACC,WAAY,gBAAgB,MAAhB,CAAwB,OAAxB,CAAiC,QAC/C,CAEA,CAAC,cACC,WAAY,gBAAgB,MAAhB,CAAwB,OAAxB,CAAiC,QAC/C,CAEA,CAAC,YACC,WAAY,gBAAgB,MAAhB,CAAwB,OAAxB,CAAiC,QAC/C,CAGA,CAxCC,KAwCK,CAAC,YACL,UAAW,YAAY,GAAG,SAAS,SACrC,CAEA,WAHa,YAIX,GACE,WAAY,gBAAgB,MAAM,CAAE,IAAI,cAAc,CAAE,IAAI,oBAC9D,CACA,GACE,WAAY,gBAAgB,MAAM,CAAE,IAAI,mBAAmB,CAAE,IAAI,eACnE,CACF,CAEA,CA9BC,aA8Ba,CAbP,YAcL,eAAe,QACf,oBAAoB,OACtB,CAEA,CA/BC,aA+Ba,CAlBP,YAmBL,eAAe,QACf,oBAAoB,OACtB,CAEA,CAhCC,aAgCa,CAvBP,YAwBL,eAAe,QACf,oBAAoB,OACtB,CAEA,CAjCC,WAiCW,CA5BL,YA6BL,eAAe,QACf,oBAAoB,OACtB,CAGA,CAAC,YACC,WAAY,KACZ,OAAQ,KACR,MAAO,KACP,OAAQ,QACR,YAAa,KACb,UAAW,KACX,YAAa,IACb,WAAY,QAAQ,IAAK,IAC3B,CAEA,CAXC,WAWW,OACV,QAAS,EACX,CAGA,CAAC,gBACC,SAAU,gBACV,QAAS,cACX,CAEA,CALC,eAKe,CAAC,SACf,IAAK,KACL,KAAM,IACR,CAEA,CAVC,eAUe,CAAC,UACf,IAAK,KACL,MAAO,IACT,CAEA,CAfC,eAee,CAAC,YACf,OAAQ,KACR,KAAM,IACR,CAEA,CApBC,eAoBe,CAAC,aACf,OAAQ,KACR,MAAO,IACT,CAEA,CAzBC,eAyBe,CAAC,WACf,IAAK,KACL,KAAM,IACN,UAAW,UAAW,KACxB,CAEA,CA/BC,eA+Be,CAAC,cACf,OAAQ,KACR,KAAM,IACN,UAAW,UAAW,KACxB,CAEA,CArCC,eAqCe,CAAC,OACf,IAAK,IACL,KAAM,IACN,UAAW,UAAU,IAAI,CAAE,KAC7B,CAGA,WA1Ha,OA2HX,GACE,QAAS,CACX,CACA,GACE,QAAS,CACX,CACF,CAGA,CAtDC,eAsDe,CAjDC,SAiDS,CAhJzB,MAiJC,UAAW,YAAY,IAAK,WAC9B,CAEA,CA1DC,eA0De,CAhDC,UAgDU,CApJ1B,MAqJC,UAAW,aAAa,IAAK,WAC/B,CAEA,CA9DC,eA8De,CArCC,WAqCW,CAxJ3B,MAyJC,UAAW,WAAW,IAAK,WAC7B,CAEA,CAlEC,eAkEe,CAnCC,cAmCc,CA5J9B,MA6JC,UAAW,cAAc,IAAK,WAChC,CAEA,WAfa,YAgBX,GACE,UAAW,UAAW,OACtB,QAAS,CACX,CACA,GACE,UAAW,UAAW,GACtB,QAAS,CACX,CACF,CAEA,WAtBa,aAuBX,GACE,UAAW,UAAW,MACtB,QAAS,CACX,CACA,GACE,UAAW,UAAW,GACtB,QAAS,CACX,CACF,CAEA,WA7Ba,WA8BX,GACE,UAAW,WAAW,OACtB,QAAS,CACX,CACA,GACE,UAAW,WAAW,GACtB,QAAS,CACX,CACF,CAEA,WApCa,cAqCX,GACE,UAAW,WAAW,MACtB,QAAS,CACX,CACA,GACE,UAAW,WAAW,GACtB,QAAS,CACX,CACF,CAGA,CAAC,cACC,QAAS,KACT,YAAa,OACb,YAAa,IACf,CAEA,CAAC,sBACC,OAAQ,IAAI,MAAM,KAAK,GAAG,CAAE,GAAG,CAAE,GAAG,CAAE,IACtC,WAAY,IAAI,MAAM,MAtNxB,cAuNiB,IACf,MAAO,KACP,OAAQ,KACR,UAAW,KAAK,GAAG,OAAO,QAC5B,CAEA,WAHa,KAIX,GACE,UAAW,OAAO,EACpB,CACA,GACE,UAAW,OAAO,OACpB,CACF,CAGA,CAAC,cACC,KAAM,EACN,aAAc,IAChB,CAGA,CAAC,WACC,aAAc,KACd,UAAW,IACb","names":[]}