Comments (4)
@cyonii that would be a nice addition also all theming and option cannot be directly implemented in a core library.
for this toaster library we can add something like theme and that would be injected to it for designing in any way.
from toastify-js.
@Sandip124 Can you share the toastify config for this toast?
from toastify-js.
I have same issue as in the screenshot above. With following config
Toastify({
text: notification,
duration: -1,
close: true,
escapeMarkup: false,
gravity: "top", // `top` or `bottom`
position: "right", // `left`, `center` or `right`
stopOnFocus: true, // Prevents dismissing of toast on hover
// className: "info",
style: {
background: "#32abdc",
},
offset: {
x: 4, // pixels
y: 48,
},
onClick: function () {
document.querySelector("#internal-chat-modal").click();
}, // Callback after click
}).showToast();
from toastify-js.
I had this issue too so I positioned the close icon absolute to it's toast container.
.toast-close {
position: absolute;
top: 0;
right: 0;
padding: 0;
background-color: $white;
line-height: 1;
opacity: 1;
}
It would be nice to have an option to position the close icon absolutely, with options like below:
Toastify({
closePosition: "top right" // `top left`, `bottom left`, `bottom right`
}).showToast()
from toastify-js.
Related Issues (20)
- Support box shadow colors HOT 3
- Doesn't play well with TailwindCSS (or any other utility framework) HOT 5
- Avoid duplicate HOT 2
- How to use this inside chrome extension ? HOT 4
- Improve accessibility by defaulting and allowing `aria-live` HOT 3
- custom styles like background-color and color not getting applied through className attribute HOT 3
- Only start the countdown timer if the page is visible
- Reposition function is not working with shadow roots (selector option) HOT 1
- `oldestFirst` option is ignored
- Is `toastify-js` still maintained? HOT 1
- Set Image HOT 1
- Programmatic control over popups?
- Toastify does not work with new window
- Setting 'node' attribute in React
- TypeError Exports HOT 8
- Progressbar for duration HOT 1
- add talwindcss support
- Avoid showing HTML tags like text HOT 1
- Buttons with custom events
- If there are multiple toasts stacked, only one seems to be closable
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from toastify-js.