From a689d2f494b93ce064a747d42b7cc447d744931d Mon Sep 17 00:00:00 2001
From: Martti Malmi <sirius@iki.fi>
Date: Sat, 29 Jul 2023 09:01:43 +0300
Subject: [PATCH] middle column borders, style

---
 src/js/components/Menu.tsx                   |  2 +-
 src/js/components/OnboardingNotification.tsx |  2 +-
 src/js/views/LogoutConfirmation.tsx          | 23 +++++++++-----------
 src/js/views/Search.tsx                      |  2 +-
 4 files changed, 13 insertions(+), 16 deletions(-)

diff --git a/src/js/components/Menu.tsx b/src/js/components/Menu.tsx
index f9f34bd10..dc5c20b61 100644
--- a/src/js/components/Menu.tsx
+++ b/src/js/components/Menu.tsx
@@ -141,7 +141,7 @@ export default function Menu() {
   };
 
   return (
-    <div className="sticky top-0 z-20 h-screen max-h-screen hidden md:flex xl:w-56 flex-col px-2 py-4 flex-shrink-0">
+    <div className="sticky border-r border-neutral-900 top-0 z-20 h-screen max-h-screen hidden md:flex xl:w-56 flex-col px-2 py-4 flex-shrink-0">
       <a
         className="flex items-center gap-3 px-2 mb-4"
         tabIndex={3}
diff --git a/src/js/components/OnboardingNotification.tsx b/src/js/components/OnboardingNotification.tsx
index fadd6f5f4..53aa8640f 100644
--- a/src/js/components/OnboardingNotification.tsx
+++ b/src/js/components/OnboardingNotification.tsx
@@ -69,7 +69,7 @@ export default class OnboardingNotification extends Component {
 
   renderFollowSuggestions() {
     return (
-      <div className="flex flex-col flex-grow  gap-2">
+      <div className="flex flex-col flex-grow px-2 py-4 md:px-4 gap-2">
         <p className="text-base">{t('follow_someone_info')}</p>
         {SUGGESTED_FOLLOWS.map(([pub, description]) => (
           <div className="flex items-center space-x-4">
diff --git a/src/js/views/LogoutConfirmation.tsx b/src/js/views/LogoutConfirmation.tsx
index 687622191..009593ae2 100644
--- a/src/js/views/LogoutConfirmation.tsx
+++ b/src/js/views/LogoutConfirmation.tsx
@@ -3,22 +3,19 @@ import { route } from 'preact-router';
 import Session from '../nostr/Session';
 import { translate as t } from '../translations/Translation.mjs';
 
+// This should perhaps be a modal instead of a page
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 export default function LogoutConfirmation(_props) {
   return (
-    <div class="main-view" id="logout-confirmation">
-      <div class="centered-container">
-        <p>{t('logout_confirmation_info')}</p>
-        <p>
-          <button className="btn btn-default" onClick={() => route('/settings')}>
-            {t('back')}
-          </button>
-        </p>
-        <p>
-          <button className="btn btn-primary" onClick={() => Session.logOut()}>
-            {t('log_out')}
-          </button>
-        </p>
+    <div className="px-2 md:px-4 py-8 justify-center flex flex-col items-center">
+      <div className="my-4">{t('logout_confirmation_info')}</div>
+      <div className="my-4 flex flex-row gap-2">
+        <button className="btn btn-neutral" onClick={() => route('/settings')}>
+          {t('back')}
+        </button>
+        <button className="btn btn-primary" onClick={() => Session.logOut()}>
+          {t('log_out')}
+        </button>
       </div>
     </div>
   );
diff --git a/src/js/views/Search.tsx b/src/js/views/Search.tsx
index 2173a359f..5c1d0fd99 100644
--- a/src/js/views/Search.tsx
+++ b/src/js/views/Search.tsx
@@ -66,7 +66,7 @@ const Search = (props: any) => {
   const trendingPosts = useCachedFetch(url, 'trendingNotes', dataProcessor);
 
   return (
-    <div class="sticky top-0 right-0 px-4 py-2 mx-2 md:mx-0 flex flex-col gap-4 h-screen">
+    <div class="sticky border-l border-neutral-900 top-0 right-0 px-4 py-2 mx-2 md:mx-0 flex flex-col gap-4 h-screen">
       <SearchBox
         focus={props.focus}
         onSelect={({ key }) => {