heading decorated

dabblet.css

/**
 * heading decorated
 */

h1
{
	font-size: 1.25em; /* use relative unit */
	text-align: center;
	background:
		linear-gradient(
			to right,
			transparent 50%,
			white 50%
		) repeat 100% 100%/4px 100%,
		linear-gradient(
			to bottom,
			transparent 50%,
			black 50%,
			black calc(50% + 1px),
			transparent calc(50% + 1px)
		);
}

h1::first-line
{
	background: white;
}

h1::before,
h1::after
{
	content: "";
	display: inline-block;
	width: 1em;
}

dabblet.html

<h1>Heading</h1>

dabblet.js

// alert('Hello world!');

settings.json

{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}