style: UI improvements

src/components/account-bar/account-bar.module.css

@@ -59,7 +59,6 @@
 .searchBar {
   position: absolute;
   border-radius: 7px;
-  background-color: var(--background-secondary);
   right: 2px;
   top: 25px;
   z-index: 3;

src/components/header/header.tsx

@@ -44,7 +44,6 @@ import styles from './header.module.css';
 import SubscribeButton from '../subscribe-button';
 
 const AboutButton = () => {
-  const { t } = useTranslation();
   const params = useParams();
   const location = useLocation();
   const aboutLink = getAboutLink(location.pathname, params);
@@ -54,7 +53,7 @@ const AboutButton = () => {
   return (
     <li className={`${styles.about} ${isInAboutView ? styles.selected : styles.choice}`}>
       <Link to={aboutLink} className={isInSubplebbitSubmitView ? styles.singleAboutButton : ''}>
-        {t('about')}
+        ▶︎
       </Link>
     </li>
   );
@@ -391,7 +390,7 @@ const Header = () => {
             <HeaderTitle title={title} shortAddress={shortAddress} />
           </span>
         )}
-        {isInSubplebbitView && !isInAboutView && (
+        {isInSubplebbitView && (
           <span className={styles.joinButton}>
             <SubscribeButton address={params.subplebbitAddress} />
           </span>

src/components/search-bar/search-bar.module.css

@@ -8,7 +8,6 @@
   background-color: var(--background);
   color: var(--text);
   font-size: 13px;
-  
   font-family: verdana;
   width: 300px;
   box-sizing: border-box;
@@ -58,18 +57,18 @@
   padding: 0 10px;
   height: 0;
   overflow: hidden;
-  transition: height 0.4s linear,
-              visibility 0.4s linear,
-              padding-top 0.4s linear, 
-              margin-top 0.4s linear, 
-              padding-bottom 0.4s linear, 
-              margin-bottom 0.4s linear;  
+  transition: height 0.3s linear,
+              visibility 0.3s linear,
+              padding-top 0.3s linear, 
+              margin-top 0.3s linear, 
+              padding-bottom 0.3s linear, 
+              margin-bottom 0.3s linear;  
   z-index: 1;
   margin-bottom: 10px;
 }
 
 .slideDown {
-  height: 49px;
+  height: 22px;
   padding-top: 10px;
   padding-bottom: 10px;
   margin-top: 5px;

src/components/search-bar/search-bar.tsx

@@ -75,10 +75,10 @@ const SearchBar = ({ isFocused = false }: SearchBarProps) => {
           <input type='checkbox' checked={!isInCommunitySearch} onChange={() => setIsInCommunitySearch(false)} />
           {t('search_community_address')}
         </label>
-        <label>
+        {/* <label>
           <input disabled type='checkbox' checked={isInCommunitySearch} onChange={() => setIsInCommunitySearch(true)} />
           {t('search_feed_post')}
-        </label>
+        </label> */}
       </div>
     </div>
   );

src/components/sidebar/sidebar.tsx

@@ -260,7 +260,7 @@ const Sidebar = ({ comment, isSubCreatedButNotYetPublished, settings, subplebbit
           <ul>
             <li>
               <a href='https://plebbit.com' target='_blank' rel='noopener noreferrer'>
-                {t('about')}
+                plebbit
               </a>
               <span className={styles.footerSeparator}>|</span>
             </li>

src/views/about/about.module.css

@@ -1,4 +1,5 @@
 .content {
   padding: 10px;
   width: 300px;
+  margin-left: auto;
 }