8bitworkshop/css/ui.css

.dbg_info {
  font-size: 0.8em;
}
.gutter-offset {
  width: 3em;
}
.gutter-bytes {
  width: 6em;
}
.gutter-clock {
  width: 0.5em;
}
.gutter-info {
  width: 1em;
}
.tooltipbox {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}
.tooltipbox .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;

    /* Position the tooltip */
    position: absolute;
    z-index: 10;
}
.tooltipbox:hover .tooltiptext {
    visibility: visible;
}
#controls_top {
  position: absolute;
  padding: 0.5em;
  height:3em;
  width:100%;
  background-color:#999;
}
#notebook {
  position:absolute;
  top:3em;
  bottom:0;
  left:0;
  right:0;
  background-color: #666;
  overflow: hidden;
}
#workspace {
  background-color:#333;
  width:50%;
}
div.editor {
  line-height:1.25;
  font-size:12pt;
}
div.emulator {
  position:absolute;
  left:50%;
  top:0;
  width:50%;
  background-color: #666;
  margin-top: 20px auto 0;
}
div.debugwindow {
  position:absolute;
  left:50%;
  top:0;
  width:50%;
  background-color: #666;
  color: #66ff66;
  white-space: pre;
  margin-top: 20px auto 0;
  font-family: "Andale Mono", "Menlo", "Lucida Console", monospace;
  font-size: 10pt;
}
div.mem_info {
  position: fixed;
  left: 51%;
  bottom: 10px;
  background-color: #333;
  color: #66ff66;
  white-space: pre;
  padding: 20px;
  z-index: 12;
  font-family: "Andale Mono", "Menlo", "Lucida Console", monospace;
  font-size: 12pt;
}
.btn_group {
  border-radius:6px;
  padding:6px;
  margin-left:8px;
  background-color: #666;
}
.btn_group.debug_group {
}
.btn_group.view_group {
}
.seg_code { color: #ff9966; }
.seg_data { color: #66ff66; }
.seg_stack { color: #ffff66; }
.seg_unknown { color: #cccccc; }
span.hilite {
  color: #ff66ff;
}
div.has-errors {
  background-color: #ff6666 !important;
}
div.is-busy-unused {
  background-color: #8888bb !important;
}
div.menu_div {
  position: absolute;
  width: 200px;
}
div.booklink {
  position: fixed;
  bottom: 0;
  right: 0;
  padding: 6px;
  background-color: #ffffff;
  display:none;
}
div.twitbtn {
  position: fixed;
  bottom: 0;
  left: 50%;
  padding: 6px;
}
a {
  color:#333399;
  font-weight: bold;
}
a.dropdown-toggle {
  color:#66ee66;
  padding:3px;
}
// http://stackoverflow.com/questions/18023493/bootstrap-3-dropdown-sub-menu-missing
.dropdown-submenu {
    position:relative;
}
.dropdown-submenu>.dropdown-menu {
    top:0;
    left:100%;
    margin-top:-6px;
    margin-left:-1px;
    -webkit-border-radius:0 6px 6px 6px;
    -moz-border-radius:0 6px 6px 6px;
    border-radius:0 6px 6px 6px;
}
.dropdown-submenu:hover>.dropdown-menu {
    display:block;
}
.dropdown-submenu>a:after {
    display:block;
    content:" ";
    float:right;
    width:0;
    height:0;
    border-color:transparent;
    border-style:solid;
    border-width:5px 0 5px 5px;
    border-left-color:#cccccc;
    margin-top:5px;
    margin-right:-10px;
}
.dropdown-submenu:hover>a:after {
    border-left-color:#ffffff;
}
.dropdown-submenu.pull-left {
    float:none;
}
.dropdown-submenu.pull-left>.dropdown-menu {
    left:-100%;
    margin-left:10px;
    -webkit-border-radius:6px 0 6px 6px;
    -moz-border-radius:6px 0 6px 6px;
    border-radius:6px 0 6px 6px;
}
.emubevel {
  width:100%;
  height:100%;
  padding:4%;
  background:#333;
}
.emuvideo {
  border-radius:20px;
  border: 4px solid #222;
  padding: 30px;
  margin-top: 20px;
  margin-bottom: 20px;
  background: #000;
  outline-color: #666;
  width: 100%;
  height: 100%;
}
canvas.pixelated {
  image-rendering: optimizeSpeed;             /* Older versions of FF          */
  image-rendering: -moz-crisp-edges;          /* FF 6.0+                       */
  image-rendering: -webkit-optimize-contrast; /* Safari                        */
  image-rendering: -o-crisp-edges;            /* OS X & Windows Opera (12.02+) */
  image-rendering: pixelated;                 /* Awesome future-browsers       */
  -ms-interpolation-mode: nearest-neighbor;   /* IE                            */
}
.palbtn {
  width:2em;
  height:2em;
  border-style:none;
}
.selected {
  border-width:2px;
  border-color:white;
  border-style:dotted;
}