diff --git a/packages/components/KeyboardAvoidingView.tsx b/packages/components/KeyboardAvoidingView.tsx
index 9935339418..9ee4ba7f9c 100644
--- a/packages/components/KeyboardAvoidingView.tsx
+++ b/packages/components/KeyboardAvoidingView.tsx
@@ -23,7 +23,7 @@ export const KeyboardAvoidingView = ({
   return (
     <KeyboardAvoiding
       behavior={Platform.OS === "ios" ? "padding" : "height"}
-      style={{ flex: 1 }}
+      style={{ flex: 1, backgroundColor: "#000" }}
       keyboardVerticalOffset={insets.top + insets.bottom + extraVerticalOffset}
     >
       {children}
diff --git a/packages/screens/Mini/Feed/components/detailView/MiniArticlePostDetails.tsx b/packages/screens/Mini/Feed/components/detailView/MiniArticlePostDetails.tsx
index 6f613e437d..be0514da91 100644
--- a/packages/screens/Mini/Feed/components/detailView/MiniArticlePostDetails.tsx
+++ b/packages/screens/Mini/Feed/components/detailView/MiniArticlePostDetails.tsx
@@ -1,5 +1,5 @@
 import React, { useEffect, useMemo, useRef, useState } from "react";
-import { useWindowDimensions, View } from "react-native";
+import { View, useWindowDimensions, KeyboardAvoidingView } from "react-native";
 import Animated, {
   useAnimatedRef,
   useAnimatedScrollHandler,
@@ -11,7 +11,6 @@ import CustomAppBar from "../../../components/AppBar/CustomAppBar";
 
 import { Post } from "@/api/feed/v1/feed";
 import { BrandText } from "@/components/BrandText";
-import { KeyboardAvoidingView } from "@/components/KeyboardAvoidingView";
 import { OptimizedImage } from "@/components/OptimizedImage";
 import { ScreenContainer } from "@/components/ScreenContainer";
 import { CommentsContainer } from "@/components/cards/CommentsContainer";
@@ -123,7 +122,11 @@ export const MiniArticlePostDetails = ({ post, refetchPost }: Props) => {
   if (!metadataToUse) return null;
 
   return (
-    <KeyboardAvoidingView extraVerticalOffset={-100}>
+    <KeyboardAvoidingView
+      behavior={"padding"}
+      style={{ flex: 1, backgroundColor: "#000" }}
+      keyboardVerticalOffset={30}
+    >
       <ScreenContainer
         forceNetworkId={post.networkId}
         fullWidth
@@ -139,6 +142,7 @@ export const MiniArticlePostDetails = ({ post, refetchPost }: Props) => {
           style={{
             flexDirection: "column",
             justifyContent: "space-between",
+            flex: 1,
           }}
         >
           <Animated.ScrollView
diff --git a/packages/screens/Mini/components/MiniCommentInput/SimpleCommentInput.tsx b/packages/screens/Mini/components/MiniCommentInput/SimpleCommentInput.tsx
index d6435b09be..081c3258c3 100644
--- a/packages/screens/Mini/components/MiniCommentInput/SimpleCommentInput.tsx
+++ b/packages/screens/Mini/components/MiniCommentInput/SimpleCommentInput.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import { View, ViewStyle, TextInput } from "react-native";
+import { View, ViewStyle, TextInput, useWindowDimensions } from "react-native";
 
 import penSVG from "../../../../../assets/icons/pen.svg";
 
@@ -23,6 +23,7 @@ export const SimpleCommentInput = ({
   onFocus,
   style,
 }: Props) => {
+  const { width: windowWidth } = useWindowDimensions();
   return (
     <CustomPressable onPress={onFocus}>
       <View
@@ -60,6 +61,8 @@ export const SimpleCommentInput = ({
               {
                 height: 30,
                 color: secondaryColor,
+                width: windowWidth - 150,
+                alignSelf: "center",
               },
             ]}
             onPressOut={onFocus}