diff --git a/Order Food Online _ Food Delivery App _ Uber Eats.zip b/Order Food Online _ Food Delivery App _ Uber Eats.zip new file mode 100644 index 0000000..40b76c5 Binary files /dev/null and b/Order Food Online _ Food Delivery App _ Uber Eats.zip differ diff --git a/dashboard.css b/dashboard.css new file mode 100644 index 0000000..46d0089 --- /dev/null +++ b/dashboard.css @@ -0,0 +1,212 @@ +* { + margin: 0%; + padding: 0%; + font-family: sans-serif; + color: white; +} + +.menu { + width: 260px; + height: 100vh; + padding: 20px; + overflow: hidden; + background-color: rgb(229, 234, 238); + color: black; + +} + +.profile h4 { + font-size: 1.5rem; + text-transform: capitalize; +} + +.profile { + + display: flex; + gap: 20px; + align-items: center; + padding: 10px; + +} + +.img-box { + width: 50px; + height: 50px; + border-radius: 50%; + overflow: hidden; + border: 3px solid white; + flex-shrink: 0; +} + +.img-box img { + width: 100%; + height: 100%; + +} + +ul li a { + text-decoration: none; + padding: 10px; + margin: 20px 0px; + border-radius: 8px; + display: flex; + gap: 50px; + align-items: center; + transition: 0.5s; + color: #000; +} + +ul li a:hover, +.dashboard { + background-color: #333; +} + +ul { + list-style: none; + position: relative; + height: 95%; + +} + +.logout { + + position: absolute; + bottom: 0; + width: 100%; + padding: 5px; + border-radius: 8px; + + text-align: center; + +} + +.logout a { + background-color: #df1313; +} + +ul li a i { + + font-size: 1.5rem; + color: #000; +} + +ul li a p { + font-size: 1.2rem; + color: #000; +} + +.container { + width: 100%; + padding: 10px; +} + +.titleinfo { + background-color:red; + width: 100%; + padding: 10px; + margin: 5px; + border-radius: 8px; + display: flex; + justify-content: space-between; + align-items: center; + +} + +.titleinfo i { + font-size: 1.5rem; +} + +.box-container { + display: flex; + flex-wrap: wrap; + align-items: center; +} + +.container .box { + width: 500px; + height: 150px; + background-color: #f4ebeb; + color: black; + margin: 10px; + padding: 10px; + border-radius: 8px; + display: flex; + justify-content: space-around; + align-items: center; + flex-grow: 1; + +} + +.box i { + font-size: 3rem; + +} + +.box p { + font-size: 2.5rem; + color: #000; +} + +.box span { + font-size: 2.5rem; + color: #000; +} + +.container .box:hover { + background-color: #555; + transition: 0.5s; +} + +table { + + width: 100%; + text-align: center; + border-spacing: 8px; +} + +th { + background-color: red; + padding: 10px; + border-radius: 8px; +} + +tr, +td { + background-color: rgb(157, 158, 159); + padding: 10px; + border-radius: 8px; + height: 50px; +} + +.price, +.count { + padding: 6px; + border-radius: 8px; + +} + +/* .price { + +} */ +.status { + background-color: #0f0; + color: black; + padding: 5px 10px; + border-radius: 10px; +} +.count { + background-color: #f6f62e; + color: black; +} + +td:hover { + background-color: #555; + transition: 0.5s; +} + +.big-container { + display: flex; + width: 100%; + height: 100vh; + overflow: hidden; +} \ No newline at end of file diff --git a/dashboard.html b/dashboard.html new file mode 100644 index 0000000..553aa6c --- /dev/null +++ b/dashboard.html @@ -0,0 +1,169 @@ +
user
+ 100 +posts
+ 324 +products
+ 30 +revenue
+ 100$ +| order_type | +order_id | + +price | +status | +order_time | +countity | +
|---|---|---|---|---|---|
| pizza | +1 | +100$ | +pending | +10:30 | +2 | +
| burger | +2 | +150$ | +delivered | +17:45 | +4 | +
| fried chikhen | +3 | +180$ | +delivered | +10:00 | +3 | +
| fries | +4 | +20$ | +pending | +19:59 | +10 | +
| fries | +4 | +20$ | +pending | +19:59 | +10 | +
| fries | +4 | +20$ | +pending | +19:59 | +10 | +
aside works!
+ diff --git a/src/app/layout/components/clickevent.spec.ts b/src/app/layout/components/clickevent.spec.ts new file mode 100644 index 0000000..d4670bb --- /dev/null +++ b/src/app/layout/components/clickevent.spec.ts @@ -0,0 +1,8 @@ +import { Clickevent } from './clickevent'; + +describe('Clickevent', () => { + it('should create an instance', () => { + const directive = new Clickevent(); + expect(directive).toBeTruthy(); + }); +}); diff --git a/src/app/layout/components/clickevent.ts b/src/app/layout/components/clickevent.ts new file mode 100644 index 0000000..2f14d82 --- /dev/null +++ b/src/app/layout/components/clickevent.ts @@ -0,0 +1,16 @@ +import { Directive, ElementRef } from '@angular/core'; + +@Directive({ + selector: '[appClickevent]' +}) +export class Clickevent { + + constructor(ele:ElementRef) + { + ele.nativeElement.addEventListener('click',()=>{ + + + }) + } + +} diff --git a/src/app/layout/components/footer/footer.css b/src/app/layout/components/footer/footer.css index e69de29..7918a2f 100644 --- a/src/app/layout/components/footer/footer.css +++ b/src/app/layout/components/footer/footer.css @@ -0,0 +1,104 @@ +@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap'); + +* { + margin : 0; + padding: 0; + box-sizing: border-box; +} + +html { + font-size: 10px; +} + +body { + font-family: "Roboto","Arial",sans-serif; +} +.container { + width: 100%; + margin: 0 auto; + padding: 20px; + display: flex; + justify-content: space-around; +} +.left{ + width: 50%; + height: 200px; + padding: 20px; + display: flex; + flex-direction: column; + justify-content: space-between; +} +.list1 ul,.list2 ul{ + list-style: none; + padding: 20px; + border-radius: 10px; + min-height: 300px; +} +.list1 li, .list2 li{ + padding: 10px; + transition: 0.5s; + border-radius: 5px; + cursor: pointer; +} +.list1 li a, .list2 li a{ + text-decoration: none; + color: black; + font-size: 1rem; + font-weight: 500; +} +.list1 li:hover, .list2 li:hover{ + background-color: #f0f0f0; +} +.left h2{ + font-size: 2rem; + font-weight: 700; + margin-bottom: 20px; +} +.left .images{ + display: flex; + + flex-wrap: wrap; + gap: 10px; +} +.left .images img{ + width: 100%; + height: auto; + border-radius: 10px; +} +.app-store,.play-store{ + width: 150px; + height: auto; + margin-top: 20px; + cursor: pointer; +} +.container2{ + width: 100%; + margin: 0 auto; + padding: 20px; + display: flex; + justify-content: space-between; + align-items: center; + padding: 20px 50px; +} +.social-media{ + display: flex; + gap: 20px; + +} + +.social-media i{ + font-size: 20px; +} +.social-media p{ + font-size: 1rem; + font-weight: 400; +} +.social-media a{ + text-decoration: none; + color: black; + padding: 0 5px; +} +.copyright p{ + font-size: 1rem; + padding: 5px; +} \ No newline at end of file diff --git a/src/app/layout/components/footer/footer.html b/src/app/layout/components/footer/footer.html index dc4e365..df0c287 100644 --- a/src/app/layout/components/footer/footer.html +++ b/src/app/layout/components/footer/footer.html @@ -1,6 +1,6 @@ -