peek42
Version:
Touch based browser console
214 lines (180 loc) • 3.48 kB
CSS
@font-face {
font-family: "monofur";
font-style: normal;
font-weight: normal;
src: local("monofur"), url("monofur.woff") format("woff");
}.peek42-dev, .peek42-dev * {
margin: 0.3em ;
padding: 0.3em ;
border: 1px dashed fuchsia ;
}
.peek42-console {
position: fixed;
z-index: 500;
right: 0.5ex;
bottom: 0.5ex;
left: 0.5ex;
margin: 0;
padding: 0.1em;
border: 1px solid #563d7c;
border-radius: 0.5ex;
box-shadow: 0 0 1em #563d7c;
opacity: 0.85;
background: #f5f5f5;
color: #563d7c;
font-family: Avenir, sans-serif;
font-size: 22px;
text-align: left;
}
.peek42-flash-size-limit {
border-color: red ;
}
.peek42-flash-notice {
box-shadow: 0 0 1em blue ;
}
.peek42-flash-success {
box-shadow: 0 0 1em green ;
}
.peek42-flash-warning {
box-shadow: 0 0 1em orange ;
}
.peek42-flash-error {
box-shadow: 0 0 1em red ;
}
.peek42-bar {
display: flex;
flex-flow: row;
justify-content: flex-end;
align-items: center;
margin: 0;
padding: 0 0.15em 0 0.15em;
}
.peek42-control {
margin: 0;
padding: 0 0.3em 0 0.3em;
font-size: 103%;
}
.peek42-control:hover {
cursor: pointer;
}
.peek42-title {
-webkit-user-select: none;
user-select: none;
margin-right: auto;
font-weight: bold;
}
.peek42-eval {
flex: 1;
margin: 0 0.3em 0 0.3em;
font-family: Monofur, monospace;
font-size: 18px;
line-height: 25px;
}
.peek42-quietl {
-webkit-user-select: none;
user-select: none;
}
.peek42-clear {
-webkit-user-select: none;
user-select: none;
}
.peek42-toggle {
-webkit-user-select: none;
user-select: none;
}
.peek42-view {
display: flex;
flex-flow: row;
justify-content: flex-end;
align-items: top;
margin: 0;
padding: 0;
}
.peek42-log {
flex: 1;
overflow: scroll;
height: 42px;
margin: 0;
padding: 0;
background: #f5f5f5;
color: navy;
font-family: Monofur, monospace;
font-size: 20px;
line-height: 1em;
}
.peek42-bar1 {
display: flex;
flex-flow: column;
justify-content: flex-start;
align-items: center;
overflow: hidden;
min-width: 2em;
margin: 0;
padding: 0;
}
.peek42-bar1-control {
box-sizing: border-box;
min-width: 2em;
margin: 0.2ex 0;
padding: 0.3ex 0;
border: 1px solid;
border-radius: 0.5ex;
color: #00004d;
text-align: center;
}
.peek42-entries-info {
border: 3px solid blue;
}
.peek42-entries-info-active {
background: blue;
color: white;
}
.peek42-entries-log {
border: 3px solid green;
}
.peek42-entries-log-active {
background: green;
color: white;
}
.peek42-entries-warn {
border: 3px solid orange;
}
.peek42-entries-warn-active {
background: orange;
color: white;
}
.peek42-entries-error {
border: 3px solid red;
}
.peek42-entries-error-active {
background: red;
color: white;
}
.peek42-log-entry-info {
border-left: 3px solid blue ;
}
.peek42-log-entry-log {
border-left: 3px solid green ;
}
.peek42-log-entry-warn {
border-left: 3px solid orange ;
}
.peek42-log-entry-error {
border-left: 3px solid red ;
}
.peek42-log-entry-simple {
margin-bottom: 0.4ex ;
padding-left: 0.4ex ;
}
.peek42-log-entry {
margin-bottom: 0.4ex ;
padding-left: 0.4ex ;
}
.peek42-log-entry-toggle {
color: black;
font-family: monospace;
}
.peek42-log-entry-desc {
margin-left: 0.2ex;
color: #00004d;
}