Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
@mixin all-reset {
azimuth: center;
background: #fff;
border: none;
bottom: auto;
caption-side: top;
clear: none;
clip: auto;
color: #000;
content: '';
counter-increment: none;
counter-reset: none;
cue: none;
cue-after: none;
cue-before: none;
cursor: auto;
direction: ltr;
display: block;
elevation: level;
empty-cells: show;
float: none;
font: normal;
height: auto;
left: auto;
letter-spacing: none;
list-style: disc outside none;
margin: 0;
marker-offset: auto;
marks: none;
max-height: none;
max-width: none;
min-height: 0;
min-width: 0;
orphans: 2;
outline: none;
overflow: visible;
padding: 0;
page: auto;
page-break-after: auto;
page-break-before: auto;
page-break-inside: auto;
position: static;
right: auto;
size: auto;
speak: none;
table-layout: auto;
text-align: left;
text-decoration: none;
text-indent: 0;
text-shadow: none;
text-transform: none;
top: auto;
unicode-bidi: none;
vertical-align: baseline;
visibility: visible;
white-space: normal;
windows: 2;
width: auto;
z-index: auto;
/* Usage::
var element = $E([
"<div class='window'>",
"<div class='message'>#{message}</div>",
"<input type='button' class='ok' value='#{ok}'/> <input type='button' class='cancel' value='#{cancel}'/>",
].join(""), {
data: {
message : message || "dialog",
ok : opts.ok || "OK",
cancel : opts.cancel || "Cancel"
parent: document.body
var style = resetStyle(element, [
"._.window {",
"border: 0.3em solid #ccc;",
"-moz-border-radius: 1em;",
"padding: 1em;",
"margin: 1em;",
"line-height: 1.33;",
"._ .message {",
"margin : 1em;",
"padding: 1em 0;",
"margin: 0 0.5em;",
"._ input {",
"display: inline;",
"border: 0.3em solid #ccc;",
"-moz-border-radius: 1em;",
"width: 7em;",
"padding: 0.2em 0;",
"text-align: center;",
"margin: 0 0.5em;",
style.position = "absolute"; = "0";
style.left = "0";
function resetStyle (ele, addtional) {
if (! { = [
"azimuth: center;",
"background: #fff;",
"border: none;",
"bottom: auto;",
"caption-side: top;",
"clear: none;",
"clip: auto;",
"color: #000;",
"content: '';",
"counter-increment: none;",
"counter-reset: none;",
"cue: none;",
"cue-after: none;",
"cue-before: none;",
"cursor: auto;",
"direction: ltr;",
"display: block;",
"elevation: level;",
"empty-cells: show;",
"float: none;",
"font: normal;",
"height: auto;",
"left: auto;",
"letter-spacing: none;",
"list-style: disc outside none;",
"margin: 0;",
"marker-offset: auto;",
"marks: none;",
"max-height: none;",
"max-width: none;",
"min-height: 0;",
"min-width: 0;",
"orphans: 2;",
"outline: none;",
"overflow: visible;",
"padding: 0;",
"page: auto;",
"page-break-after: auto;",
"page-break-before: auto;",
"page-break-inside: auto;",
"position: static;",
"right: auto;",
"size: auto;",
"speak: none;",
"table-layout: auto;",
"text-align: left;",
"text-decoration: none;",
"text-indent: 0;",
"text-shadow: none;",
"text-transform: none;",
"top: auto;",
"unicode-bidi: none;",
"vertical-align: baseline;",
"visibility: visible;",
"white-space: normal;",
"windows: 2;",
"width: auto;",
"z-index: auto;",
var className = "scriptreset" + String(Math.random()).slice(2);
var style = document.createElement('style');
style.type = "text/css";
"." + className + " ,",
"." + className + " * {",;/g, " !important;"),
"} ",
addtional.replace(/;/g, " !important;").replace(/_/g, className) || ""
ele.className += " " + className;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment