diff --git a/ui/src/ifql/components/TimeMachine.tsx b/ui/src/ifql/components/TimeMachine.tsx index fe53c9ee59..9d564a9acd 100644 --- a/ui/src/ifql/components/TimeMachine.tsx +++ b/ui/src/ifql/components/TimeMachine.tsx @@ -91,7 +91,7 @@ class TimeMachine extends PureComponent<Props> { headerButtons: [ <div key="analyze" - className="btn btn-default btn-sm analyze--button" + className="btn btn-default btn-xs analyze--button" onClick={onAnalyze} > Analyze diff --git a/ui/src/shared/components/threesizer/Division.tsx b/ui/src/shared/components/threesizer/Division.tsx index 30b7e572d1..1eb1952633 100644 --- a/ui/src/shared/components/threesizer/Division.tsx +++ b/ui/src/shared/components/threesizer/Division.tsx @@ -59,7 +59,7 @@ class Division extends PureComponent<Props> { fontSize: '16px', fontWeight: '500', }) - const NAME_OFFSET = 66 + const NAME_OFFSET = 96 this.collapseThreshold = width + NAME_OFFSET } diff --git a/ui/src/shared/components/threesizer/DivisionMenu.tsx b/ui/src/shared/components/threesizer/DivisionMenu.tsx index 605bb70de9..d57f71ad7e 100644 --- a/ui/src/shared/components/threesizer/DivisionMenu.tsx +++ b/ui/src/shared/components/threesizer/DivisionMenu.tsx @@ -62,7 +62,7 @@ class DivisionMenu extends PureComponent<Props, State> { private get buttonClass(): string { const {expanded} = this.state - return classnames('btn btn-sm btn-square btn-default', { + return classnames('btn btn-xs btn-square btn-default', { active: expanded, }) } diff --git a/ui/src/shared/constants/index.tsx b/ui/src/shared/constants/index.tsx index 36047ffe49..c341b336fc 100644 --- a/ui/src/shared/constants/index.tsx +++ b/ui/src/shared/constants/index.tsx @@ -479,6 +479,6 @@ export const REQUIRED_HALVES = 2 export const HANDLE_VERTICAL = 'vertical' export const HANDLE_HORIZONTAL = 'horizontal' export const HANDLE_NONE = 'none' -export const HANDLE_PIXELS = 30 +export const HANDLE_PIXELS = 20 export const MAX_SIZE = 1 export const MIN_SIZE = 0 diff --git a/ui/src/style/components/threesizer.scss b/ui/src/style/components/threesizer.scss index 57acdac6f7..a897c1c9de 100644 --- a/ui/src/style/components/threesizer.scss +++ b/ui/src/style/components/threesizer.scss @@ -3,7 +3,6 @@ ------------------------------------------------------------------------------ */ -$threesizer-handle: 30px; .threesizer { width: 100%; height: 100%; @@ -73,16 +72,19 @@ $threesizer-handle: 30px; .threesizer--title { padding-left: 14px; position: relative; - font-size: 16px; - font-weight: 500; + font-size: 14px; + font-weight: 600; white-space: nowrap; + text-transform: uppercase; + letter-spacing: 0.05em; color: $g11-sidewalk; z-index: 1; - transition: transform 0.25s ease; + transition: transform 0.25s ease, letter-spacing 0.25s ease; &.vertical { - transform: translate(28px, 14px); + transform: translate(20px, 14px); &.threesizer--collapsed { - transform: translate(0, 3px) rotate(90deg); + transform: translate(0, 5px) rotate(90deg) scale(0.75); + letter-spacing: 0.15em; } } } @@ -138,11 +140,11 @@ $threesizer-shadow-stop: fade-out($g0-obsidian, 1); padding: 0 11px; background-color: $g2-kevlar; .horizontal>& { - width: 50px; + width: 44px; border-right: 2px solid $g4-onyx; } .vertical>& { - height: 50px; + height: 44px; border-bottom: 2px solid $g4-onyx; } } diff --git a/ui/src/style/layout/page.scss b/ui/src/style/layout/page.scss index ccef658ce1..257ce4c597 100644 --- a/ui/src/style/layout/page.scss +++ b/ui/src/style/layout/page.scss @@ -30,7 +30,7 @@ $dash-ceo-z: $dygraph-legend-z + 10; &:only-child { top: 0; - height: 100%; + height: 100% !important; } } .page-contents--split {