4aba4cc503
See #156. This change adjusts the project manager to have a loading bar during lengthy operations. It also adds a `tick()` method that queues up operations in 15ms chunks--we'll still blow the frame budget most times, but it keeps things reasonably responsive (at least until the render tree has to be added to the DOM).
79 lines
No EOL
1.2 KiB
Text
79 lines
No EOL
1.2 KiB
Text
* {
|
|
box-sizing: border-box;
|
|
text-rendering: optimizeLegibility;
|
|
}
|
|
|
|
html, body {
|
|
height: 100%;
|
|
background: @background;
|
|
color: @foreground;
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
padding: 0;
|
|
font-family:
|
|
"Segoe UI", //windows
|
|
"Lucida Sans", //os x
|
|
"Droid Sans", //ubuntu?
|
|
"Liberation Sans", //other linux?
|
|
sans-serif; //fallback
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: stretch;
|
|
align-content: stretch;
|
|
}
|
|
|
|
a[target] {
|
|
color: @foreground;
|
|
}
|
|
|
|
:focus {
|
|
outline: @accent auto 5px;
|
|
}
|
|
|
|
//MACRO-LEVEL POSITIONING
|
|
|
|
.toolbar {
|
|
flex: 0 0 30px;
|
|
-webkit-transform: translateZ(0);
|
|
transform: translateZ(0);
|
|
}
|
|
|
|
.tabs {
|
|
flex: 0 0 32px;
|
|
}
|
|
|
|
.central {
|
|
display: flex;
|
|
flex-grow: 1;
|
|
align-items: stretch;
|
|
align-content: stretch;
|
|
}
|
|
|
|
.editing {
|
|
display: flex;
|
|
flex-grow: 1;
|
|
align-items: stretch;
|
|
align-content: stretch;
|
|
flex-direction: column;
|
|
}
|
|
|
|
#editor {
|
|
flex-grow: 1;
|
|
padding-top: 2px;
|
|
z-index: 9;
|
|
}
|
|
|
|
.bottom-bar {
|
|
flex: 0 0 auto;
|
|
align-self: flex-end;
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-content: stretch;
|
|
box-shadow: 0 -4px 4px rgba(0, 0, 0, .1);
|
|
z-index: 99;
|
|
-webkit-transform: translateZ(0);
|
|
transform: translateZ(0);
|
|
} |