[dev] React demo - update Menu

Author: Sorokin-Oleg

src/menu/Menu.js

@@ -1,13 +1,11 @@
 import React, { Component } from "react";
 import PropTypes from "prop-types";
 import { Menu as MenuDHX, TreeCollection } from "dhx-suite";
-import "dhx-suite/codebase/suite.min.css";
-import "@mdi/font/css/materialdesignicons.min.css";
 
 class Menu extends Component {
 componentDidMount() {
 this.menu = new MenuDHX(this.el, {
-css: "dhx_widget--bordered"
+css: "dhx_widget--bordered dhx_widget--bg_white"
 });
 this.menu.data.load(`${process.env.PUBLIC_URL}/static/menu.json`);
 }

src/menu/MenuCdn.js

@@ -16,7 +16,7 @@ class MenuCDN extends Component {
 this.ready.then(() => {
 /* global dhx */
 this.menu = new dhx.Menu(this.el, {
-css: "dhx_widget--bordered"
+css: "dhx_widget--bordered dhx_widget--bg_white"
 });
 this.menu.data.load(`${process.env.PUBLIC_URL}/static/menu.json`);
 if (this.props.ready) {

src/menu/MenuConfigured.js

@@ -1,12 +1,11 @@
 import React, { Component } from "react";
 import PropTypes from "prop-types";
 import { Menu as MenuDHX, TreeCollection } from "dhx-suite";
-import "dhx-suite/codebase/suite.min.css";
 
 class MenuConfigured extends Component {
 componentDidMount() {
 this.menu = new MenuDHX(this.el, {
-css: "dhx_widget--bordered"
+css: "dhx_widget--bordered dhx_widget--bg_white"
 });
 this.menu.data.load(`${process.env.PUBLIC_URL}/static/menu.json`);
 }

src/menu/MenuData.js

@@ -1,8 +1,6 @@
 import React, { Component, PureComponent } from "react";
 import PropTypes from "prop-types";
 import { Menu as MenuDHX, TreeCollection } from "dhx-suite";
-import "dhx-suite/codebase/suite.min.css";
-import "@mdi/font/css/materialdesignicons.min.css";
 
 class Menu extends Component {
 componentDidMount() {

src/menu/MenuEvents.js

@@ -1,8 +1,6 @@
 import React, {Component} from "react";
 import PropTypes from "prop-types";
 import {Menu as MenuDHX, TreeCollection} from "dhx-suite";
-import "dhx-suite/codebase/suite.min.css";
-import "@mdi/font/css/materialdesignicons.min.css";
 
 class MenuEvents extends Component {
 constructor(props) {
@@ -14,7 +12,7 @@ class MenuEvents extends Component {
 }
 componentDidMount() {
 this.menu = new MenuDHX(this.el, {
-css: "dhx_widget--bordered"
+css: "dhx_widget--bordered dhx_widget--bg_white"
 });
 this.menu.data.load(`${process.env.PUBLIC_URL}/static/menu.json`);
 

src/menu/MenuPage.js

@@ -9,6 +9,9 @@ import MenuProps from "./MenuProps";
 import MenuData from "./MenuData";
 import MenuEvents from "./MenuEvents";
 
+import "dhx-suite/codebase/suite.min.css";
+import "@mdi/font/css/materialdesignicons.min.css";
+
 class MenuPage extends Component {
 componentDidMount() {
 const setActiveExapmleInHead = (entries, observer) => {

src/menu/MenuProps.js

@@ -1,7 +1,6 @@
 import React, { Component } from "react";
 import PropTypes from "prop-types";
 import { Menu as MenuDHX, TreeCollection } from "dhx-suite";
-import "dhx-suite/codebase/suite.min.css";
 
 class Menu extends Component {
 componentDidMount() {
@@ -30,7 +29,7 @@ class MenuProps extends Component {
 render() {
 return (
 <Menu
-css="dhx_widget--bordered"
+css="dhx_widget--bordered dhx_widget--bg_white"
 data={this.getData()}
 />
 );