Bitweaver - Colourstrap

Created by: Lester Caine, Last modification: 4 September 2025

This is a combination of the silk icon set with Bootstrap3 to restore full colour icons to all of my websites. This needs tidying up and bringing in line with the original icon names used in Bitweaver but while I had hacked templates to change from fa- format icons to icon- ones, I've taken the opportunity when merging back with the Bitweaver code base to simply add aliases for the fa- links to the colourstrap .css file and remove that miss-match. The next step is something that is long over due, and that is adding the icons missing from the silk set that currently come up as text rather than icons.

The process of building a larger sprite sheet is a work in progress and I need to port the code that was worked out on Mistral into the icon management section of Bitweaver. The way that the sprite process works is less of a mystery to me now, and I understand what also needs changing to perhaps address the creation of a 32px version in parallel with the current 16px build.

The base set of style script applies to all icons and just needed the extra lines for fa-, this is then backed up with a list of individual icons and their aliases with their position information.

[class^="fa-"],
[class*="fa-"],
[class^="icon-"],
[class*=" icon-"] {
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-top: 1px;
	margin-right: .3em;
	line-height: 16px;
	vertical-align: text-top;
	background-image: url("/externals/bootstrap-3.2/colourstrap/silk-sprite.png");
	background-position: 16px 16px;
	background-repeat: no-repeat;
}
.fa-house,
.icon-application-home,
.icon-home {
	background-position: -272px -0px;
	width: 16px;
	height: 16px;
}