Hi,
I'm having a very mysterious issue with a button CSS.
If I put the CSS in the HTML file, it works fine.
If I put the CSS in a separate CSS file. The preview in Finder works fine. But the Custom HTML Prompt file does not render the CSS for one button, and only that button--the Restore button (see below for screenshot of the preview in Finder and KM action).
If I move the HTML file and the CSS file to another folder, the Custom HTML Prompt action in KM also works fine. I just copied the files to the new folder and did not change anything in both files.
My original folder is: ~/Dropbox/Scripting/KM/html/PHPMailer_Markdown.html.
My new test folder: ~/Downloads/PHPMailer_Markdown.html.
Can someone help me find out what's going on?
(I thought there were some errors in my HTML or CSS code until I moved them to the "Downloads" folder and found out it works just fine. This has driven me crazy.)
I'm going to take a wild guess that this is more about Dropbox and less about CSS/HTML. You do have an empty section in your header after the but that doesn't matter.
I wonder if Dropbox failed to sync your changes promptly.
If I change the folder name html to another, e.g., htmls, the button style will work.
#from → the button style does not work
~/Dropbox/Scripting/KM/html/PHPMailer_Markdown.html
#to → works as intended
~/Dropbox/Scripting/KM/htmls/PHPMailer_Markdown.html
I'm totally lost...
Update:
Another test:
If I duplicate the CSS folder → css copy, and then change the style input path to <link href="css copy/msg.css" rel="stylesheet">, it will work.
If I change css copy to cs and edit the style path in html, it will work normally.
I deleted the css folder. copied the css files from cs to css. Changed the style path back to css/msg.css. The button style is still broken.
But, I already tried moving the entire html folder to another place and did not touch the css folder name, it worked!
I'm gonna leave it for now. I will change the css folder name to something other than css and edit all the html files to reflect that change. At least, I don't have to change all the HTML prompt actions in Keyboard Maestro...
Thanks again, @mrpasini.
If you have other ideas, even still wild guesses, please let me know. The CSS files should be put in a css folder. It is strange to put it in a folder that is not called css...
Yeah, must be some undisclosed conflict with the html folder name that perverts the relative path to css. Although, as a San Francisco Giants fan, the only thing I could find wrong with the CSS code for the Restore button is that it's dodgerblue. I'd change that.
Actually, I tried many colors and have not come up with a satisfying color yet. And, I should add, no matter what color I put there, the button style is till broken if it remains in that file path.
I think I may have found out why!! Well, at least a solution.
I changed the css folder to cs. But, when I changed the button color and tested it in KM, the button color did not change!
Then I quitted and restarted the KM engine and tested the action again. It reflects the changes.
I changed the folder name back to css. This time, it works!
It looks to me, KM has cashed the files somewhere and does not load the changed files if we don't restart the KM engine. @peternlewis, is it an expected behavior?
As I recall Safari was notorious for caching the CSS files of a site, so it's possible WebKit behaves that way.
I've taken to minimizing the CSS code and keeping it in the Custom HTML Prompt action. My Minify/Unminify CSS/JS Files makes it easy to work with the unminified files while you're testing before minimizing for production.
So I've never experienced an issue with WebKit CSS caching.
I'll also note that I have sometimes found it prudent to click outside an Execute a [Script] action to make sure Keyboard Maestro digests my edits before I test them. But since I trimmed down my plist file, I haven't had as much trouble with this.
So it may not be caching but a delay in processing the changes back to the plist file in that case. No idea.
Thanks for mentioning the tool. I was not aware of it before. My entire html folder is 184 KB large, with 18 html files. Your tool seems like an overkill for me. I've downloaded it and went through the readme file. I'll give a try and see how it goes when I have more time.
