feat: finished styling convesation category

including block list, added quick link to github release

ts/components/settings/BlockedList.tsx

@@ -18,20 +18,28 @@ const BlockedEntriesContainer = styled.div`
   overflow: auto;
   min-height: 40px;
   max-height: 100%;
-  background: var(--color-input-background); // TODO theming update
 `;
 
 const BlockedEntriesRoundedContainer = styled.div`
   overflow: hidden;
+  background: var(--background-secondary-color);
+  border: 1px solid var(--border-color);
   border-radius: 16px;
   padding: var(--margins-lg);
-  background: var(--color-input-background); // TODO theming update
+  margin: 0 var(--margins-lg);
 `;
 
 const BlockedContactsSection = styled.div`
   display: flex;
   flex-direction: column;
   min-height: 0;
+
+  background: var(--settings-tab-background-color);
+  color: var(--settings-tab-text-color);
+  border-top: 1px solid var(--border-color);
+  border-bottom: 1px solid var(--border-color);
+
+  margin-bottom: var(--margins-lg);
 `;
 
 const BlockedContactListTitle = styled.div`
@@ -50,10 +58,6 @@ export const StyledBlockedSettingItem = styled.div<{ clickable: boolean }>`
   font-size: var(--font-size-md);
   padding: var(--margins-lg);
 
-  background: var(--color-cell-background);
-  color: var(--color-text);
-  border-bottom: var(--border-session);
-
   cursor: ${props => (props.clickable ? 'pointer' : 'unset')};
 `;
 
@@ -143,18 +147,20 @@ export const BlockedContactsList = () => {
                 iconRotation={expanded ? 0 : 180}
                 dataTestId="reveal-blocked-user-settings"
               />
-              <SpacerLG />
             </BlockedContactListTitleButtons>
           )}
         </BlockedContactListTitle>
       </StyledBlockedSettingItem>
       {expanded && !noBlockedNumbers ? (
-        <BlockedEntries
-          blockedNumbers={blockedNumbers}
-          selectedIds={selectedIds}
-          addToSelected={addToSelected}
-          removeFromSelected={removeFromSelected}
-        />
+        <>
+          <BlockedEntries
+            blockedNumbers={blockedNumbers}
+            selectedIds={selectedIds}
+            addToSelected={addToSelected}
+            removeFromSelected={removeFromSelected}
+          />
+          <SpacerLG />
+        </>
       ) : null}
     </BlockedContactsSection>
   );

ts/components/settings/SessionSettings.tsx

@@ -61,21 +61,33 @@ const StyledSpanSessionInfo = styled.span`
   opacity: 0.4;
   transition: var(--default-duration);
   user-select: text;
+  cursor: pointer;
 
-  :hover {
+  &:hover {
     opacity: 1;
   }
 `;
 
 const SessionInfo = () => {
-  const openOxenWebsite = () => {
-    void shell.openExternal('https://oxen.io/');
-  };
   return (
     <StyledVersionInfo>
-      <StyledSpanSessionInfo>v{window.versionInfo.version}</StyledSpanSessionInfo>
+      <StyledSpanSessionInfo
+        onClick={() => {
+          void shell.openExternal(
+            `https://github.com/oxen-io/session-desktop/releases/tag/v${window.versionInfo.version}`
+          );
+        }}
+      >
+        v{window.versionInfo.version}
+      </StyledSpanSessionInfo>
       <StyledSpanSessionInfo>
-        <SessionIconButton iconSize="medium" iconType="oxen" onClick={openOxenWebsite} />
+        <SessionIconButton
+          iconSize="medium"
+          iconType="oxen"
+          onClick={() => {
+            void shell.openExternal('https://oxen.io/');
+          }}
+        />
       </StyledSpanSessionInfo>
       <StyledSpanSessionInfo>{window.versionInfo.commitHash}</StyledSpanSessionInfo>
     </StyledVersionInfo>