generally consistent across web/ios

src/view/com/Tag.tsx

@@ -7,7 +7,7 @@ import {
 
 import {usePalette} from 'lib/hooks/usePalette'
 import {Text, CustomTextProps} from 'view/com/util/text/Text'
-import {Link} from 'view/com/util/Link'
+import {TextLink} from 'view/com/util/Link'
 
 export function Tag({
   value,
@@ -20,16 +20,13 @@ export function Tag({
   const type = textSize || 'xs-medium'
 
   return (
-    <Link
+    <TextLink
-      asAnchor
+      type={type}
+      text={`#${value}`}
       accessible
-      anchorNoUnderline
       href={`/search?q=${value}`}
-      style={[pal.viewLight, styles.tag]}>
+      style={[pal.textLight]}
-      <Text type={type} style={[pal.textLight]}>
+    />
-        #{value}
-      </Text>
-    </Link>
   )
 }
 
@@ -44,23 +41,19 @@ export function InlineTag({
   const type = textSize || 'xs-medium'
 
   return (
-    <Link
+    <TextLink
-      asAnchor
+      type={type}
+      text={`#${value}`}
       accessible
-      anchorNoUnderline
       href={`/search?q=${value}`}
       style={[
-        pal.viewLight,
+        pal.link,
-        styles.tag,
         {
           paddingTop: 0,
           paddingBottom: 2,
         },
-      ]}>
+      ]}
-      <Text type={type} style={[pal.textLight]}>
+    />
-        #{value}
-      </Text>
-    </Link>
   )
 }
 
@@ -90,14 +83,14 @@ export function EditableTag({
       onPointerLeave={hoverOut}
       style={state => [
         pal.viewLight,
-        styles.tag,
+        styles.editableTag,
         {
           opacity: state.pressed || state.focused ? 0.8 : 1,
           outline: 0,
           paddingRight: 6,
         },
       ]}>
-      <Text type="md-medium" style={[pal.textLight, {lineHeight: 13}]}>
+      <Text type="md-medium" style={[pal.textLight]}>
         #{value}
       </Text>
       <FontAwesomeIcon
@@ -116,11 +109,11 @@ export function EditableTag({
 }
 
 const styles = StyleSheet.create({
-  tag: {
+  editableTag: {
     flexDirection: 'row',
     alignItems: 'center',
     gap: 6,
-    paddingTop: 3,
+    paddingTop: 4,
     paddingBottom: 4,
     paddingHorizontal: 8,
     borderRadius: 4,

src/view/com/composer/TagInput.tsx

@@ -5,6 +5,7 @@ import {
   StyleSheet,
   NativeSyntheticEvent,
   TextInputKeyPressEventData,
+  Platform,
 } from 'react-native'
 import {
   FontAwesomeIcon,
@@ -141,8 +142,11 @@ const styles = StyleSheet.create({
     flexGrow: 1,
     minWidth: 100,
     fontSize: 15,
-    lineHeight: 15,
+    lineHeight: Platform.select({
-    paddingTop: 5,
+      web: 20,
-    paddingBottom: 6,
+      native: 18,
+    }),
+    paddingTop: 4,
+    paddingBottom: 4,
   },
 })

src/view/com/post-thread/PostThreadItem.tsx

@@ -333,12 +333,17 @@ export const PostThreadItem = observer(function PostThreadItem({
             {AppBskyFeedPost.isRecord(item.post.record) &&
             item.post.record.tags?.length ? (
               <View
-                style={{
+                style={[
+                  pal.border,
+                  {
                     flexDirection: 'row',
                     flexWrap: 'wrap',
                     gap: 8,
                     paddingBottom: 12,
-                }}>
+                    marginBottom: 12,
+                    borderBottomWidth: 1,
+                  },
+                ]}>
                 {item.post.record.tags.map(tag => (
                   <Tag key={tag} value={tag} textSize="md-medium" />
                 ))}
@@ -387,7 +392,7 @@ export const PostThreadItem = observer(function PostThreadItem({
             ) : (
               <></>
             )}
-            <View style={[s.pl10, s.pb5]}>
+            <View style={[s.pb5]}>
               <PostCtrls
                 big
                 itemUri={itemUri}
@@ -718,7 +723,7 @@ const useStyles = () => {
     },
     expandedInfo: {
       flexDirection: 'row',
-      padding: 10,
+      paddingVertical: 10,
       borderTopWidth: 1,
       borderBottomWidth: 1,
       marginTop: 5,