Getting an earlier version of 4.x - font-awesome

I need a fresh download of FA version 4.0.3 as the CMS I use contained a damaged copy. I tried using the latest (4.7.0 at this time), but CSS changes in the .fa selector cause placement issues. I'd like to roll back to 4.0.3 to maintain compatibility until we can do a whole-site regression test for this type of bug once we upgrade.

Instead of complaining in the comments, I'll just drop this in here as a weak answer.
Either you download and stash it somewhere because you need to make changes (and then reference the CSS and other assets in the appropriate way as desribed on the Get Started page) or you use a reference to a CDN in a link to a stylesheet, in which case you can specify the version in the URL.
It sounds like you are doing the former, but you should be sure. Maybe you can just use the CDN link? At any rate, you can fetch 4.0.3 from the GitHub repo

I was able to get a hold of v4.0.3 via the GitHub Releases feature.
Having done that, I discovered that somebody had modified the CSS file in our CMS to add margin-right: 5px -- and it was one of the CMS's developers! Naughty, naughty!
SO, the 'incompatibility' I saw was not between the official, unmodified 4.0.3 and 4.7.0 versions of FA. Sorry about the false alarm! And thanks for your help. :)

Related

PhpStorm Autocomplete for Tailwind CSS not working

I currently have a NuxtJS (VueJS) project with Tailwind in it (latest versions).
I am using PhpStorm as editor.
For some reason I have no auto completion of suggestion for Tailwind CSS.
I have tried a lot of different things (anything I found on Google) but so far nothing helped.
Can anyone help me to find out what is wrong and how to fix this?
Latest thing I tried was a npm ci and Invalidate Caches/ Restart in PhpStorm but that did not help unfortunately.
I am using the latest version of PhpStorm.
Are you using "jit" mode? With it, code completion list is very limited, most of applicable CSS classes are not suggested. This will be fixed in the scope of WEB-50318, please follow it for updates.
Note also that, when using latest tailwindcss versions, the completion includes unrelated CSS classes from some *.test.css files. This will be fixed with the next tailwindcss package update, see https://github.com/tailwindlabs/tailwindcss/issues/4393. Workaround: delete node_modules/tailwindcss/jit/tests/ folder, it's not needed.
Ran into this problem with WebStorm and the previous answer diddnt solve my issue. However, I was able to solve it by instead of using mode: 'jit' in my tailwind config, by adding the --jit compiler option. Restart WebStorm afterwards.

Modifying Bootstrap.css and updating the minified version in Visual Studio?

