page home responsive & change component element & page blog item

components/blog/detail/commentUser/AddComment.js

@@ -0,0 +1,18 @@
+import { Button } from '@mui/material'
+import React from 'react'
+
+function AddComment() {
+    return (
+        <div className='flex items-center justify-start gap-[16px] my-[24px]'>
+            <p className='text-[#616161] text-[16px] font-normal'>شما هم نظر خود را به اشتراک بگذارید:</p>
+            <Button
+                variant='outlined'
+                className='!border !border-[#5559CE] !rounded-[4px] !px-[38px] !py-[9px]'
+            >
+                ثبت نظر
+            </Button>
+        </div>
+    )
+}
+
+export default AddComment

components/blog/detail/commentUser/index.js

@@ -0,0 +1,19 @@
+import AnimationTextHead from '@/app/component/AnimationTextHead'
+import Comment from '@/app/component/comment'
+import Underline from '@/components/icons/Underline'
+import React from 'react'
+import AddComment from './AddComment'
+
+function CommentUser({ data }) {
+    return (
+        <div className='mt-[24px]'>
+            <AnimationTextHead name='zoom-in-up' text='نظرات'>
+                <Underline />
+            </AnimationTextHead>
+            <AddComment />
+            <Comment data={data} />
+        </div>
+    )
+}
+
+export default CommentUser