-
Notifications
You must be signed in to change notification settings - Fork 6.7k
feat(modal): Add CSS class(es) to the top modal window #2524
Conversation
@R3VoLuT1OneR by "top window" you mean the one on top of the stack of windows if multiple modals are opened, right? If so it should be working correctly - I mean - modals that are not on top of the stack should be hidden below the top-level one. If this is not the case that would be a bug to be fixed. I'm not big fan of yet another option to introduce class name. What we could do instead is to have a boolean model value exposed to the window template so people could override this template and add whatever classes they need. At present I'm not a big fan of enlarging the API surface of the $modal service, it is kind of too complex already. But I would like to hear more about your exact use-case before closing this PR. |
Yes, "top window" it is one on the top of the stack of popup windows, all other windows not hidden and I didn't find any documentation, code or tests that mentioned this. The problem that I tried to solve with adding class to top modal, it is hiding all other modal windows. You can open bug (issue) and assign it on me, I will fix it. But I am afraid that this bug fixing gonna affect behavior of modal windows service. So I think we still need to enlarge modal API with boolean option that would represent ability of hiding not top modal windows, false by default so it is will not affect previous behavior. |
Can you explain the difference between this and the existing |
@wesleycho the difference is that One more time. The problem I tried to solve, is the hiding of bottom popup windows, if multiple windows are opened. |
I don't quite understand - we do not support multiple modal windows being opened at the same time. Is what you want a feature for supporting multiple modal windows being opened at the same time? |
We do support multiple modals through a modal stack. We can consider this but I think we should put this off to merge after the 0.13 release. |
Hm, I'm completely mistaken then, whoops. |
@R3VoLuT1OneR Can you rebase with master please? |
@karianna rebase done, sorry for slow response |
Question - could the |
I misunderstood this feature before - I see what this is doing now. If the class is only to be applied to the top modal, shouldn't the class be removed from the other modals? Thinking about this, I am not sure we would want this - what are your thoughts @R3VoLuT1OneR? |
@wesleycho I am not sure if I understand you correctly. windowTopClass - Applied only on the top modal window ( first one in the stack of modal windows ) on other modal windows should not be that class. Usage: Show only top modal window, and hide others with css. ( .windowClass {display: none;} .windowTopClass {display: block;} for example). By default when you opening multiple modal windows they all displayed and it is hard to hide unwanted windows with CSS, only with JS. |
The problem is when a new modal is opened, we would have to go through and remove this class for all of the other modals then. I am just concerned with potential complexity here, but I guess I can accept this use case. This PR needs to be rebased though, and after rebasing, the commits need to be squashed into one. |
Rebased and squashed. About removing the "windowTopClass" from all other windows, actually we should remove class only from 1 window ( previous top ) on opening new one and on closing window we should add class to new top window, that what my code doing. There are also tests for this use case. |
Hm, makes sense - this LGTM. |
- Added ability to add a class to the most recently opened modal window. Note that even if different classes are specified, the class will only be present if the modal is the most recently opened modal, i.e. if modal1 was opened with a top class of `foo`, and modal2 is opened afterwards with a top class of `bar`, modal2 will have the class `bar` for the modal window, and modal1 will not have the class `foo`. Closes angular-ui#2524
Adds ability to add CSS class(es) to the top modal window.
Can be used for hiding other modal windows with CSS if there are multiple modal windows opened.