BUGFIX: added id to TabPanel and fixed tab height - #18 (#19)

psmb · Mar 27, 2019 · a7ff8f9 · a7ff8f9
1 parent 06ef559
commit a7ff8f9
Show file tree

Hide file tree

Showing 4 changed files with 81 additions and 67 deletions.
diff --git a/Resources/Private/FlatNav/src/makeFlatNavContainer.js b/Resources/Private/FlatNav/src/makeFlatNavContainer.js
@@ -7,6 +7,7 @@ import {neos} from '@neos-project/neos-ui-decorators';
 import {fetchWithErrorHandling} from '@neos-project/neos-ui-backend-connector';
 import backend from '@neos-project/neos-ui-backend-connector';
 import FlatNav from './FlatNav';
+import style from './style.css';
 
 // Taken from here, as it's not exported in the UI
 // https://github.com/neos/neos-ui/blob/b2a52d66a211b192dfc541799779a8be27bf5a31/packages/neos-ui-sagas/src/CR/NodeOperations/helpers.js#L3
@@ -205,11 +206,13 @@ const makeFlatNavContainer = OriginalPageTree => {
 
         render() {
             return (
-                <Tabs>
+                <Tabs theme={{
+                    tabs__content: style.tabs__content
+                }}>
                     {Object.keys(this.props.options.presets).map(presetName => {
                         const preset = this.props.options.presets[presetName];
                         return (
-                            <Tabs.Panel key={presetName} icon={preset.icon} tooltip={this.props.i18nRegistry.translate(preset.label)}>
+                            <Tabs.Panel id={presetName} key={presetName} icon={preset.icon} tooltip={this.props.i18nRegistry.translate(preset.label)}>
                                 {preset.type === 'flat' && (<FlatNav
                                     preset={preset}
                                     fetchNodes={this.makeFetchNodes(presetName)}

diff --git a/Resources/Private/FlatNav/src/style.css b/Resources/Private/FlatNav/src/style.css
@@ -3,6 +3,10 @@
     opacity: 1 !important;
 }
 
+.tabs__content {
+    height: calc(100% - 41px);
+}
+
 .toolbar {
     border-bottom: 1px solid var(--colors-ContrastDark);
 }
@@ -36,4 +40,4 @@
 
 .node__label {
     margin-left: 2em;
-}
+}
diff --git a/Resources/Public/JavaScript/FlatNav/Plugin.js b/Resources/Public/JavaScript/FlatNav/Plugin.js
diff --git a/Resources/Public/JavaScript/FlatNav/Plugin.js.map b/Resources/Public/JavaScript/FlatNav/Plugin.js.map