re-rolling the style tweaks (#2068)

packages/insomnia-app/app/ui/components/wrapper-debug.js

@@ -71,7 +71,7 @@ class WrapperDebug extends React.PureComponent<Props> {
         className="app-header"
         gridLeft={
           <React.Fragment>
-            <img src={designerLogo} alt="Insomnia" width="24" height="24" />
+            <img src={designerLogo} alt="Insomnia" width="32" height="32" />
             <Breadcrumb
               className="breadcrumb"
               crumbs={['Documents', activeApiSpec.fileName]}

packages/insomnia-app/app/ui/components/wrapper-design.js

@@ -203,7 +203,7 @@ class WrapperDesign extends React.PureComponent<Props, State> {
             className="app-header"
             gridLeft={
               <React.Fragment>
-                <img src={designerLogo} alt="Insomnia" width="24" height="24" />
+                <img src={designerLogo} alt="Insomnia" width="32" height="32" />
                 <Breadcrumb className="breadcrumb" crumbs={['Documents', activeApiSpec.fileName]} onClick={this._handleBreadcrumb} />
               </React.Fragment>
             }

packages/insomnia-app/app/ui/components/wrapper-home.js

@@ -349,7 +349,7 @@ class WrapperHome extends React.PureComponent<Props, State> {
     let defaultActivity = ACTIVITY_DEBUG;
 
     if (spec || w.scope === 'spec') {
-      label = 'Unknown';
+      label = '';
       if (specFormat === 'openapi') {
         label = `OpenAPI ${specFormatVersion}`;
       } else if (specFormat === 'swagger') {
@@ -415,7 +415,7 @@ class WrapperHome extends React.PureComponent<Props, State> {
             className="app-header"
             gridLeft={
               <React.Fragment>
-                <img src={designerLogo} alt="Insomnia" width="24" height="24" />
+                <img src={designerLogo} alt="Insomnia" width="32" height="32" />
                 <Breadcrumb className="breadcrumb" crumbs={['Documents']} />
               </React.Fragment>
             }
@@ -427,7 +427,7 @@ class WrapperHome extends React.PureComponent<Props, State> {
                     type="text"
                     placeholder="Filter..."
                     onChange={this._handleFilterChange}
-                    className="no-margin workspace-filter"
+                    className="no-margin"
                   />
                   <span className="fa fa-search filter-icon"></span>
                 </KeydownBinder>

packages/insomnia-app/app/ui/css/components/document-listing.less

@@ -22,6 +22,10 @@
     flex-direction: row;
     align-items: center;
 
+    input {
+      border-radius: 3px;
+    }
+
     h1 {
       // Fill space after H1 until the next element
       margin-right: auto;

packages/insomnia-app/app/ui/css/components/wrapper.less

@@ -46,7 +46,7 @@
     flex-direction: row !important;
     -webkit-box-align: center !important;
     align-items: center !important;
-    border-radius: 2px;
+    border-radius: 3px;
     border-width: 1px;
     border-style: solid;
     border-color: initial;

packages/insomnia-components/components/button.js

@@ -14,7 +14,7 @@ const StyledButton: React.ComponentType<Props> = styled.button`
   font-size: var(--font-size-sm);
   padding: 0 var(--padding-md);
   height: var(--line-height-xs);
-  border-radius: 2px;
+  border-radius: 3px;
   display: flex !important;
   flex-direction: row !important;
   align-items: center !important;

packages/insomnia-components/components/card.js

@@ -88,6 +88,10 @@ const CardHeader: React.ComponentType<{}> = styled.div`
     align-items: center;
     padding-left: var(--padding-md);
     padding-right: var(--padding-md);
+
+    &:empty {
+      visibility: hidden;
+    }
   }
 
   .card-menu {
@@ -176,6 +180,7 @@ const CardBody: React.ComponentType<{}> = styled.div`
   padding-left: var(--padding-md);
   .title {
     font-size: var(--font-size-md);
+    padding-right: var(--padding-md);
   }
 
   .version {

packages/insomnia-components/components/header.js

@@ -11,7 +11,7 @@ type Props = {|
 
 const StyledHeader: React.ComponentType<{}> = styled.div`
       border-bottom:1px solid var(--hl-md);
-      padding: var(--padding-sm) var(--padding-md);
+      padding: var(--padding-md);
       display: grid;
       grid-template-columns: 2fr 1.5fr 2fr;
       grid-template-rows: 1fr;