Skip to content

Commit

Permalink
#7204 WIP
Browse files Browse the repository at this point in the history
  • Loading branch information
piorek committed May 17, 2018
1 parent 911f3de commit 19fcb50
Show file tree
Hide file tree
Showing 7 changed files with 226 additions and 49 deletions.
2 changes: 1 addition & 1 deletion js/notebook/src/shared/style/bootstrap.scss
Original file line number Diff line number Diff line change
Expand Up @@ -15,4 +15,4 @@
*/

$icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/";
//@import '~bootstrap-sass/assets/stylesheets/bootstrap';
@import '~bootstrap-sass/assets/stylesheets/bootstrap';
32 changes: 0 additions & 32 deletions js/notebook/src/shared/style/tree.scss

This file was deleted.

2 changes: 1 addition & 1 deletion js/notebook/src/tree/TreeWidget.ts
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ import TreeWidgetModel from "./Models/TreeWidgetModel";
import SyncIndicatorWidget from "./Widgets/SyncIndicatorWidget";
import OptionsWidget from "./Widgets/OptionsWidget";

import "./styles/tree.css";
import "./styles/tree.scss";

export default class TreeWidget extends Panel {

Expand Down
10 changes: 7 additions & 3 deletions js/notebook/src/tree/Widgets/JVMOptions/DefaultOptionsWidget.ts
Original file line number Diff line number Diff line change
Expand Up @@ -30,9 +30,13 @@ export default class DefaultOptionsWidget extends Widget implements DefaultOptio

public readonly HTML_ELEMENT_TEMPLATE = `
<div id="default_options">
<label class="control-label" for="heap_GB">Heap Size</label>
<input id="heap_GB" name="heap_size_prop" value="">
<span>GB</span>
<div class="bx-wrapper">
<label for="heap_GB">Heap Size</label>
<input id="heap_GB" name="heap_size_prop" value="">
<span>GB</span>
</div>
</div>
`;

Expand Down
11 changes: 5 additions & 6 deletions js/notebook/src/tree/Widgets/JVMOptions/OtherOptionsWidget.ts
Original file line number Diff line number Diff line change
Expand Up @@ -31,21 +31,20 @@ export default class OtherOptionsWidget extends Widget implements OtherOptionsWi

public readonly HTML_ELEMENT_TEMPLATE = `
<fieldset>
<div class="panel panel-default">
<div class="panel-heading">
<div class="bx-panel">
<div class="bx-panel-heading">
<label>Other Command Line Options</label>
Other Command Line Options
<button type="button"
id="add_option_jvm_sett"
class="btn btn-default btn-xs"
data-original-title="add new">
class="bx-btn">
<i class="fa fa-plus"></i>
</button>
</div>
<div id="other_property" class="panel-body"></div>
<div id="other_property" class="bx-panel-body"></div>
</div>
</fieldset>
`;
Expand Down
11 changes: 5 additions & 6 deletions js/notebook/src/tree/Widgets/JVMOptions/PropertiesWidget.ts
Original file line number Diff line number Diff line change
Expand Up @@ -30,21 +30,20 @@ export default class PropertiesWidget extends Widget {

public readonly HTML_ELEMENT_TEMPLATE = `
<fieldset>
<div class="panel panel-default">
<div class="panel-heading">
<div class="bx-panel">
<div class="bx-panel-heading">
<label>Properties</label>
Properties
<button type="button"
id="add_property_jvm_sett"
class="btn btn-default btn-xs"
data-original-title="add new">
class="bx-btn">
<i class="fa fa-plus"></i>
</button>
</div>
<div id="properties_property" class="panel-body"></div>
<div id="properties_property" class="bx-panel-body"></div>
</div>
</fieldset>
`;
Expand Down
207 changes: 207 additions & 0 deletions js/notebook/src/tree/styles/tree.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,207 @@
/*
* Copyright 2017 TWO SIGMA OPEN SOURCE, LLC
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

/*
* Copyright 2017 TWO SIGMA OPEN SOURCE, LLC
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

#beakerx-tree-widget.isLab {
width: 100%;
height: 100%;
overflow: auto;
box-sizing: border-box;
}

#beakerx-tree-widget label {
font-weight: 400;
}

#beakerx-tree-widget .p-TabBar {
min-height: 30px;
max-height: 30px;
}

#beakerx-tree-widget .p-TabBar-content {
min-width: 0;
align-items: flex-end;
border-bottom: 1px solid #ddd;
padding: 0 15px;
}

#beakerx-tree-widget .p-TabBar-tab {
flex: 0 1 auto;
min-height: 26px;
max-height: 26px;
min-width: 35px;
margin-left: -1px;
border: 1px solid transparent;
padding: 4px 15px;
}

#beakerx-tree-widget .p-TabBar-tab:first-child {
margin-left: 0;
}

#beakerx-tree-widget .p-TabBar-tab.p-mod-current {
background-color: #fff;
border-color: #ddd;
border-bottom-color: transparent;
transform: translateY(1px);
}

#beakerx-tree-widget .p-TabBar-tab:hover:not(.p-mod-current) {
background: #F0F0F0;
}

.bx-banner-widget {
padding: 15px;
}

.bx-banner-widget .beakerx_site_link {
display: inline-block;
margin: 0 75px 0 0;
}

.bx-banner-widget svg {
width: 154px;
height: 44px;
transform: translateY(5px);
}

.bx-options-widget {
padding: 15px 0;
display: flex;
}

.bx-options-widget .p-TabPanel-stackedPanel {
left: 15px;
right: 15px;
}

.bx-ui-options-widget,
.bx-jvm-options-widget {
left: 10px;
right: 10px;
padding: 15px;
}

.bx-ui-options-widget .form-check-label {
margin-left: 10px;
}

.bx-sync-indicator-widget {
padding: 15px;
}
.bx-sync-indicator-widget .saving { color: #f0ad4e; }
.bx-sync-indicator-widget .saved { color: #5cb85c; }

.bx-sync-indicator-widget .errors-wrapper { color: #ff0000; }

#properties_property .form-control {
margin-right: 10px;
}

#other_property .form-control {
margin-right: 10px;
}

// ========== NEW
$bxBorderColor1: #cccccc;
$bxBgColor1: #ffffff;
$bxBgColor2: #eeeeee;

#beakerx-tree {

#default_options {
margin: 0 0 18px 0;

.bx-wrapper {
display: flex;
align-items: stretch;

label {
margin: 0 6px 0 0;
line-height: 32px;
}

input {
height: 32px;
padding: 6px 12px;
font-size: 13px;
line-height: 1;
background-color: $bxBgColor1;
border: 1px solid $bxBorderColor1;
border-collapse: collapse;
border-radius: 2px 0 0 2px;
}

span {
background-color: $bxBgColor2;
border: 1px solid $bxBorderColor1;
line-height: 30px;
padding: 0 12px;
font-size: 13px;
border-radius: 0 2px 2px 0;
border-left-width: 0;
}
}
}

.bx-panel {
border: 1px solid $bxBorderColor1;
border-radius: 2px;
margin-bottom: 18px;

.bx-panel-heading {
background-color: $bxBgColor2;
padding:10px;
border-bottom: 1px solid $bxBorderColor1;

display: flex;

.bx-btn {
border: 1px solid $bxBorderColor1;
border-radius: 2px;
margin: 0 0 0 6px;
background-color: $bxBgColor1;
padding: 2px 6px;
font-size: 1em;
line-height: 1;

&:hover {
background-color: $bxBgColor2;
}
}
}

.bx-panel-body {
padding:10px;
}
}

}

0 comments on commit 19fcb50

Please sign in to comment.