Blog Component - Copy this React, Tailwind Component to your project
Create a simple and responsive blog website focused on 'Updates & News,' similar to Wikipedia in simplicity. The website should have two main sections: a sidebar on the left and a news section in the center. The main page will feature 10 categories, with varying numbers of posts in each category. The page should be long to accommodate all the content. Sidebar (Left): The sidebar should be positioned on the left side of the page. It should contain categories for different types of posts and updates: 'ALL' 'Technology' 'Health' 'Sports' 'Medical' 'Digital Marketing' 'AI Tools' 'Software Updates' 'New Best Apps' 'Computer Viruses' The sidebar should have a light background color, and category names should be displayed in a darker, readable font. The design should be simple and clean, with clear labels for the categories. Main Content (Center): The center of the page should display the latest news updates. The main page will have 10 categories. Some categories should have two posts, and others should have one post, with the page being long enough to fit all this content. Each news item should contain: A thumbnail image. A heading for the news post. A short summary or description of the news. A 'Read More' button that links to the full article. The following structure should be used: 'ALL' category will display posts from all categories. 'Technology' and 'AI Tools' should each display 2 posts. 'Health,' 'Sports,' 'Medical,' 'Digital Marketing,' 'Software Updates,' 'New Best Apps,' 'Computer Viruses' should each display 1 post. The thumbnail image should be aligned on the left side, and the heading, summary, and 'Read More' button should be on the right side. Additional Styling: The overall design should be minimalistic, with a focus on readability and simplicity. Ensure the layout is responsive for mobile, tablet, and desktop screens. Use light colors for the background (e.g., white or light gray) and darker text (e.g., black or dark gray) for contrast and readability. Style the 'Read More' buttons with a simple design, such as a color change on hover for interaction. The website should have smooth navigation, allowing users to quickly access news from different categories. The page should be long enough to display all categories and their respective posts." Additional Notes for AI Tool: Ensure that the website is easy to update with new posts, and categories in the sidebar can be edited. The 'ALL' category should pull posts from all other categories and display them on the main page. Provide a working example with placeholder text and images for the news posts and categories.
