EOSIO · varshajnagaraja · May 16, 2019 · May 16, 2019 · May 16, 2019
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -1,12 +1,12 @@
-# Contributing to EOSIO Explorer
+# Contributing to EOSIO Labs™: EOSIO Explorer
 
 Interested in contributing? That's awesome! Here are some guidelines to get started quickly and easily:
 
 - [Reporting An Issue](#reporting-an-issue)
   - [Bug Reports](#bug-reports)
   - [Feature Requests](#feature-requests)
   - [Change Requests](#change-requests)
-- [Working on EOSIO Explorer](#working-on-eosio-explorer)
+- [Working on EOSIO Labs™: EOSIO Explorer](#working-on-eosio-explorer)
   - [Feature Branches](#feature-branches)
   - [Submitting Pull Requests](#submitting-pull-requests)
   - [Testing and Quality Assurance](#testing-and-quality-assurance)
@@ -16,7 +16,7 @@ Interested in contributing? That's awesome! Here are some guidelines to get star
 
 ## Reporting An Issue
 
-If you're about to raise an issue because you think you've found a problem with EOSIO Explorer, or you'd like to make a request for a new feature in the codebase, or any other reason… please read this first.
+If you're about to raise an issue because you think you've found a problem with EOSIO Labs™: EOSIO Explorer, or you'd like to make a request for a new feature in the codebase, or any other reason… please read this first.
 
 The GitHub issue tracker is the preferred channel for [bug reports](#bug-reports), [feature requests](#feature-requests), and [submitting pull requests](#submitting-pull-requests), but please respect the following restrictions:
 
@@ -51,13 +51,13 @@ Feature requests are welcome. Before you submit one be sure to have:
 
 ### Change Requests
 
-Change requests cover both architectural and functional changes to how EOSIO Explorer works. If you have an idea for a new or different dependency, a refactor, or an improvement to a feature, etc - please be sure to:
+Change requests cover both architectural and functional changes to how EOSIO Labs™: EOSIO Explorer works. If you have an idea for a new or different dependency, a refactor, or an improvement to a feature, etc - please be sure to:
 
 1. **Use the GitHub search** and check someone else didn't get there first
 1. Take a moment to think about the best way to make a case for, and explain what you're thinking. Are you sure this shouldn't really be
    a [bug report](#bug-reports) or a [feature request](#feature-requests)?  Is it really one idea or is it many? What's the context? What problem are you solving? Why is what you are suggesting better than what's already there?
 
-## Working on EOSIO Explorer
+## Working on EOSIO Labs™: EOSIO Explorer
 
 Code contributions are welcome and encouraged! If you are looking for a good place to start, check out the [good first issue](https://github.com/EOSIO/eosio-explorer/labels/good%20first%20issue) label in GitHub issues.
 
@@ -68,7 +68,7 @@ Also, please follow these guidelines when submitting code:
 To get it out of the way:
 
 - **[develop](https://github.com/EOSIO/eosio-explorer/tree/develop)** is the development branch. All work on the next release happens here so you should generally branch off `develop`. Do **NOT** use this branch for a production site.
-- **[master](https://github.com/EOSIO/eosio-explorer/tree/master)** contains the latest release of EOSIO Explorer. This branch may be used in production. Do **NOT** use this branch to work on EOSIO Explorer's source.
+- **[master](https://github.com/EOSIO/eosio-explorer/tree/master)** contains the latest release of EOSIO Labs™: EOSIO Explorer. This branch may be used in production. Do **NOT** use this branch to work on EOSIO Labs™: EOSIO Explorer's source.
 
 ### Submitting Pull Requests
 
@@ -78,7 +78,7 @@ Pull requests are awesome. If you're looking to raise a PR for something which d
 
 Never underestimate just how useful quality assurance is. If you're looking to get involved with the code base and don't know where to start, checking out and testing a pull request is one of the most useful things you could do.
 
-Essentially, [check out the latest develop branch](#working-on-EOSIO Explorer), take it for a spin, and if you find anything odd, please follow the [bug report guidelines](#bug-reports) and let us know!
+Essentially, [check out the latest develop branch](#working-on-EOSIO Labs™: EOSIO Explorer), take it for a spin, and if you find anything odd, please follow the [bug report guidelines](#bug-reports) and let us know!
 
 ## Conduct
 

diff --git a/README.md b/README.md
@@ -1,4 +1,4 @@
-<h1 align="center">EOSIO Explorer</h1>
+<h1 align="center">EOSIO Labs™: EOSIO Explorer</h1>
 <p align="center">
   A full web application to communicate with EOSIO blockchain in a local development environment built using React.
 </p>
@@ -26,9 +26,9 @@
 
 ## Overview
 
-The EOSIO Explorer is a full web application that allows developers to bootstrap their smart contract development by providing them the ability to communicate with the EOSIO blockchain in a local development environment. The goal of this application is to provide app developers for the EOSIO blockchain (consisting of smart contract developers and front-end developers) a quick and easy way to create the local development environment required to make and test such applications on the EOSIO blockchain. 
+The EOSIO Labs™: EOSIO Explorer is a full web application that allows developers to bootstrap their smart contract development by providing them the ability to communicate with the EOSIO blockchain in a local development environment. The goal of this application is to provide app developers for the EOSIO blockchain (consisting of smart contract developers and front-end developers) a quick and easy way to create the local development environment required to make and test such applications on the EOSIO blockchain.
 
-The application provides developers the ability to review changes and updates that occur within the blockchain based on their own work, and has the capacity to allow teams of developers to work on the same instance of the blockchain. This is to add an extra layer of ease for application development especially as a way to allow both smart contract developers and front-end developers to work together more closely. For example, front-end developers can test by connecting their applications to the blockchain instantiated by this tool, and perform tests which smart contract developers can review instantly on the tool to determine if behavior is expected or not. 
+The application provides developers the ability to review changes and updates that occur within the blockchain based on their own work, and has the capacity to allow teams of developers to work on the same instance of the blockchain. This is to add an extra layer of ease for application development especially as a way to allow both smart contract developers and front-end developers to work together more closely. For example, front-end developers can test by connecting their applications to the blockchain instantiated by this tool, and perform tests which smart contract developers can review instantly on the tool to determine if behavior is expected or not.
 
 The goal of this application is to enhance the user experience when developing EOSIO-based blockchain applications while at the same time lowering the barrier to entry for newcomers to EOSIO-based blockchain development.
 
@@ -38,7 +38,7 @@ EOSIO Labs repositories are experimental.  Developers in the community are encou
 
 ### :warning: Disclaimer :warning:
 
-The EOSIO Explorer is designed specifically to be a tool for local development. Therefore, numerous things must be kept in mind:
+The EOSIO Labs™: EOSIO Explorer is designed specifically to be a tool for local development. Therefore, numerous things must be kept in mind:
 
 1. **Wallet keys used for this tool may be compromised** if your machine is not properly secure.
 2. **The tool is not compatible with the EOSIO Mainnet**
@@ -59,7 +59,7 @@ The EOSIO Explorer is designed specifically to be a tool for local development.
 * CentOS 7
 * Ubuntu 16.04
 * Ubuntu 18.04
-* MacOS 10.14 (Mojave) 
+* MacOS 10.14 (Mojave)
 
 ### Required Tools
 
@@ -88,11 +88,11 @@ yarn install
 
 See: [Development](./docs/development.md)
 
-### OS Platform Specific 
+### OS Platform Specific
 
 #### Ubuntu 18.04 / Ubuntu 16.04
 
-If you want to start the tool with the bundled UI, you will need to make sure your machine or server can open headless Chrome in a sandbox. 
+If you want to start the tool with the bundled UI, you will need to make sure your machine or server can open headless Chrome in a sandbox.
 
 #### Amazon Linux 2 (AMI)
 
@@ -113,7 +113,7 @@ You will need to create an exception within SELinux. Setting the following boole
 setsebool -P unconfined_chrome_sandbox_transition 0
 ```
 
-Alternatively, though not necessarily recommended, you can disable `SELinux` entirely. 
+Alternatively, though not necessarily recommended, you can disable `SELinux` entirely.
 
 ## Usage
 
@@ -126,19 +126,19 @@ Installed via cloning the repository: yarn eosio-explorer <command>
 Run the tool with the specified command
 
 Commands:
-  init              Initialize the tool by installing all dependencies, setting up 
+  init              Initialize the tool by installing all dependencies, setting up
                     all Docker containers, etc.
                     Available flags:
                     -dev / --develop - Starts the tool in development mode
-                    -s / --sample-data - Starts the tool with pre-existing sample accounts 
+                    -s / --sample-data - Starts the tool with pre-existing sample accounts
                                          and smart contracts
   start             Start the tool, assumes the dependencies and Docker images are already prepared
                     Available flags:
                     -dev / --develop - Starts the tool in development mode
                     -d / --delete - Removes existing Docker containers
-                    --init - Builds a production-ready version of the web tool, 
+                    --init - Builds a production-ready version of the web tool,
                              and opens the tool with cleared local storage
-                    -s / --sample-data - Starts the tool with pre-existing 
+                    -s / --sample-data - Starts the tool with pre-existing
                                          sample accounts and smart contracts
   start_gui         Starts the web tool locally without touching the nodeos and MongoDB containers.
                     Available flags:

diff --git a/docs/README.md b/docs/README.md
@@ -1,6 +1,6 @@
-# EOSIO Explorer Documentation
+# EOSIO Labs™: EOSIO Explorer Documentation
 
-You can view documentation on everything related to the EOSIO Explorer web tool here.
+You can view documentation on everything related to the EOSIO Labs™: EOSIO Explorer web tool here.
 
 ## Documentation for Users
 

diff --git a/public/index.html b/public/index.html
@@ -22,7 +22,7 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>EOSIO Explorer</title>
+    <title>EOSIO Labs™: EOSIO Explorer</title>
   </head>
   <body>
     <noscript>

diff --git a/serve.js b/serve.js
@@ -41,7 +41,7 @@ app.listen(PORT, ()=>{
   if(`${process.env.MODE}` !== `development`){
     let url = "http://localhost:" + PORT;
     console.log(`Application is ready on "${url}".`);
-    console.log(`You can now view EOSIO Explorer in the browser.`);
+    console.log(`You can now view EOSIO Labs™: EOSIO Explorer in the browser.`);
     openBrowser(url);
   }
 });
diff --git a/src/components/Header/Header.jsx b/src/components/Header/Header.jsx
@@ -36,52 +36,52 @@ const NavWrapper = styled.div`
   flex-direction: column;
   justify-content: space-between;
   min-height: 40px;
-  padding: 0 10px;
+  padding: 0 0 0 10px;
   :nth-child(1){
-    flex: 1.1 0 0;
+    flex: 1.5 0 0;
   }
   :nth-child(2){
     flex: 5 0 0;
     .last-item{
       padding-right: 0 !important;
-      flex: none;            
-    }  
+      flex: none;
+    }
     @media screen and (max-width: 1280px){
       flex: 4 0 0;
     }
     @media screen and (max-width: 1120px){
       .last-item{
         flex: 0 1 0;
-      }  
+      }
     }
-         
+
   }
   :nth-child(3){
-    flex: 0.4 1 0; 
+    flex: 0.4 1 0;
     padding: 0;
     @media screen and (max-width: 1280px){
       flex: 0.1 1 0;
     }
   }
   :nth-child(4){
-    flex: 3 0 0;     
+    flex: 3 0 0;
     .px-3{
       flex: none;
-      padding-right: 0 !important; 
-    }  
+      padding-right: 0 !important;
+    }
     @media screen and (max-width: 1280px){
       flex: 2.7 0 0;
       .px-3{
-        padding-right: 0 !important;  
-      } 
-    }   
+        padding-right: 0 !important;
+      }
+    }
     @media screen and (max-width: 1120px){
       flex: 2 0 0;
       .px-3{
         flex: 0 1 0;
-      }  
+      }
     }
-         
+
   }
   :nth-child(5){
     flex: 0.3 0 0;
@@ -94,14 +94,14 @@ const NavWrapper = styled.div`
     padding: 0;
     .px-3{
       padding-right: 0 !important;
-    }       
+    }
     @media screen and (max-width: 1120px){
       padding-right: 10px;
       .px-3{
         padding-right: 1rem !important;
       }
     }
-    
+
   }
 `
 
@@ -125,16 +125,33 @@ const VerticalLine = styled.div`
 
 const LogoWrapper = styled.div`
   display: flex;
+  align-items: center;
 `
 
 const AppName = styled.div`
-  width: 75px;
-  margin-left: 10px;
-  margin-top: 4px;
-  font-size: 20px;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  margin-left: 4px;
   line-height: 1;
   color:#443f54;
   font-weight: normal;
+  height: 40px;
+  font-weight: 500;
+  text-align: left;
+  >div{
+    &:first-child{
+      font-size: 11px;
+      margin-top: 2.5px;
+      sub{
+        font-size: 25%;
+      }
+    }
+    &:last-child{
+      font-size: 16px;
+      margin-bottom: 1.5px;
+    }
+  }
 `
 
 const WrappedLink = styled(Link)`
@@ -146,16 +163,16 @@ const WrappedLink = styled(Link)`
   }
 `
 const NavStyled = styled(Nav)`
-  padding-top: 14px;
+  padding-top: 10px;
 `
 
-const matchPath = (pathname, path) => {  
+const matchPath = (pathname, path) => {
   let splitArr = pathname.split("/");
   if(splitArr.find(el => el === path)){
     return true;
   }else{
     return false;
-  } 
+  }
 }
 
 const Header = (props) => {
@@ -170,9 +187,10 @@ const Header = (props) => {
               <LogoWrapper>
                 <StyledEosioLogoSmallSVG/>
                 <AppName>
-                  EOSIO Explorer
+                  <div>EOSIO Labs<sub>TM</sub></div>
+                  <div>EOSIO Explorer</div>
                 </AppName>
-              </LogoWrapper>              
+              </LogoWrapper>
             </Nav>
           </WrappedLink>
         </NavWrapper>
@@ -213,12 +231,12 @@ const Header = (props) => {
               <Link to={`/push-action`} className={`nav-link ${pathname === `/push-action` ? `active` : ``}`}>PUSH ACTIONS</Link>
             </NavItem>
           </NavStyled>
-        </NavWrapper>   
+        </NavWrapper>
         <NavWrapperRow>
           <VerticalLine>&nbsp;</VerticalLine>
-        </NavWrapperRow>     
-        <NavWrapperRow>          
-          <Nav className="nav-items d-md-down-none" navbar>              
+        </NavWrapperRow>
+        <NavWrapperRow>
+          <Nav className="nav-items d-md-down-none" navbar>
             <NavItem className="px-3">
               <ConnectionIndicator/>
             </NavItem>

diff --git a/src/pages/InfoPage/components/WelcomePopup/WelcomePopup.jsx b/src/pages/InfoPage/components/WelcomePopup/WelcomePopup.jsx
@@ -53,7 +53,7 @@ const CloseButton = styled.button`
 const InfoPortal = ({ children }) => {
   const modalRoot = document.getElementById('modal');
   const el = document.createElement('div');
-  
+
   useEffect(() => {
     modalRoot.appendChild(el);
   });
@@ -84,16 +84,16 @@ const WelcomePopup = ({ toggle, open, toggleShowAgain }) => {
                 <img src="https://icon.now.sh/x/8ba5bf" alt="close" />
               </CloseButton>
               <PageTitleDivStyled>
-                Welcome to EOSIO Explorer
+                Welcome to EOSIO Labs™: EOSIO Explorer
               </PageTitleDivStyled>
-              <p>EOSIO Explorer is an open source browser to observe activity of an EOSIO blockchain in a graphical
+              <p>EOSIO Labs™: EOSIO Explorer is an open source browser to observe activity of an EOSIO blockchain in a graphical
                 interface and a set of development tools to speed up EOSIO smart contract and application development.
               </p>
-              <p>Using EOSIO Explorer you can view blocks, transactions and actions on an EOSIO blockchain, manage
+              <p>Using EOSIO Labs™: EOSIO Explorer you can view blocks, transactions and actions on an EOSIO blockchain, manage
                 developer accounts and permissions associated with them, upload and interact with smart contracts
                 and much more.
               </p>
-              <p>If you have any feedback or you&apos;d like to contribute to the source code of EOSIO Explorer - 
+              <p>If you have any feedback or you&apos;d like to contribute to the source code of EOSIO Labs™: EOSIO Explorer -
                 please follow our GitHub repository: <a href="https://github.com/EOSIO/eos-toppings" target="_blank" rel="noopener noreferrer">https://github.com/EOSIO/eosio-toppings</a>
               </p>
               <CheckBoxDivStyled style={{marginTop: '31px'}}>
@@ -103,7 +103,7 @@ const WelcomePopup = ({ toggle, open, toggleShowAgain }) => {
                   <span className="checkmark"></span>
                 </label>
               </CheckBoxDivStyled>
-              <ButtonPrimary 
+              <ButtonPrimary
                 onClick={() => closeModal()}
                 style={{
                   position: 'absolute',