formatting js test1

This is a pure html+CSS Javascript prettifier. HTML markup is very rich in classnames, and for each AST node an HTML element is created and structure is preserved in a straightforward way.

All the CSS style that give the prettify stuff like espaces, indenting and colors is available at the right and is editable by the user, just edit it and press the button "do it".

For more information go to the style_prettify1 indentator implementation sources.

Original Code

Prettify CSS

You can edit this style that will apply to prettify generated markup.

/* warning, the CSS property 'content' do not work here and can be very useful 
	in this case, but it should work in a pure CSS stylesheet. In fact, don't use 
	this text area example, use a .css !! this is only for demo purposes*/

/*general */
b {
	font-size: 1.0em; 
	font-family: monospace; 
	font-weight: normal; font-style: 0; text-decoration: 0;
}

/*statements and blocks */
.BlockStatement, 
.SwitchCase, 
.ObjectProperty {
	display: block;
	margin-left: 2.1em;
}
.statement, 
.declaration { 
	display: block;
}
.EmptyStatement{
	display: inline;
}
.Block, Line {display: block;}

/* operands */

.operand{
	color: red; 
	padding-right: 1.5em; 
}
.comma{
	color: red; 
	padding-right: 1.5em; 
}
.dot{
	padding: 0;
}

.Identifier{
	color: green;
	padding-right: 1.5em;
}
.keyword{
	color: blue;
	padding-right: 1.5em; 
}

.Literal{
	color: #c3a63f; 
}

.paren-left, .paren-right, 
.square-left, .square-right, 
.curly-left, .curly-right {
	color: pink; 
}

.noNewLine{display: inline;}/*must be at last*/

Apply this configuration

JavaScript Code prettifier

Original Code

Prettify CSS

Prettify Style 1