You Should Not Remove Outline

Outline is CSS property that visually highlights element. It is very often used to create accessible way of pointing elements which are focused. It is meant to be shown for users who navigates with keyboard. Without outline users with keyboard only navigation have troubles using the web site. This is the reason why you should not remove outline!

Users who navigates with mouse also see outline as it is being added on any focused elements. It is tempting to remove outline completely using CSS code like:

:focus { outline: none; }

But, again, do not do this! Do not remove outline from the web site.

If you do not like how outline looks like, actually you have two options here:

1. Style it better. Style it so it looks good even when visible. Use CSS for this.
2. Disable outline temporarily when user does not use the keyboard and enable it again when user starts using the keyboard.

The first option given is not ideal, but easy to do and straightforward.

The second option might be hard to implement. Luckily, we have prepared the solution for you! This is the JS code that does exactly what we need:

(function(d){
	var style_element = d.createElement('STYLE'),
	    dom_events = 'addEventListener' in d,
	    add_event_listener = function(type, callback){
			if(dom_events){
				d.addEventListener(type, callback);
			}else{
				d.attachEvent('on' + type, callback);
			}
		},
	    set_css = function(css_text){
			!!style_element.styleSheet ? style_element.styleSheet.cssText = css_text : style_element.innerHTML = css_text;
		}
	;

	d.getElementsByTagName('HEAD')[0].appendChild(style_element);
	add_event_listener('mousedown', function () {
		set_css('div.builderiusContent :is(*):focus{outline:0}div.builderiusContent :is(*)::-moz-focus-inner{border:0;}');
	});
	add_event_listener('keydown', function () {
		set_css('');
	});
})(document);

This code is from https://github.com/lindsayevans/outline.js with a small modification of CSS selector that, we believe, works better in Builderius templates.