responsive header for tablets & 4k

HAZberi · Jan 12, 2021 · bbb552b · bbb552b
1 parent 960189e
commit bbb552b
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 6 deletions.
diff --git a/.eslintcache b/.eslintcache
@@ -1 +1 @@
-[{"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\index.js":"1","C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\App.js":"2","C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\components\\ui\\Header.js":"3","C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\components\\Theme.js":"4"},{"size":149,"mtime":1609932704463,"results":"5","hashOfConfig":"6"},{"size":1662,"mtime":1610470675340,"results":"7","hashOfConfig":"6"},{"size":16144,"mtime":1610474318626,"results":"8","hashOfConfig":"6"},{"size":701,"mtime":1610474778755,"results":"9","hashOfConfig":"6"},{"filePath":"10","messages":"11","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"12"},"163mq3",{"filePath":"13","messages":"14","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"15","messages":"16","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"17","messages":"18","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\index.js",[],["19","20"],"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\App.js",[],"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\components\\ui\\Header.js",[],"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\components\\Theme.js",[],{"ruleId":"21","replacedBy":"22"},{"ruleId":"23","replacedBy":"24"},"no-native-reassign",["25"],"no-negated-in-lhs",["26"],"no-global-assign","no-unsafe-negation"]
+[{"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\index.js":"1","C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\App.js":"2","C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\components\\Theme.js":"3","C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\components\\ui\\Header.js":"4"},{"size":149,"mtime":1609932704463,"results":"5","hashOfConfig":"6"},{"size":1662,"mtime":1610470675340,"results":"7","hashOfConfig":"6"},{"size":701,"mtime":1610485479772,"results":"8","hashOfConfig":"6"},{"size":16383,"mtime":1610485962222,"results":"9","hashOfConfig":"6"},{"filePath":"10","messages":"11","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"163mq3",{"filePath":"12","messages":"13","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"14","messages":"15","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"16","messages":"17","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\index.js",[],"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\App.js",[],"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\components\\Theme.js",[],"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\components\\ui\\Header.js",[]]
diff --git a/debug.log b/debug.log
@@ -1 +1,3 @@
 [0106/204236.344:ERROR:directory_reader_win.cc(43)] FindFirstFile: The system cannot find the path specified. (0x3)
+[0112/134929.542:ERROR:directory_reader_win.cc(43)] FindFirstFile: The system cannot find the path specified. (0x3)
+[0112/140443.299:ERROR:directory_reader_win.cc(43)] FindFirstFile: The system cannot find the path specified. (0x3)
diff --git a/src/components/ui/Header.js b/src/components/ui/Header.js
@@ -33,19 +33,19 @@ const useStyles = makeStyles((theme) => ({
     //toolbar minimum height
     ...theme.mixins.toolbar,
     marginBottom: "1.75em",
-    [theme.breakpoints.down("sm")]: {
-      marginBottom: 0,
+    [theme.breakpoints.down("md")]: {
+      marginBottom: "0.25em",
     },
     [theme.breakpoints.down("xs")]: {
-      marginBottom: 0,
+      marginBottom: "0.5em",
     },
   },
   logoContainer: {
     padding: 0,
   },
   logo: {
     height: "6.5em",
-    [theme.breakpoints.down("sm")]: {
+    [theme.breakpoints.down("md")]: {
       height: "4.6em",
     },
     [theme.breakpoints.down("xs")]: {
@@ -58,13 +58,22 @@ const useStyles = makeStyles((theme) => ({
   tab: {
     ...theme.typography.tab,
     minWidth: 10,
-    marginLeft: "20px",
+    marginLeft: "16px",
+    [theme.breakpoints.up("lg")]: {
+      fontSize: "1.25em",
+      marginLeft: "30px",
+    },
   },
   button: {
     ...theme.typography.estimate,
     borderRadius: "30px",
     marginLeft: "20px",
     marginRight: "20px",
+    [theme.breakpoints.up("lg")]: {
+      fontSize: "1.25em",
+      marginLeft: "30px",
+      marginRight: "20px",
+    },
   },
   menu: {
     backgroundColor: theme.palette.common.orange,
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		[{"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\index.js":"1","C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\App.js":"2","C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\components\\ui\\Header.js":"3","C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\components\\Theme.js":"4"},{"size":149,"mtime":1609932704463,"results":"5","hashOfConfig":"6"},{"size":1662,"mtime":1610470675340,"results":"7","hashOfConfig":"6"},{"size":16144,"mtime":1610474318626,"results":"8","hashOfConfig":"6"},{"size":701,"mtime":1610474778755,"results":"9","hashOfConfig":"6"},{"filePath":"10","messages":"11","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"12"},"163mq3",{"filePath":"13","messages":"14","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"15","messages":"16","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"17","messages":"18","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\index.js",[],["19","20"],"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\App.js",[],"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\components\\ui\\Header.js",[],"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\components\\Theme.js",[],{"ruleId":"21","replacedBy":"22"},{"ruleId":"23","replacedBy":"24"},"no-native-reassign",["25"],"no-negated-in-lhs",["26"],"no-global-assign","no-unsafe-negation"]
		[{"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\index.js":"1","C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\App.js":"2","C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\components\\Theme.js":"3","C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\components\\ui\\Header.js":"4"},{"size":149,"mtime":1609932704463,"results":"5","hashOfConfig":"6"},{"size":1662,"mtime":1610470675340,"results":"7","hashOfConfig":"6"},{"size":701,"mtime":1610485479772,"results":"8","hashOfConfig":"6"},{"size":16383,"mtime":1610485962222,"results":"9","hashOfConfig":"6"},{"filePath":"10","messages":"11","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"163mq3",{"filePath":"12","messages":"13","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"14","messages":"15","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"16","messages":"17","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\index.js",[],"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\App.js",[],"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\components\\Theme.js",[],"C:\\Users\\User\\Desktop\\Web Developer\\Material-UI\\tech-company-website-part-1\\src\\components\\ui\\Header.js",[]]