Merge pull request #14 from ismail-kharrobi/DEV-FRONT

Dev front

backend/code/prisma/migrations/20230822133234_init/migration.sql

@@ -0,0 +1,25 @@
+-- CreateTable
+CREATE TABLE "User" (
+ "id" SERIAL NOT NULL,
+ "email" TEXT NOT NULL,
+ "name" TEXT,
+
+ CONSTRAINT "User_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "Post" (
+ "id" SERIAL NOT NULL,
+ "title" TEXT NOT NULL,
+ "content" TEXT,
+ "published" BOOLEAN NOT NULL DEFAULT false,
+ "authorId" INTEGER NOT NULL,
+
+ CONSTRAINT "Post_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateIndex
+CREATE UNIQUE INDEX "User_email_key" ON "User"("email");
+
+-- AddForeignKey
+ALTER TABLE "Post" ADD CONSTRAINT "Post_authorId_fkey" FOREIGN KEY ("authorId") REFERENCES "User"("id") ON DELETE RESTRICT ON UPDATE CASCADE;

backend/code/prisma/migrations/migration_lock.toml

@@ -0,0 +1,3 @@
+# Please do not edit this file manually
+# It should be added in your version-control system (i.e. Git)
+provider = "postgresql"

frontend/code/src/Auth/Assets/Button.tsx

@@ -0,0 +1,20 @@
+export const Button = () =>{
+ return (
+ <svg className="w-80 hover:fill-slate-500 transition duration-500 hover:-translate-y-1 hover:scale-110 ease-in-out" width="330" height="81" viewBox="0 0 330 81" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <rect className="" width="330" height="81" rx="13" fill="#8C67F6"/>
+ <g clipPath="url(#clip0_1_36)">
+ <path d="M63 51.9565H85.1076V63H96.1395V43.0435H74.0756L96.1395 21H85.1076L63 43.0435V51.9565Z" fill="white"/>
+ <path d="M100.892 32.0435L111.924 21H100.892V32.0435Z" fill="white"/>
+ <path d="M111.924 32.0435L100.892 43.0435V54.0435H111.924V43.0435L123 32.0435V21H111.924V32.0435Z" fill="white"/>
+ <path d="M123 43.0435L111.924 54.0435H123V43.0435Z" fill="white"/>
+ </g>
+ <path d="M153.828 48.15H162.369V54H146.184V26.505H153.828V48.15ZM178.523 54.273C175.949 54.273 173.583 53.675 171.425 52.479C169.267 51.257 167.551 49.58 166.277 47.448C165.029 45.29 164.405 42.859 164.405 40.155C164.405 37.451 165.029 35.033 166.277 32.901C167.551 30.743 169.267 29.066 171.425 27.87C173.583 26.674 175.949 26.076 178.523 26.076C181.123 26.076 183.489 26.674 185.621 27.87C187.779 29.066 189.482 30.743 190.73 32.901C191.978 35.033 192.602 37.451 192.602 40.155C192.602 42.859 191.978 45.29 190.73 47.448C189.482 49.58 187.779 51.257 185.621 52.479C183.463 53.675 181.097 54.273 178.523 54.273ZM178.523 47.175C180.473 47.175 182.007 46.538 183.125 45.264C184.269 43.99 184.841 42.287 184.841 40.155C184.841 37.971 184.269 36.255 183.125 35.007C182.007 33.733 180.473 33.096 178.523 33.096C176.547 33.096 175 33.733 173.882 35.007C172.764 36.255 172.205 37.971 172.205 40.155C172.205 42.313 172.764 44.029 173.882 45.303C175 46.551 176.547 47.175 178.523 47.175ZM213.588 35.553C213.146 34.825 212.535 34.266 211.755 33.876C211.001 33.486 210.104 33.291 209.064 33.291C207.14 33.291 205.619 33.915 204.501 35.163C203.409 36.411 202.863 38.088 202.863 40.194C202.863 42.56 203.448 44.367 204.618 45.615C205.814 46.837 207.543 47.448 209.805 47.448C212.483 47.448 214.394 46.239 215.538 43.821H207.855V38.322H222.129V45.732C221.531 47.188 220.647 48.553 219.477 49.827C218.333 51.101 216.877 52.154 215.109 52.986C213.341 53.792 211.326 54.195 209.064 54.195C206.308 54.195 203.864 53.61 201.732 52.44C199.626 51.244 197.988 49.593 196.818 47.487C195.674 45.355 195.102 42.924 195.102 40.194C195.102 37.49 195.674 35.085 196.818 32.979C197.988 30.847 199.626 29.196 201.732 28.026C203.838 26.83 206.269 26.232 209.025 26.232C212.483 26.232 215.343 27.064 217.605 28.728C219.867 30.392 221.271 32.667 221.817 35.553H213.588ZM233.199 26.505V54H225.555V26.505H233.199ZM263.019 54H255.375L245.196 38.634V54H237.552V26.505H245.196L255.375 42.066V26.505H263.019V54Z" fill="white"/>
+ <defs>
+ <clipPath id="clip0_1_36">
+ <rect width="60" height="42" fill="white" transform="translate(63 21)"/>
+ </clipPath>
+ </defs>
+ </svg>
+
+ )
+}

frontend/code/src/Auth/index.tsx

@@ -1,17 +1,19 @@
 import { Link } from "react-router-dom";
 import pingpong from '../images/pingpong.svg'
-import button from '../images/button.svg'
+import {Button} from './Assets/Button'
+
 export const Login = () =>
 {
+
  return (
  <div className="auth-container overflow-hidden flex flex-col items-center justify-center h-screen bg-[url(./images/bg.gif)] bg-luxury bg-no-repeat bg-cover bg-center">
  <div className="overlay absolute h-full w-full bg-black opacity-40 z-10"></div>
  <div className="auth-section p-16 absolute top-[25%] sm:top-[30%] xl:top-[35%] z-50 flex flex-col items-center gap-y-20">
  <div className="logo-container flex flex-col justify-center">
- <img className="logo" src={pingpong} alt="Logo" />
+ <img src={pingpong} alt="Logo" />
  </div>
- <Link to="/main">
- <img className=" flex justify-center items-center p-2" src={button} alt="Auth Button" />
+ <Link to="/layout">
+ <Button/>
  </Link>
  </div>
  </div>

frontend/code/src/Layout/Assets/Alert.tsx

@@ -0,0 +1,9 @@
+
+export const Alert = () => { 
+ return (
+ <svg className="flex justify-center items-center w-10 sm:w-12 " width="62" height="62" viewBox="0 0 62 62" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <rect width="62" height="62" rx="20" fill="black"/>
+ <path d="M27.9189 40.1081C28.5314 39.9785 32.2636 39.9785 32.8761 40.1081C33.3997 40.229 33.966 40.5116 33.966 41.1286C33.9355 41.716 33.5909 42.2367 33.1148 42.5674C32.4974 43.0487 31.7729 43.3535 31.0155 43.4633C30.5966 43.5176 30.185 43.5188 29.7807 43.4633C29.0221 43.3535 28.2976 43.0487 27.6814 42.5662C27.2041 42.2367 26.8594 41.716 26.829 41.1286C26.829 40.5116 27.3952 40.229 27.9189 40.1081ZM30.4698 19C33.0185 19 35.6219 20.2093 37.1684 22.2158C38.1718 23.5078 38.6321 24.7986 38.6321 26.8051V27.327C38.6321 28.8658 39.0388 29.7728 39.9338 30.818C40.6121 31.588 40.8288 32.5765 40.8288 33.6488C40.8288 34.7199 40.4769 35.7367 39.7719 36.5623C38.8488 37.552 37.5471 38.1838 36.2186 38.2936C34.2934 38.4577 32.367 38.5959 30.415 38.5959C28.4618 38.5959 26.5366 38.5132 24.6114 38.2936C23.2817 38.1838 21.98 37.552 21.0582 36.5623C20.3531 35.7367 20 34.7199 20 33.6488C20 32.5765 20.218 31.588 20.895 30.818C21.818 29.7728 22.198 28.8658 22.198 27.327V26.8051C22.198 24.7443 22.7118 23.3967 23.77 22.0776C25.3433 20.1538 27.8652 19 30.3602 19H30.4698Z" fill="#8F8F8F"/>
+ </svg>
+ )
+}

frontend/code/src/Layout/Assets/Avatar.tsx

@@ -0,0 +1,17 @@
+import avatart from '../images/avatar.jpg'
+export const Avatar = () =>{
+ return (
+ <div className="avatar online dropdown">
+ <div tabIndex={0} className="w-10 sm:w-12 rounded-xl">
+ <img alt="profile " src={avatart} />
+ </div>
+ <ul tabIndex={0} className="dropdown-content z-50 right-0 top-10 menu p-2 shadow bg-base-100 rounded-box w-52">
+ <li className="hover:bg-primary hover:rounded-xl transform duration-500"><a href="/main">Settings</a></li>
+ <li className="hover:bg-primary hover:rounded-xl transform duration-500"><a href="/main">Profile</a></li>
+ </ul>
+ </div>
+
+
+
+ )
+}

frontend/code/src/Layout/Assets/Dash.tsx

@@ -0,0 +1,10 @@
+export const Dash = () => {
+ return (
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <rect x="4" y="4" width="6" height="7" rx="1" stroke="#BDBDBD" stroke-width="2" stroke-linejoin="round"/>
+ <rect x="4" y="15" width="6" height="5" rx="1" stroke="#BDBDBD" stroke-width="2" stroke-linejoin="round"/>
+ <rect x="14" y="4" width="6" height="5" rx="1" stroke="#BDBDBD" stroke-width="2" stroke-linejoin="round"/>
+ <rect x="14" y="13" width="6" height="7" rx="1" stroke="#BDBDBD" stroke-width="2" stroke-linejoin="round"/>
+ </svg>
+ )
+}