Merge pull request #1 from GIHAA/update/body-styles

Update/body styles
sliit-foss · May 17, 2022 · 7334ae8 · 7334ae8
2 parents 353a4dd + 4c70ef8
commit 7334ae8
Show file tree

Hide file tree

Showing 8 changed files with 36 additions and 35 deletions.
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/index.html b/public/index.html
@@ -13,51 +13,47 @@
       gtag('config', 'UA-131121683-1');
     </script>
     <meta charset="utf-8" />
-    <link rel="shortcut icon" href="https://gitexplorer.com/favicon.ico" />
+    <link rel="shortcut icon" href="https://sliit-foss.github.io/cli-explorer/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, user-scalable=no" />
     <meta name="theme-color" content="#000000" />
-    <meta
-      name="keywords"
-      content="git, delete branch in git, github, gitlab, bitbucket, git commit, git problems, git errors, git delete branch, git amend, git ammend, git branch delete, git undo, compare commits git, modify commit message, show committed changes, staged changes, show uncommitted changes, undo git reset"
-    />
     <meta
       name="description"
-      content="GitExplorer: Find the right git commands you need without digging through the web"
+      content="CLIExplorer: Find the right git commands you need without digging through the web"
     />
-    <meta name="pagename" content="GitExplorer: Find the right git commands you need without digging through the web" />
-    <meta name="url" content="https://gitexplorer.com" />
+    <meta name="pagename" content="CLIExplorer: Find the right git commands you need without digging through the web" />
+    <meta name="url" content="https://sliit-foss.github.io/cli-explorer/" />
     <!-- Google / Search Engine Tags -->
-    <meta itemprop="name" content="GitExplorer" />
+    <meta itemprop="name" content="CLIExplorer" />
     <meta
       itemprop="description"
-      content="GitExplorer: Find the right git commands you need without digging through the web"
+      content="CLIExplorer: Find the right git commands you need without digging through the web"
     />
     <!-- Facebook Meta Tags -->
-    <meta property="og:url" content="https://gitexplorer.com" />
+    <meta property="og:url" content="https://sliit-foss.github.io/cli-explorer/" />
     <meta property="og:type" content="website" />
-    <meta property="og:title" content="GitExplorer" />
+    <meta property="og:title" content="CLIExplorer" />
     <meta
       property="og:description"
-      content="GitExplorer: Find the right git commands you need without digging through the web"
+      content="CLIExplorer: Find the right git commands you need without digging through the web"
     />
     <meta property="og:image:height" content="630" />
     <meta property="og:image:width" content="1200" />
     <meta property="og:locale" content="en_US" />
-    <meta property="og:site_name" content="GitExplorer" />
-    <meta property="og:image" content="https://gitexplorer.com/images/gitcommand.png" />
+    <meta property="og:site_name" content="CLIExplorer" />
+    <meta property="og:image" content="https://CLIExplorer.com/images/gitcommand.png" />
     <!-- Twitter Meta Tags -->
     <meta name="twitter:card" content="summary_large_image" />
-    <meta name="twitter:title" content="GitExplorer" />
+    <meta name="twitter:title" content="CLIExplorer" />
     <meta
       name="twitter:description"
-      content="GitExplorer: Find the right git commands you need without digging through the web"
+      content="CLIExplorer: Find the right git commands you need without digging through the web"
     />
-    <meta name="twitter:image:src" content="https://gitexplorer.com/images/gitcommand.png" />
-    <meta name="twitter:site" content="@gitexplorer" />
-    <meta name="twitter:creator" content="@gitexplorer" />
+    <meta name="twitter:image:src" content="https://CLIExplorer.com/images/gitcommand.png" />
+    <meta name="twitter:site" content="@CLIExplorer" />
+    <meta name="twitter:creator" content="@CLIExplorer" />
 
     <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-    <title>Git Explorer</title>
+    <title>CLI Explorer</title>
   </head>
 
   <body>

