diff --git a/src/App.jsx b/src/App.jsx
index 6e33fea..3560cc3 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -23,10 +23,10 @@ const router = createBrowserRouter(
function App() {
const theme = useSelector((state) => state.theme.theme)
- const appThemeClass = theme === 'dark' ? 'bg-slate-800 text-white' : 'bg-white text-black'
+ const appThemeClass = theme === 'dark' ? 'bg-slate-800 text-white' : 'bg-slate-300 text-black'
return (
-
+
)
diff --git a/src/components/Card.jsx b/src/components/Card.jsx
index 2be3b9e..47d6c53 100644
--- a/src/components/Card.jsx
+++ b/src/components/Card.jsx
@@ -1,4 +1,5 @@
import { useNavigate } from 'react-router-dom'
+import { useSelector } from 'react-redux'
import PropTypes from 'prop-types'
function CardMenuList({shape, title}) {
@@ -29,13 +30,16 @@ function CardMenuBox() {
function Card({id, isMenuActive, toggleDetail, blogTitle, blogWriter, writerPhotoProfile, blogImageUrl , blogWrittenDate}) {
const navigate = useNavigate()
+ const theme = useSelector((state) => state.theme.theme)
+
+ const cardThemeClass = theme === 'dark' ? 'bg-slate-950 shadow-slate-600 hover:shadow-slate-400' : 'bg-slate-100 shadow-slate-400 hover:shadow-slate-200'
const navigateDetail = () => {
navigate(`/blog/${blogTitle}`)
}
return (
-
+
{blogTitle}