I am using VS Express 2013, trying to customize a bootstrap theme for a Roadkill wiki. I'm trying to replace the body color with a background image.
It's easy enough to modify the bootstrap.css, but in order to get site updates you need to push changes into bootstrap.min.css. So far, I am only aware of how to do this manually. I'm looking for any method whereby I can just have the minified version update automatically.
I'm guessing it's probably really simple to do, but I can't find any steps on how to do this.
Just create your own css file and override just the css settings you want to change.
Be sure to load your override css after bootstrap so your overrides take precendence.
This way you dont need to edit either boostrap css at all.
You are right in that it is really easy to do: see http://cssminifier.com/. I just pasted in the entire text of my custom bootstrap file, clicked "Minify", and copied the output back to overwrite the content of bootstrap.min.css.
(I took a copy of the .min file first, just to be safe.)
In Visual Studio 2013, if you are using ASP.NET MVC (you haven't mentioned which, but I suspect you are using MVC 5 since you are working with Roadkill wiki), bundling and optimizations to CSS and JavaScript files are done automatically when enabled, since the NuGet package Microsoft ASP.NET Web Optimization is installed.
From Microsoft, how to enable/disable... refer to the middle of the article "Controlling Bundling and Minification":
http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification

Font Awesome 4.0.0 Missing Icons

Is it just me or there are actually icons in FontAwesome 3.x.x that are missing from FontAwesome 4.0.0? If so, this definitely makes FontAwesome much less awesome for me...
For example, I can't seem to find the equivalent to icon-remove (there is no fa-remove, or fa-delete as far as I can tell).
Having to rename all icon references in my application is annoying enough. Not being able to reproduce what was possible in 3.0 is really, really bad.
Not being able to access v3.x cheatsheet and other documentation any more: unacceptable!
icon-remove is renamed to fa-times in v4.0.0.
Quick comparison:
old one
new one
Note that some icons that seem to be missing can be easily constructed using stacking options - I have created an example for icon-remove-sign replaced by fa-times stacked on fa-circle.
Note: As #VaclavElias pointed out, icon-remove-sign is now fa-times-circle. The above is just an example of stacking.
The 4.0.0 release has the same icons as 3.2.1, but the naming conventions and many of the individual icon names have been changed.
You can view a list of changes that Geremia Taglialatela compiled over on the Github wiki for Font Awesome:
Upgrading from 3.2.1 to 4
Also, you can still access the documentation for 3.2.1 here
I wrote a little LESS file that allows the integration of the old names into the new FontAwesome version.
For this is took the list MichaƂ Rybak posted: Upgrading from 3.2.1 to 4.0
If anyone is interested in downloading, you can find it on Github: Download v3 to v4 FontAwesome Integration
--EDITED--
Michal Rybak is actually spot on. You should submit that as an answer. The icon looks exactly the same. Can't believe I missed that.
Though I'd like to point out, in the FA site it says, if you know what it looks like you know the class name in 4.0, It think it looks like a cross, or X. I would have never guessed "times"
--ORIGINAL--
I came here looking for fa-remove as well! That's disappointing. Now it looks like I have to revert back to a previous version after having migrated 2/3rd of my app to the new version.
To answer your point about documentation: The old version can be accessed here:
http://fontawesome.io/3.2.1/
I found the link while browsing through their site and stumbled upon their notice about no IE7 compatibility.
This definitely needs to be linked (atleast) in the footer
I have noticed that the Wikipedia icon is still missing on 4.0 and even 4.3
but this workaround worked for me:
.fa-wikipedia:before { font-family: "Times New Roman", Times, serif; font-weight: 400;
content: "VV"; letter-spacing:-0.45em; margin-right:0.5em; }
http://jsfiddle.net/fLktadyn/8/

Upgrading WordPress broke my site

I upgraded my website to wordpress 3.4 and it's caused an enormous amount of damage to my site. Half of my posts weren't accessible on the site and 404d, and pages 3 and 4 of my posts on my website 404d as well.
I backed up before upgrading (thank god I had a gut feeling there'd be headaches) using PressBackup. After restoring, I managed to finally be able see my other posts that were missing before, but there's a still a problem. Pages 3 and 4 still don't work ie http://www.winvenue.com/page/3/. Interestingly all the posts that disappeared were from page 3 and page 4.
I'm not sure why I got all these issues, and it's really annoying because this is an active website will hundreds of readers. I'd really like the get this fixed, any help is really appreciated. Thanks
Without knowing about your specific setup, there's some general things you can try.
I'd check the database to see if the posts are really there. If they are, see if the ones that show are any different for the ones that aren't shown.
Then disable all plugins etc to see if any of those can cause problems with the new version. If it works without plugins, turn them on one by one to see which one(s) cause problems.
Restoring from backup probably dosen't include the .htaccess file which responsible on the permalinks.
Try and regenerate your .htaccess file using settings->permalinks->save or manually
Try setting the following field on Settings->Reading (wp-admin/options-reading.php)
Blog pages show at most [5] posts
It could be that your pagination thinks there are 2 posts per page when there are actually 4 (for example) which would cause this effect.
I've also experienced the same issue when upgrading, seems like others as well, when I did a search on Google. Try searching for a draft version of the missing pages, usually WordPress will backup automatically while your typing. Also try the Trash folder, you never know. You may also need to possibly revert back to an older backup file, which may contain the missing pages.
Plugins maybe change your permalink rewrite rules. So, try to deactivate your plugin, all of them. Then reset your permalinks: Setting > permalinks, don't change anything but saving it. Check your site, if it's normal, then it must be one of the plugins.
If it doesn't work, before reactivating the plugins, change to default theme (twenty eleven) andd see if it works with it.
For all I can see, this kind of problems most often come from misconfigured internal rewrite rules.
EDIT: Have you tried to not use pagination?
You can also try to debug by deactivate the canonical redirection by adding:
remove_action( 'template_redirect', 'redirect_canoncial ')
on your functions.php. This will disable the internal URL redirection.
upgrade your permalinks settings

How to check if mootools.js is actually being used within a web site?

I inherited a web site project that includes mootools.js (about 40k) in most of the scripts. However, I have not seen, intuitively, where it is being used and given the nature of this porject, ahem, I'm thinking it might not be being used at all!
I'm "under the gun" to ship this tonight (yup, it's a pre-Thanksgiving release). I have not used mootools.js so I'm not sure what to grep for or if there's a sure tell way to determine this. I don't want to have to JSLint it (or do I LOL). Any suggestions would be appreciated. Thanks.
Mootools grafts itself onto some of the native js stuff, so it might be hard to do just by code inspection unless you are very familiar with what MooTools gives you.
Remove it, run your automated tests.
Cause you have those, right?...
Remove it and see if anyone complains.
(You could try it on a test machine first, if you're not feeling brave.)
You can check your source code on some MooTools methods, for example, addEvent().
If it is used so here is the Mootols :)
Just check from the home page of http://mootools.net/
I also was interested on one site why they use jquery and mootools. So, I found addEvent() method. It is Mootols method.
You must have a dev version of the site. Just pull it out and go over pages see if stuff breaks. Mostly you will get unknown function type stuff, if there is any dependencies. Firebug is your friend.
1, Open firebug
2, Click the DOM tab
3, Check if the Mootools object exists (It will say the current version of mootools next to it).
Hope this helps
:)