fix: nav submenu dropdown styles (#14580)

* fix nav submenu dropdown styles

* lint

* fix mobile view styles

* run lint

* address comments

* undo comit lock files

* Update superset-frontend/src/common/components/index.tsx

Co-authored-by: Michael S. Molina <70410625+michael-s-molina@users.noreply.github.com>

Co-authored-by: Michael S. Molina <70410625+michael-s-molina@users.noreply.github.com>
This commit is contained in:
Phillip Kelley-Dotson
2021-05-17 13:58:02 -07:00
committed by GitHub
parent fd8b2cb89b
commit 3ad8b546e6
3 changed files with 41 additions and 32 deletions

View File

@@ -17,8 +17,9 @@
* under the License.
*/
import React, { useState, useEffect } from 'react';
import { styled } from '@superset-ui/core';
import { styled, css } from '@superset-ui/core';
import { debounce } from 'lodash';
import { Global } from '@emotion/react';
import { getUrlParam } from 'src/utils/urlUtils';
import { MainNav as DropdownMenu, MenuMode } from 'src/common/components';
import { Link } from 'react-router-dom';
@@ -98,10 +99,14 @@ const StyledHeader = styled.header`
height: 100%;
line-height: inherit;
}
/*.ant-menu > .ant-menu-item > a {
.ant-menu > .ant-menu-item > a {
padding: ${({ theme }) => theme.gridUnit * 4}px;
}*/
}
@media (max-width: 767px) {
.ant-menu-item {
padding: 0 ${({ theme }) => theme.gridUnit * 6}px 0
${({ theme }) => theme.gridUnit * 3}px !important;
}
.ant-menu > .ant-menu-item > a {
padding: 0px;
}
@@ -200,6 +205,16 @@ export function Menu({
};
return (
<StyledHeader className="top" id="main-menu" role="navigation">
<Global
styles={css`
.ant-menu-submenu.ant-menu-submenu-popup.ant-menu.ant-menu-light.ant-menu-submenu-placement-bottomLeft {
border-radius: 0px;
}
.ant-menu-submenu.ant-menu-submenu-popup.ant-menu.ant-menu-light {
border-radius: 0px;
}
`}
/>
<Row>
<Col lg={12} md={24} sm={24} xs={24}>
<a className="navbar-brand" href={brand.path}>