diff --git a/less/Common/Constants.less b/less/Common/Constants.less index 4c9882ceb..face1837c 100644 --- a/less/Common/Constants.less +++ b/less/Common/Constants.less @@ -54,6 +54,8 @@ @SelectionColor: #3074B0; +@FocusColor: #00bcf2; + /****************************************************************************** METRICS /******************************************************************************/ @@ -198,7 +200,7 @@ } .focus() { - outline: 1px dashed @AccentMedium; + outline: 1px dashed @FocusColor; } /************************************************************************************************ diff --git a/less/documentDB.less b/less/documentDB.less index 9ef913527..4d3a2c9b7 100644 --- a/less/documentDB.less +++ b/less/documentDB.less @@ -14,6 +14,10 @@ body { font-family: @DataExplorerFont; font-size: 12px; height: 100%; + + :focus { + .focus() + } } .float-right { @@ -174,7 +178,7 @@ body { &:active { .active(); } - + &:focus .urlTokenCopyTooltiptext, &:focus .urlTokenCopyTooltiptext { .tooltipVisible(); } @@ -362,7 +366,7 @@ body { } .splashLoaderContainer { - z-index: 5; + z-index: 5; position: absolute; left: 0; top: 0; @@ -1449,7 +1453,7 @@ p { .throughputModeRadio { vertical-align: text-bottom; } - + .nonFirstRadio { margin-left: @LargeSpace; } @@ -1484,7 +1488,7 @@ p { .largePartitionKeyDescription { margin: @DefaultSpace 0px 0px; - } + } } .enableAnalyticalStorage { @@ -2216,13 +2220,13 @@ a:link { .documentsGridHeaderContainer table thead tr { position: sticky; - top: 0; + top: 0; th { position: sticky; - top: 0; + top: 0; background-color: #fff !important; border-bottom: 1px solid #CCCCCC !important; - } + } } .documentsGridHeader { diff --git a/src/Explorer/Controls/FeaturePanel/FeaturePanelComponent.tsx b/src/Explorer/Controls/FeaturePanel/FeaturePanelComponent.tsx index eb3dee367..dfc33a85a 100644 --- a/src/Explorer/Controls/FeaturePanel/FeaturePanelComponent.tsx +++ b/src/Explorer/Controls/FeaturePanel/FeaturePanelComponent.tsx @@ -133,7 +133,7 @@ export const FeaturePanelComponent: React.FunctionComponent = () => { .find(f => f.key === "feature.notebookserverurl") .reactState[1]("https://localhost:10001/12345/notebook/"); stringFeatures.find(f => f.key === "feature.notebookservertoken").reactState[1]("token"); - stringFeatures.find(f => f.key === "feature.notebookbasepath").reactState[1]("."); + stringFeatures.find(f => f.key === "feature.notebookbasepath").reactState[1]("./notebooks"); setPlatform(platformOptions.find(o => o.key === "Hosted")); }; diff --git a/src/Explorer/Controls/TreeComponent/TreeComponent.tsx b/src/Explorer/Controls/TreeComponent/TreeComponent.tsx index 966e3e599..0bee76439 100644 --- a/src/Explorer/Controls/TreeComponent/TreeComponent.tsx +++ b/src/Explorer/Controls/TreeComponent/TreeComponent.tsx @@ -6,10 +6,9 @@ */ import * as React from "react"; -import * as ReactDOM from "react-dom"; import * as Constants from "../../../Common/Constants"; import AnimateHeight from "react-animate-height"; -import { IconButton } from "office-ui-fabric-react/lib/Button"; +import { IconButton, IButtonStyles } from "office-ui-fabric-react/lib/Button"; import { DirectionalHint, IContextualMenuItemProps, @@ -227,6 +226,10 @@ export class TreeNodeComponent extends React.Component = { + rootFocused: { outline: `1px dashed ${Constants.StyleConstants.FocusColor}` } + }; + return (
})) }} + styles={buttonStyles} />
); diff --git a/src/Explorer/Controls/TreeComponent/__snapshots__/TreeComponent.test.tsx.snap b/src/Explorer/Controls/TreeComponent/__snapshots__/TreeComponent.test.tsx.snap index 7c98828f7..d6e323cfc 100644 --- a/src/Explorer/Controls/TreeComponent/__snapshots__/TreeComponent.test.tsx.snap +++ b/src/Explorer/Controls/TreeComponent/__snapshots__/TreeComponent.test.tsx.snap @@ -191,6 +191,13 @@ exports[`TreeNodeComponent renders a simple node (sorted children, expanded) 1`] } } name="More" + styles={ + Object { + "rootFocused": Object { + "outline": "1px dashed undefined", + }, + } + } /> @@ -314,6 +321,13 @@ exports[`TreeNodeComponent renders sorted children, expanded, leaves and parents } } name="More" + styles={ + Object { + "rootFocused": Object { + "outline": "1px dashed undefined", + }, + } + } />