fx-compat: Fix up Scaffold a bit

- Output pane no longer gets huge after load
- URL box grows
- Metadata grid fills available space (but still needs work re overflow)
- row-resize cursor on Tests splitter
This commit is contained in:
Abe Jellinek 2024-03-29 12:05:59 -04:00 committed by Dan Stillman
parent 0f61646e26
commit 1b646fb6e2
2 changed files with 14 additions and 6 deletions

View file

@ -416,7 +416,7 @@
</hbox> </hbox>
</toolbar> </toolbar>
<hbox id="appcontent" flex="1"> <hbox id="appcontent" flex="1">
<tabbox id="left-tabbox" flex="1" width="300"> <tabbox id="left-tabbox">
<tabs id="tabs"> <tabs id="tabs">
<tab id="tab-metadata" label="&scaffold.tabs.metadata.label;"/> <tab id="tab-metadata" label="&scaffold.tabs.metadata.label;"/>
<tab id="tab-code" label="&scaffold.tabs.code.label;"/> <tab id="tab-code" label="&scaffold.tabs.code.label;"/>
@ -524,7 +524,7 @@
<vbox flex="1"> <vbox flex="1">
<hbox align="center"> <hbox align="center">
<label control="textbox-tabUrl" value="&scaffold.tabUrl.label;"/> <label control="textbox-tabUrl" value="&scaffold.tabUrl.label;"/>
<html:input id="browser-url" style="-moz-box-flex: 1;"/> <html:input id="browser-url" style="flex: 1;"/>
<button observes="validate-tests" label="&scaffold.testing.create.web;" tooltiptext="Create a new test from the current page" oncommand="Scaffold.saveTestFromCurrent('web')"/> <button observes="validate-tests" label="&scaffold.testing.create.web;" tooltiptext="Create a new test from the current page" oncommand="Scaffold.saveTestFromCurrent('web')"/>
</hbox> </hbox>
@ -550,7 +550,6 @@
</tabpanels> </tabpanels>
</tabbox> </tabbox>
<splitter id="pane-splitter" resizeafter="farthest" /> <splitter id="pane-splitter" resizeafter="farthest" />
<vbox id="right-pane"> <vbox id="right-pane">
<html:textarea id="output" readonly="true"/> <html:textarea id="output" readonly="true"/>
</vbox> </vbox>

View file

@ -71,7 +71,7 @@ tab {
} }
#metadata-grid { #metadata-grid {
-moz-box-flex: 1; flex: 1;
display: grid; display: grid;
align-content: start; align-content: start;
align-items: center; align-items: center;
@ -119,12 +119,20 @@ browser,
} }
vbox > splitter { vbox > splitter {
cursor: row-rgb(4, 4, 4)e; cursor: row-resize;
} }
#left-tabbox { #left-tabbox {
flex: 1;
min-width: 500px;
margin: 5px; margin: 5px;
width: 100% !important; overflow: clip;
tabpanel {
display: flex;
width: 100%;
min-width: 0;
}
} }
#checkboxes-translatorType { #checkboxes-translatorType {
@ -138,6 +146,7 @@ vbox > splitter {
} }
#right-pane { #right-pane {
min-width: 350px;
margin: -16px -16px -16px 0px; margin: -16px -16px -16px 0px;
border-left: var(--material-panedivider); border-left: var(--material-panedivider);