diff --git a/nbextensions/advancedViewCell/styles/main.css b/kbase-extension/static/kbase/css/advancedViewCell.css similarity index 100% rename from nbextensions/advancedViewCell/styles/main.css rename to kbase-extension/static/kbase/css/advancedViewCell.css diff --git a/nbextensions/editorCell/styles/main.css b/kbase-extension/static/kbase/css/editorCell.css similarity index 85% rename from nbextensions/editorCell/styles/main.css rename to kbase-extension/static/kbase/css/editorCell.css index 002061220b..8acfb685c4 100644 --- a/nbextensions/editorCell/styles/main.css +++ b/kbase-extension/static/kbase/css/editorCell.css @@ -27,25 +27,12 @@ .kb-editor-cell .kb-app-parameter-row .message.-error { background: #f2dede; -} - -.kb-editor-cell .kb-app-parameter-row .message.-warning { - xbackground: yellow; + color: #f44336; } .kb-editor-cell .kb-app-parameter-row .message { text-align: center; font-family: 'Oxygen', sans-serif; - - /* font-size: 9pt; */ -} - -.kb-editor-cell .kb-app-parameter-row .message.-error { - color: #f44336; -} - -.kb-editor-cell .kb-app-parameter-row .message.-warning { - xcolor: orange; } /* not sure how to get text in these divs to valign middle... */ @@ -54,22 +41,13 @@ color: #777; text-align: left; vertical-align: bottom; - xmargin-top: 3px; padding-right: 4px; padding-left: 0; white-space: normal; - xborder-bottom: 1px #ddd dotted; } .kb-editor-cell .kb-app-parameter-input { vertical-align: middle; - xwhite-space: nowrap; - xpadding-left: 10px; - xborder-bottom: 1px #ccc dotted; -} - -.kb-editor-cell .kb-app-parameter-input input { - xfont-weight: bold; } .kb-editor-cell .kb-app-parameter-input select.form-control { @@ -77,7 +55,7 @@ } /* -This set of styles is a to accomodate the required/satisfied icon which appears +This set of styles is to accommodate the required/satisfied icon which appears between the select input control and the help text to the right of it. The problem is that within the columns used for layout the select is set to 100% width and yet the icon is placed right next to it. The result is that the icon is shoved @@ -88,11 +66,6 @@ in the column in which the icon lives, and does this by shrinking the select control with padding, and then scooting the icon back into its column. */ -/* .kb-editor-cell .kb-app-parameter-input > div { - allow space for the required (red arrow), satisfied (green checkbox) icon - padding-right: 20px; -} -*/ .kb-editor-cell .kb-app-parameter-input .kb-app-parameter-accepted-glyph, .kb-editor-cell .kb-app-parameter-input .kb-app-parameter-required-glyph { /* This scoots the icon inside */ @@ -104,15 +77,12 @@ control with padding, and then scooting the icon back into its column. color: #f44336; } -.kb-editor-cell .kb-app-parameter-hint { - padding-left: 7px; -} - .kb-editor-cell .kb-parameter-data-selection { font-weight: bold; } .kb-editor-cell .kb-app-parameter-hint { + padding-left: 7px; color: #777; text-align: left; margin-top: 3px; @@ -171,11 +141,6 @@ control with padding, and then scooting the icon back into its column. padding: 3px 5px; } -.kb-editor-cell .kb-app-subtitle { - background-color: #f5f5f5; - padding: 3px 5px; -} - .kb-editor-cell .panel-title > [data-toggle="collapse"]::before { display: inline-block; margin-left: 0; @@ -326,13 +291,6 @@ warning: orange margin-bottom: 0; } -.btn.kb-editor-cell-btn.btn-danger.active:hover { - color: rgb(209, 82, 65); - background-color: #ddd; - border-bottom: 2px rgb(209, 82, 65) solid; - margin-bottom: 4px; -} - .btn.kb-editor-cell-btn.btn-danger.active { color: white; background-color: rgb(209, 82, 65); @@ -350,33 +308,20 @@ warning: orange /* DISABLED is gray border and text */ -/* -.btn.kb-editor-cell-btn.btn-primary.disabled:hover { - color: #888; - background-color: #FFF; - border-bottom: 2px #888 solid; - margin-bottom: 4px; -} -*/ - .btn.kb-editor-cell-btn.disabled, .btn.kb-editor-cell-btn.disabled:hover, .btn.kb-editor-cell-btn.disabled:active { color: #888; - xbackground-color: #fff; border: 2px #888 solid; margin-bottom: 4px; } .kb-editor-cell [data-element="run-control-panel"] { - xpadding-left: 8px; width: 100%; } .kb-editor-cell [data-element="tab-pane"] { border-top: 2px rgb(33, 150, 243) solid; - xborder: 1px solid rgb(32, 77, 16); - xbackground-color: #f5f5f5; } .kb-editor-cell [data-element="tab-pane"] > div:empty { @@ -387,10 +332,6 @@ warning: orange padding: 4px; } -.kb-editor-cell .btn.disabled { - xbackground-color: #fff; -} - .kb-editor-cell .btn-primary.kb-btn-action.-rerun { color: rgb(33, 150, 243); } diff --git a/nbextensions/advancedViewCell/main.js b/nbextensions/advancedViewCell/main.js index 1c3bfe73c1..5e76f9d4e9 100644 --- a/nbextensions/advancedViewCell/main.js +++ b/nbextensions/advancedViewCell/main.js @@ -31,11 +31,10 @@ define([ 'common/appUtils', 'common/jupyter', 'common/spec', - // './widgets/codeCellRunWidget', 'kb_service/utils', 'kb_service/client/workspace', 'css!kbase/css/appCell.css', - 'css!./styles/main.css', + 'css!kbase/css/advancedViewCell.css', 'bootstrap', 'custom/custom' ], function( diff --git a/nbextensions/appCell2/main.js b/nbextensions/appCell2/main.js index a7b955d8ae..c3848ff3ea 100644 --- a/nbextensions/appCell2/main.js +++ b/nbextensions/appCell2/main.js @@ -26,7 +26,6 @@ define([ 'kb_service/client/workspace', './appCell', 'css!kbase/css/appCell.css', - 'css!./styles/main.css', 'bootstrap', 'custom/custom' ], function( diff --git a/nbextensions/appCell2/styles/main.css b/nbextensions/appCell2/styles/main.css deleted file mode 100644 index d770faa574..0000000000 --- a/nbextensions/appCell2/styles/main.css +++ /dev/null @@ -1,10 +0,0 @@ -/* -To change this license header, choose License Headers in Project Properties. -To change this template file, choose Tools | Templates -and open the template in the editor. -*/ - -/* - Created on : Jul 14, 2016, 2:30:47 PM - Author : erik -*/ diff --git a/nbextensions/editorCell/main.js b/nbextensions/editorCell/main.js index 0c519c212f..f0df764445 100644 --- a/nbextensions/editorCell/main.js +++ b/nbextensions/editorCell/main.js @@ -32,9 +32,8 @@ define([ 'common/jupyter', 'kb_service/utils', 'kb_service/client/workspace', - 'css!kbase/css/appCell.css', - 'css!./styles/main.css', + 'css!kbase/css/editorCell.css', 'bootstrap', 'custom/custom' ], function( diff --git a/nbextensions/editorCell/styles/old.css b/nbextensions/editorCell/styles/old.css deleted file mode 100644 index b2ff54f068..0000000000 --- a/nbextensions/editorCell/styles/old.css +++ /dev/null @@ -1,190 +0,0 @@ -/* Wrapper class - All classes below may be wrapped in this class to avoid polluting - the Narrative styles. -*/ - -/** new app parameter styling **/ -.kb-app-cell .kb-app-parameter-panel { - border-left: 3px solid #fff; -} - -.kb-app-cell .kb-app-parameter-panel-hover { - border-left: 3px solid #428bca; -} - -.kb-app-cell .kb-app-parameter-row { - margin: 0; - padding: 5px; - border-radius: 5px; -} - -/* for some reason, the css :hover doesn't work right on this div, so we use jquery to toggle this class */ -.kb-app-cell .kb-app-parameter-row-hover { - background: #f9f9f9; -} - -.kb-app-cell .kb-app-parameter-row-error { - background: #f2dede; -} - -.kb-app-cell .kb-app-parameter-error-message { - padding: 5px; - text-align: center; - font-family: 'OxygenBold', sans-serif; - font-weight: bold; - font-size: 9pt; - color: #f44336; -} - -/* not sure how to get text in these divs to valign middle... */ -.kb-app-cell .kb-app-parameter-name { - font-family: 'OxygenBold', sans-serif; - color: #777; - text-align: right; - vertical-align: middle; - margin-top: 3px; - padding-right: 4px; - padding-left: 0; - white-space: normal; -} - -.kb-app-cell .kb-app-parameter-input { - vertical-align: middle; - white-space: nowrap; - xpadding-left: 10px; -} - -.kb-app-cell .kb-app-parameter-input input { - font-weight: bold; -} - -.kb-app-cell .kb-app-parameter-input select.form-control { - margin: 0; -} - -/* -This set of styles is a to accomodate the required/satisfied icon which appears -between the select input control and the help text to the right of it. The -problem is that within the columns used for layout the select is set to 100% width -and yet the icon is placed right next to it. The result is that the icon is shoved -to the right of the select control and into the next column, overlapping the -help text. The old app handling this was to scoot the help text far enough over -to accomodate the the icon intruding into its space. This technique makes space -in the column in which the icon lives, and does this by shrinking the select -control with padding, and then scooting the icon back into its column. -*/ -.kb-app-cell .kb-app-parameter-input > div { - /* allow space for the required (red arrow), satisfied (green checkbox) icon */ - padding-right: 20px; -} - -.kb-app-cell .kb-app-parameter-input .kb-app-parameter-accepted-glyph, -.kb-app-cell .kb-app-parameter-input .kb-app-parameter-required-glyph { - /* This scoots the icon inside */ - font-size: 15px; - margin-left: 0; -} - -.kb-app-cell .kb-app-parameter-required-glyph { - color: #f44336; -} - -.kb-app-cell .kb-app-parameter-hint { - padding-left: 7px; -} - -.kb-app-cell .kb-parameter-data-selection { - font-weight: bold; -} - -.kb-app-cell .kb-app-parameter-hint { - color: #777; - text-align: left; - margin-top: 3px; -} - -.kb-app-cell .kb-app-parameter-accepted-glyph { - color: #4bb856; -} - -.kb-app-cell .kb-app-parameter-info { - color: #777; -} - -.kb-app-cell .kb-parameter-data-row-remove { - color: #777; -} - -.kb-app-cell .kb-parameter-data-row-add { - color: #777; -} - -.kb-app-cell .kb-app-advanced-options-controller-inactive { - font-family: 'OxygenBold', sans-serif; - font-style: italic; - font-size: 10pt; - line-height: 14px; - color: #777; - text-align: center; -} - -.kb-app-cell .kb-app-advanced-options-controller { - font-family: 'OxygenBold', sans-serif; - cursor: pointer; - font-style: italic; - font-size: 10pt; - line-height: 14px; - color: #08c; - text-align: center; -} - -.kb-app-cell .kb-app-advanced-options-controller:hover { - color: #2a6496; -} - -.kb-app-cell .kb-app-footer { - width: 100%; - overflow: none; - background-color: #f5f5f5; - padding: 10px; -} - -.kb-app-cell .kb-app-subtitle { - background-color: #f5f5f5; - padding: 3px 5px; -} - -.kb-app-cell .panel-title > [data-toggle="collapse"]::before { - display: inline-block; - margin-left: 0; - margin-right: 4px; - font-family: "FontAwesome"; - font-style: normal; - font-weight: normal; - font-size: 90%; - width: 12px; - color: silver; - line-height: 1; - vertical-align: baseline; - content: "\f078 "; -} - -.kb-app-cell .panel-title > [data-toggle="collapse"].collapsed::before { - margin-left: 2px; - margin-right: 2px; - content: "\f054 "; -} - -/* tweaks to elemnts that should be dimmed when the cell is not selected */ - -.unselected .kb-app-cell { - opacity: 0.5; -} - -.kb-app-cell .advanced-parameter-showing { - display: block; -} - -.kb-app-cell .advanced-parameter-hidden { - display: none; -} diff --git a/nbextensions/viewCell/main.js b/nbextensions/viewCell/main.js index 508d17864c..4ea1f93c4b 100644 --- a/nbextensions/viewCell/main.js +++ b/nbextensions/viewCell/main.js @@ -36,7 +36,6 @@ define([ // for effect 'css!kbase/css/appCell.css', - 'css!./styles/main.css', 'bootstrap', 'custom/custom' ], function( diff --git a/nbextensions/viewCell/styles/main.css b/nbextensions/viewCell/styles/main.css deleted file mode 100644 index 69d199f329..0000000000 --- a/nbextensions/viewCell/styles/main.css +++ /dev/null @@ -1,10 +0,0 @@ -/* -To change this license header, choose License Headers in Project Properties. -To change this template file, choose Tools | Templates -and open the template in the editor. -*/ - -/* - Created on : Jul 14, 2016, 2:31:08 PM - Author : erik -*/