nestable.css is overly onerous

[jh-orange]

How about reducing nestable.css to what's needed to actually function? I mean really .dd { max-width: 600px; }?

Even the requirement to add the dd, dd-list, and dd-item (I can see dd-handle, but even that could have a default) is unnecessary: you can figure out who gets what class assigned upon the initial nestable call.

My initial code didn't use the included CSS (from the nestable 1 days). I used jquery to assign the classes and just styled what I needed. Worked great. Until I dragged the cursor out of the nestable div. THen, all by LIs disappeared. Still don't know why. Ended up removing all my custom CSS and included nestable.css and it worked. Nothing in my structure changed.

[pjona]

@jh-orange check this commit, I added SASS version of our CSS file, so you can change default classes. Example of your .scss file:

$nestable-list-class: "dd-list-custom";

@import "jquery.nestable.scss";

Maybe we can also move some default colors to variables.

[pjona]

@jh-orange we are open for discussion if you have some proposition how to slim down our CSS, right now there are only needed stuff but maybe you see it differently.

[jh-orange]

It's not just colors. You've got fonts, sizes, line heights. The worst is what happens when you start dragging something, because everything the user defines is lost. You shouldn't be providing styles to anything; use the classes just to identify elements (e.g., handles). Look at jQuery sortable as an example. There is also no apparent reason to need to provide the dd, dd-item, dd-list, dd-handle (except as an override): they can be determined from the initial selection (or, to allow for the bizarre cases, only assign them if they're not already assigned). After being constantly frustrated with trying to use my own styling I wrote a version of nestable just using jquery sortable (by adding sublists to each list item and using the multiple list option). It took maybe a half dozen lines of code and, admittedly still needed a little tweaking, but it was workable (not to the level of nestable2, but at least it didn't fall apart with custom styles).

…

On Thu, Sep 7, 2017 at 12:51 AM, Marek Skiba ***@***.***> wrote: @jh-orange <https://github.com/jh-orange> we are open for discussion if you have some proposition how to slim down our CSS, right now there are only needed stuff but maybe you see it differently. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#81 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ACY7kRsH7FgrpBZ_mC_AWb0U-5AAO8s-ks5sf6CMgaJpZM4PJft0> .

[RamonSmit]

Welk, sad to hear you didn't like it. We're going to take your input in our consideration. Thanks for the feedback.

[jh-orange]

I like it well enough to use it; it works. It's just that I'm forced to make my lists conform to your (the generic 'your') concept of 'style,' and for that reason I will continue to look for alternatives.

…

On Thu, Sep 7, 2017 at 9:56 AM, Ramon J. A. Smit ***@***.***> wrote: Welk, sad to hear you didn't like it. We're going to take your input in our consideration. Thanks for the feedback. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#81 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ACY7kQmGcW7JBEbSrog4QWVRmxz7iEg3ks5sgCBCgaJpZM4PJft0> .

[pjona]

The worst is what happens when you start dragging something, because everything the user
defines is lost.

@jh-orange Can you provide your styles or example where it reset user styles?

Maybe we can find common parts and try to make base theme and all what not fit as base put it in another theme.

[jh-orange]

I don't remember what I changed to prevent the items from disappearing when dragged outside the list but it was related to a missing dd class up top. More on that below. Nestable runs, mostly, when one doesn't supply it's CSS file (acts like sortable - no nesting [maybe not; turns out my list is now acting that way with the full file]), which supports my argument that it is onerous. Look at the first dd definition: max-width, font-size, line-height? Why? Almost everything is unnecessary> dd-handle height, color, font-weight, border, background, radius? The thing about taste is that everything thinks their's is great. My lists contain other elements: text fields, buttons, etc. When dragging, any styling I have goes away, presumably because it's relative to the list (e.g., div > ol > li input[type=...]) and not having a class definition on each element. Not unreasonable (and sortable manages). One big problem is that I have handlers attached to those elements and they get eaten by the drag handler. As a result, I have to have a dedicated drag area and not the entire dd-item (again, sortable handles this). Finally, and I mentioned this earlier, why can't you just dynamically add the classes you need? My lists are generated dynamically, without any class definitions. My invocation is (basically): $('#whatever').html(html) .addClass('dd') .find('ol').addClass('dd-list') .find('li').addClass('dd-item ui-state-default') .find('div>span').addClass('dd-handle') .parents('.dd') .nestable(... I haven't look closely at the code, but it's curious that the invocation is on the container and not the actual list. I guess, in theory, your list could be a series of divs or other blocks: <div class="dd"> <div class="dd-list"> <div class="dd-item"> <div containing something with a dd-handle> but that would seem a little perverse, not to mention unmanageable (and a really terrible coding practice). But in any case everything is pretty much known so nestable should be able to add the classes at invocation. Got to go. Just discovered my lists won't indent anymore. Discovered it when I was trying to find a minimum nestable.css. Probably got a color wrong.

…

On Fri, Sep 8, 2017 at 12:50 AM, Marek Skiba ***@***.***> wrote: The worst is what happens when you start dragging something, because everything the user defines is lost. @jh-orange <https://github.com/jh-orange> Can you provide your styles or example where it reset user styles? Maybe we can find common parts and try to make base theme and all what not fit as base put it in another theme. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#81 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ACY7kROkaRl4Jiva5bfw07qVTJsvbGciks5sgPHAgaJpZM4PJft0> .

[GertjanRoke]

@jh-orange could you give a use case for why you would use div's instead of a ordered list?
Because I can't see the reason for using div's instead of ordered list, this package is mostly used for sorting menu items of some sorts.

[jh-orange]

I'm not; it was just a statement and I said it was theoretically possible but a bizarre concept.

…

On Mon, Sep 11, 2017 at 12:48 AM, Gertjan Roke ***@***.***> wrote: @jh-orange <https://github.com/jh-orange> could you give a use case for why you would use div's instead of a ordered list? Because I can't see the reason for using div's instead of ordered list, this package is mostly used for sorting menu items of some sorts. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#81 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ACY7kfareoHjTnqgOxbxefQN5U9RmjnUks5shOXkgaJpZM4PJft0> .