NOTE: Please see my note at the bottom that explains that it's not caused by what I was doing with the imported CSS file which is what I thought caused it. I didn't delete the rest of my post in case the information helped find out what's going on.
Had a bit of a bug when I imported my custom CSS file after cleaning it up. Haven't noticed this happen before, but it's been a while since I've done the cleanup like this. Thankfully I keep a lot of backups, and restarting the program fixed it (may have only needed to restart the project, should have tried that first, but I didn't sorry.).
Anyways, for future reference, in case anyone else comes across this post and has this issue later they will know how to get around it, and to see if you can figure out what caused it and possibly fix it, this issue messed up the CSS classes between the Styles window and the opened CSS file window when it was open in that it didn't arrange them correctly in the Styles window. They were arranged the same as in the CSS file's window (which truly they should be anyways, haven't figure out exactly why the 2 windows have to show backwards of each other when it comes to media query positioning, it's a very confusing thing to say the least and took me a while in the beginning to get the gist of what was happening, I'm sure I'm not the only one). Anyways, I had tried fixing things, and rearranging which it wouldn't let me do and so on till I decided maybe restarting would fix it and it did, thankfully. I still had to manipulate the CSS file's window to pretend to add a class and then delete it before it would allow me to rearrange them (drag up or down wouldn't work at all before restarting and right after it until I did the class add and removed it).
Steps I took for this to happen:
- Saved my project with a new name to know it was pre CSS cleanup - Exported my project. - Cleaned up my CSS manually in Brackets by removing a lot of classes, removing repetitive attributes from media queries and such, rearranging the classes to organize them better and so on. - Saved the CSS file in Brackets - Deleted the custom.css file within the project in BSS - Imported my cleaned up custom.css file - Corrected a few things that I missed adding back into the CSS file (ooops lol, was just a couple classes I had copied to a text file to put them where they belonged later and forgot them.) - All looked good on the page at this point so I started adjusting a few things and noticed that the main Styles window was showing the classes from my custom.css file backwards when viewing them in the main Styles window. (Pet peeve here that they show opposite at all, not sure why it needs to be that way but it sure was a confusing thing when I first started learning this program) - Looked in my custom.css file and saw they showed correctly there. - Tried to move them in the custom file's window to rearrange them in the right order (they were media queries for all the same class), but it wouldn't let me, all it did was try to create a new class at the bottom of the file every time I tried to drag one. - Finally just copied the contents of each of the classes and created new ones in the right order and deleted the old ones. Still would not let me rearrange anything after that. - Restarted BSS and went back to the classes that were originally wrongly arranged and tried to drag one to a new location and it still did not allow me to do so... - I Clicked between classes to create a new class and then clicked elsewhere on the screen to make that new class disappear. - After that I could then rearrange classes.
After typing all this, I could swear this bug is taking a step backwards and that this is very close to the issues we had when I first started using the program (the jumping around the window (reported on other post) which has returned, the issue with trying to drag classes and it instead making new classes at the bottom and so on). The only difference is that the drag didn't work at all when this happened, instead it just didn't do anything and as soon as you let the mouse go it created a class at the bottom and jumped the cursor to the bottom instead. The bug that got fixed quite a while ago actually showed like it was dragging and then would make a class at the bottom instead, or just not do anything after you let the mouse button go.
I will experiment more next week with this to see if it happens again, and if others could also that would help so we know if it's just a one time fluke or a serious issue for importing CSS files.
NOTE: Having gotten done typing all this and posting it, it's still an issue. As long as I click between classes to create a new class and then remove it, I can rearrange, but after a little bit I cannot again. If I click off that tab for any reason such as: clicking into the Styles tab, clicking a web browser window etc. it breaks the drag and drop of class arranging completely. I can then click to create a class and it will fix it again until I take the focus off that tab again.
I have just opened 2 other projects and it does the same thing in them, so .... this apparently wasn't connected to the imported CSS file at all, but is a bug in the app itself? I'm on a fresh reboot of my computer this morning which I do most days, and am on a Mac so it may be isolated to that version, not sure since I don't have a Windows computer to try it on at the moment.