diff --git a/public/manifest.json b/public/manifest.json
@@ -1,6 +1,6 @@
 {
-  "short_name": "Git Explorer",
-  "name": "Git Explorer",
+  "short_name": "CLI Explorer",
+  "name": "CLI Explorer",
   "icons": [
     {
       "src": "favicon.ico",

diff --git a/src/App.js b/src/App.js
@@ -1,13 +1,12 @@
 import React, { Component } from "react";
-import { SideNav, Footer, Header } from "components/layout";
+import { SideNav, Footer } from "components/layout";
 import ExplorerContent from "components/explorerContent";
 
 class App extends Component {
   render() {
     return (
-      <div className="bg-blue-bg">
+      <div className="flex bg-blue-bg">
         <SideNav />
-        <Header />
         <ExplorerContent />
         <Footer />
       </div>

diff --git a/src/components/explorerContent.js b/src/components/explorerContent.js
@@ -1,5 +1,6 @@
 import React, { useState } from "react";
 import Select from "react-select";
+import { Header } from "components/layout";
 import clipboard from "assets/images/clipboard.svg";
 
 import Typist from "react-typist";
@@ -107,12 +108,13 @@ function ExplorerContent() {
   };
 
   return (
-    <div>
-      <div className="container home__container ml-[6rem] ">
+    <div className="w-full">
+      <Header />
+      <div className=" mx-[6rem] ">
 
         <div>
-          <div className="w-full bg-red-600 flex justify-between items-center">
-            <div className="w-1/2 bg-yellow-600">
+          <div className="w-full flex justify-between items-center">
+            <div className="w-5/12">
               <h1 className="text-5xl mb-10">
                 CLI EXPLORER
               </h1>
@@ -126,7 +128,7 @@ function ExplorerContent() {
 
                 <Select
                   placeholder="..."
-                  className="my-8 w-8/12"
+                  className="my-8 w-10/12"
                   classNamePrefix="options-select"
                   isSearchable={true}
                   onChange={onFirstChange}
@@ -159,14 +161,14 @@ function ExplorerContent() {
                 ) : null}
               </div>
             </div>
-            <div className="w-1/2">
+            <div className="w-7/12">
               <div
                 className={`board__group board__group--1 ${
                   isMobile && !state.usage ? " d-none" : ""
                 }`}
               >
-                <h2 className="board__title  dark-white">Usage</h2>
-                <div className="board board--1">
+                <h2 className="mb-8">Usage</h2>
+                <div className="bg-blue-primary min-h-36 w-full rounded-md">
                   <pre>
                     {state.usage.length ? (
                       <Typist cursor={{ show: false }}>{state.usage}</Typist>

diff --git a/src/components/layout/footer.js b/src/components/layout/footer.js
@@ -13,3 +13,4 @@ const Footer = props => (
 );
 
 export default Footer;
+
diff --git a/src/components/layout/sideNav.js b/src/components/layout/sideNav.js
@@ -35,7 +35,7 @@ function SideNav() {
   return (
     <div className="">
       <div
-        className="group absolute z-40 flex flex-col h-screen w-[6rem] hover:w-[14rem] bg-blue-primary shadow-right px-2  ease-in-out duration-300 "
+        className="group z-40 flex flex-col h-screen w-[6rem] hover:w-[14rem] bg-blue-primary shadow-right px-2  ease-in-out duration-300 "
 
       >
         <div className="flex flex-col mt-3.5">

diff --git a/tailwind.config.js b/tailwind.config.js
@@ -6,6 +6,9 @@ module.exports = {
       colors: {
         blue: { primary: "#00183A", light: "#B9E6FF", bg: "#EAFBFF" },
       },
+      minHeight: {
+        36: "9rem"
+      },
     },
   },
Original file line number	Diff line number	Diff line change
Expand Up		@@ -13,3 +13,4 @@ const Footer = props => (
		);

		export default Footer;