User:Peterwhy/BSiconTooltips/sandbox.css

/* User:Peterwhy/BSiconTooltips */

/*	styles for tooltip box .bs-overlap .bs-quote-link { display:inline-block; position:relative; vertical-align:middle; color:white; } .bs-overlap .bs-quote-tooltip { position:absolute; top:-.8em; right:0px; height:1.6em;

margin-right:8px; border-radius:.8em; box-shadow:0px 0px 4px black; padding: 0em .5em; line-height:1.6em; white-space:nowrap; text-decoration:inherit; background-color:black; color: white; opacity: 0.9; display: none; background: #45484d; /* Old browsers */ background: -moz-linear-gradient(-45deg, #45484d 0%, #000000 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#45484d), color-stop(100%,#000000)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(-45deg, #45484d 0%,#000000 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(-45deg, #45484d 0%,#000000 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(-45deg, #45484d 0%,#000000 100%); /* IE10+ */ background: linear-gradient(135deg, #45484d 0%,#000000 100%); /* W3C */ }

.bs-overlap .bs-quote-tooltip.bs-inconsistent:before, .bs-overlap .bs-quote-tooltip.bs-no-file:before { margin-right: .3em; margin-left: -.5em; height: 1.6em; width: 1.6em; line-height: 1.6em; border-radius: .8em; text-align:center; vertical-align:bottom; font-weight:bold; display:inline-block; cursor:inherit; } .bs-overlap .bs-quote-tooltip.bs-inconsistent:before { content: ">"; color: white; background-color: navy; } .bs-overlap .bs-quote-tooltip.bs-no-file:before { content: "?"; color: white; background-color: #BA0000; } .bs-overlap .bs-quote-tooltip.bs-inconsistent.bs-no-file:before { content: "!"; color: black; background-color: gold; }

/*	BSicons .bs-overlap .bs-icon { background-color: transparent; /* timing when de-selected */ transition: box-shadow .1s, background-color .1s; -moz-transition: box-shadow .1s, background-color .1s; -webkit-transition: box-shadow .1s, background-color .1s; -o-transition: box-shadow .1s, background-color .1s; -ms-transition: box-shadow .1s, background-color .1s; } .bs-overlap.selected .bs-icon { background-color: rgb(249, 249, 249); background-color: rgba(249, 249, 249, .9); /* timing when selected */ transition: box-shadow .2s, background-color .2s; -moz-transition: box-shadow .2s, background-color .2s; -webkit-transition: box-shadow .2s, background-color .2s; -o-transition: box-shadow .2s, background-color .2s; -ms-transition: box-shadow .2s, background-color .2s; } .bs-overlap.selected .bs-base { box-shadow: 0px 0px 3px black; } .bs-overlap.selected .bs-superimpose-wrapper:nth-of-type(1) .bs-superimpose { box-shadow: 0px 0px 6px black; } .bs-overlap.selected .bs-superimpose-wrapper:nth-of-type(2) .bs-superimpose { box-shadow: 0px 0px 9px black; } .bs-overlap.selected .bs-superimpose-wrapper:nth-of-type(3) .bs-superimpose { box-shadow: 0px 0px 12px black; } .bs-overlap.selected .bs-superimpose-wrapper:nth-of-type(4) .bs-superimpose { box-shadow: 0px 0px 15px black; } .bs-overlap.selected .bs-superimpose-wrapper:nth-of-type(5) .bs-superimpose { box-shadow: 0px 0px 18px black; }

.bs-overlap .bs-superimpose-wrapper { /* timing when deselected */ transition: transform .1s; -moz-transition: -moz-transform .1s; -webkit-transition: -webkit-transform .1s; -o-transition: -o-transform .1s; -ms-transition: -ms-transform .1s; } .bs-overlap.selected .bs-superimpose-wrapper { /* timing when selected */ transition: transform .2s; -moz-transition: -moz-transform .2s; -webkit-transition: -webkit-transform .2s; -o-transition: -o-transform .2s; -ms-transition: -ms-transform .2s; } .bs-overlap.selected .bs-superimpose-wrapper:nth-of-type(1) { -moz-transform: rotate(6deg); -webkit-transform: rotate(6deg); -o-transform: rotate(6deg); -ms-transform: rotate(6deg); transform: rotate(6deg); } .bs-overlap.selected .bs-superimpose-wrapper:nth-of-type(2) { -moz-transform: rotate(12deg); -webkit-transform: rotate(12deg); -o-transform: rotate(12deg); -ms-transform: rotate(12deg); transform: rotate(12deg); } .bs-overlap.selected .bs-superimpose-wrapper:nth-of-type(3) { -moz-transform: rotate(18deg); -webkit-transform: rotate(18deg); -o-transform: rotate(18deg); -ms-transform: rotate(18deg); transform: rotate(18deg); } .bs-overlap.selected .bs-superimpose-wrapper:nth-of-type(4) { -moz-transform: rotate(24deg); -webkit-transform: rotate(24deg); -o-transform: rotate(24deg); -ms-transform: rotate(24deg); transform: rotate(24deg); } .bs-overlap.selected .bs-superimpose-wrapper:nth-of-type(5) { -moz-transform: rotate(30deg); -webkit-transform: rotate(30deg); -o-transform: rotate(30deg); -ms-transform: rotate(30deg); transform: rotate(30deg); }

.bs-overlap.bs-empty { /* timing when de-selected */ transition: box-shadow .1s; } .bs-overlap.bs-empty.selected { box-shadow: 0px 0px 3px grey; /* timing when selected */ transition: box-shadow .2s; }

/*	Bad links .bs-overlap a.new{ width: 20px; height: 0px; padding: 10px 0px; display: inline-block; vertical-align: middle; line-height: 0px; overflow: hidden; white-space: nowrap; }