diff --git a/src/features/posts/Post.css b/src/features/posts/Post.css index 7f9be40..8b4eca5 100644 --- a/src/features/posts/Post.css +++ b/src/features/posts/Post.css @@ -3,7 +3,8 @@ .post-body { display: inline-flex; flex-direction: column; - width: 75%; + align-items: center; + width: 85%; padding: 1rem 2rem; border-radius: 10px; background-color: rgb(29, 4, 39); @@ -36,6 +37,7 @@ img, video { .post-metadata { display: inline-flex; + width: 90%; margin-top: 1rem; padding-top: 0.5rem; border-top: 1px solid gray; diff --git a/src/features/posts/Post.js b/src/features/posts/Post.js index 84ba1a3..5421762 100644 --- a/src/features/posts/Post.js +++ b/src/features/posts/Post.js @@ -91,7 +91,6 @@ export default function Post({data, key}) { // before the fetch requests' promises are fulfilled. return ( - <>
{title ? @@ -131,8 +130,6 @@ export default function Post({data, key}) {
-
- ); } \ No newline at end of file diff --git a/src/features/sidebar/Sidebar.js b/src/features/sidebar/Sidebar.js index b64c2c2..4ee9cba 100644 --- a/src/features/sidebar/Sidebar.js +++ b/src/features/sidebar/Sidebar.js @@ -1,5 +1,5 @@ -import React, { useRef, useState } from "react"; -import { useSelector, /* useDispatch */ } from "react-redux"; +import React from "react"; +import { useSelector } from "react-redux"; import { selectAllSubs } from "../reddit/redditSlice"; import { v4 } from 'uuid'; import SidebarItem from "./SidebarItem"; @@ -9,41 +9,17 @@ export default function Sidebar({isCollapsed}) { const allSubs = useSelector(selectAllSubs); let arrayOfSubs = Object.keys(allSubs); - // const [subs, setSubs] = useState(arrayOfSubs); // this piece of state to be used to modify state based on a dispatched action - const [searchSubs, setSearchSubs] = useState(''); // from sidebaritems when the visibility of a sub is toggled on/off - - const searchWindowStyle = useRef('search-inactive'); // this ref allows us to access and modify the class of the search window container from another part of the render function - - const handleChange = (e) => { - e.preventDefault(); - if (e.target.value) { // this logic locally stores the search term in searchSubs, - searchWindowStyle.current = 'search-active'; // and will dispatch a search action from the reddit slice - setSearchSubs(e.target.value); // based on the provided term - } else if (e.target.value === '') { - searchWindowStyle.current = 'search-inactive'; - setSearchSubs(''); - } - } - return ( - <> - {/* isCollapsed is passed from the parent component, and is mutable within the navbar */} + // isCollapsed is passed from the parent component, and is mutable within the navbar +
- { // arrayOfSubs will become subs from useState on implementation of useState - arrayOfSubs.map((sub) => { // Maps each sub to its own line within the sidebar, along with a button that toggles its "isSelected" property + { + arrayOfSubs.map((sub) => { return ( ) }) } -
- - {/* displays subreddit search results */} -
-

Search Results for: {searchSubs}

-

(results here)

-
- ); } \ No newline at end of file