Make run cell button float so it's always visible (#3895)

- Make the toolbar sticky and remove overflow:hidden which blocked this working.
This commit is contained in:
Kevin Cunnane
2019-02-04 09:32:38 -08:00
committed by GitHub
parent a62393e0ed
commit f1c8ec141a
3 changed files with 9 additions and 3 deletions

View File

@@ -4,8 +4,8 @@
* Licensed under the Source EULA. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
-->
<div style="overflow: hidden; width: 100%; height: 100%; display: flex; flex-flow: row">
<div #toolbar class="toolbar" style="flex: 0 0 auto; display: flex; flex-flow:column; width: 40px; min-height: 40px; padding-top: 10px; orientation: portrait">
<div style="width: 100%; height: 100%; display: flex; flex-flow: row">
<div #toolbar class="toolbar" style="flex: 0 0 auto; display: flex; flex-flow:column; width: 40px; min-height: 40px; orientation: portrait">
</div>
<div #editor class="editor" style="flex: 1 1 auto; overflow: hidden;">
</div>

View File

@@ -13,6 +13,12 @@ code-component .toolbar {
border-right-width: 1px;
}
code-component .toolbar .carbon-taskbar {
position: sticky;
top: 10px;
bottom: 30px;
}
code-component .toolbarIconRun {
height: 20px;
background-image: url('../media/light/execute_cell.svg');

View File

@@ -4,7 +4,7 @@
* Licensed under the Source EULA. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
-->
<div style="overflow: hidden; width: 100%; height: 100%; display: flex; flex-flow: column">
<div style="width: 100%; height: 100%; display: flex; flex-flow: column">
<div class="notebook-code" style="flex: 0 0 auto;">
<code-component [cellModel]="cellModel" [model]="model" [activeCellId]="activeCellId"></code-component>
</div>