Authorization

README.md

@@ -1,2 +1,69 @@
-# css-frameworks-ca
-Replace this text with a description of your social media project.
+# ConnectSphere (css-frameworks-ca)
+
+ConnectSphere is a dynamic social media platform designed to enhance user engagement. Users can create personalized profiles, share diverse content, and interact effortlessly. 
+
+## Table of Contents
+
+- [Overview](#overview)
+- [UI Components](#ui-components)
+- [Planned features](#planned-features)
+- [Installation](#installation)
+- [Usage](#usage)
+
+## Overview
+
+ConnectSphere is a social media website that allows users to:
+
+- Create and manage their profiles
+- Share posts including text and images
+- Interact with others through likes, comments, and follows
+- Discover and connect with other users through search and recommendations
+
+## UI Components
+
+### Authentication Page
+
+- **Login/Registration Form**: Fields for username, email, and password.
+- **Action Buttons**: "Sign in" and "Sign up."
+- **Forgot Password**: Link for password recovery.
+
+### Home Feed Page
+
+- **Post Previews**: Stream of user posts with text, images, and engagement metrics.
+- **Search Bar**: Locate posts and user profiles.
+- **Sort Options**: Filter posts by recent activity and popularity.
+- **New Post Form**: Fields for text, image upload, and hashtags.
+- **Engagement Buttons**: Like and Comment options for each post.
+
+### User Profile Page
+
+- **Profile Photo and Header Image**: Display user’s image and cover.
+- **Follow/Unfollow Button**: Manage connections.
+- **User's Content**: Scrollable section for the user’s posts.
+- **Connection Metrics**: Show followers and following counts with clickable links.
+- **Profile Edit Option**: Update user information.
+
+## Planned Features
+
+- **Account Management**: Create, modify, or delete profiles.
+- **Interaction Capabilities**: Like, comment, and manage followers.
+- **Content Management**: Create or delete posts and comments.
+- **Discoverability Tools**: Search for posts and user profiles.
+
+## Installation
+
+To get started with ConnectSphere, clone the repository and install the dependencies:
+
+```bash
+git clone https://github.com/NoroffFEU/css-frameworks-ca.git
+cd css-frameworks-ca
+npm install
+```
+## Usage
+
+To start the development server and begin working on your project, run:
+
+```bash
+npm run dev
+```
+This will run both the sass watcher and live-server, allowing you to see live changes as you develop.