Open daveyank opened 10 years ago
multicam
commented
9 years ago +1 to the feature request
Note: I have tried this:
When sass compiles, the browser (tested: Chrome & Firefox) refreshes and css animates, but no changes are taken; the url in the
daveyank
commented
9 years ago Revisiting this feature request. Has anyone been able to build a work-around yet where the external site will reference the local CSS file? I used to be able to do this using the LiveReload app for Mac, but I'd prefer to keep everything in CodeKit so I don't have to define the same site twice.
bdkjones
commented
9 years ago Hmm... I can definitely implement this. Will take a bit of thinking about how the UI should expose which stylesheets you want to override, though. First blush would be by filename: "Override all stylesheets named 'main.css' with local versions". But what if the local version is in a different path, or there are two files named 'main.css' in different locations, etc. Gets kinda complex.
When I'm developing a WordPress site, I usually develop on a remote server vs. MAMP so that the client and I can be working in tandem. I've got CodeKit 2 installed and am using it primarily to handle my theme SASS files. I've got Browser Refreshing set up and I'm using the remote website as the "External Server Address." It works really well.
However, there's one glitch in my workflow: When I save the SASS file, I have to wait a second for it to process, and then I have to quick FTP it to the server before the browser refreshes (I've got it set at 3 seconds). What I'd love to be able to do is have that remote website behave as normal but instead of using the remote CSS file, use the local CSS file that was just compiled by CodeKit. This would eliminate the step of me having to upload after every save and wait the full 3 seconds.
Additional details about my setup: Basically I just have a local copy of the theme folder (which gets published to the http://example.com/wp-content/themes/[themename] directory of the remote WP site) - not the full site - just the theme. This theme folder becomes my local CodeKit project. I have "http://example.com" set as the "External Server Address." Then as I'm developing, I'm using the preview URL specified in CodeKit (which is http://daves-macbook-pro-2.local:5757/ in the case of the site I'm working on).
So if there was some way to specify which remote CSS files you want to override with local versions during preview, that would be amazing. I don't mind if the setup is fairly manual, either, because once it's set up I'd be good to go. So if I could add an entry to have it look for "http://daves-macbook-pro-2.local:5757/wp-content/themes/[themename]/stylesheet.css" and then associate that string with something like "http://localhost/....../[themename]/stylesheet.css". Heck I could probably even figure out how to do it if there was some sort of regex search/replace functionality.
Thanks, Bryan!