next-material-kit/styles/jss/nextjs-material-kit/pages/componentsSections/navbarsStyle.js

NextJS Version of Material Kit React by Creative Tim (https://creative-tim.com)

import { container, title, grayColor } from "styles/jss/nextjs-material-kit.js";
import headerLinksStyle from "styles/jss/nextjs-material-kit/components/headerLinksStyle.js";

const navbarsStyle = (theme) => ({
  section: {
    padding: "70px 0",
    paddingTop: "0",
  },
  container,
  title: {
    ...title,
    marginTop: "30px",
    minHeight: "32px",
    textDecoration: "none",
  },
  navbar: {
    marginBottom: "-20px",
    zIndex: "100",
    position: "relative",
    overflow: "hidden",
    "& header": {
      borderRadius: "0",
    },
  },
  navigation: {
    backgroundPosition: "center center",
    backgroundSize: "cover",
    marginTop: "0",
    minHeight: "740px",
  },
  formControl: {
    [theme.breakpoints.down("md")]: {
      margin: "10px 0 0 15px !important",
      color: grayColor,
    },
    margin: "10px 0 0 0 !important",
    paddingTop: "0",
  },
  inputRootCustomClasses: {
    margin: "0!important",
  },
  searchIcon: {
    width: "20px",
    height: "20px",
    color: "inherit",
  },
  ...headerLinksStyle(theme),
  img: {
    width: "40px",
    height: "40px",
    borderRadius: "50%",
  },
  imageDropdownButton: {
    [theme.breakpoints.down("md")]: {
      top: "0",
      margin: "5px 15px",
    },
    padding: "0px",
    top: "4px",
    borderRadius: "50%",
    marginLeft: "5px",
  },
});

export default navbarsStyle;