Merge branch 'dev' of https://github.com/RomainVgr/simpleat into dev
This commit is contained in:
Romain
commit
48d4b68b9b
14
package-lock.json
generated
14
package-lock.json
generated
@ -17,6 +17,7 @@
|
||||
"@angular/platform-browser-dynamic": "~13.0.0",
|
||||
"@angular/router": "~13.0.0",
|
||||
"bootstrap": "^5.1.3",
|
||||
"bootstrap-icons": "^1.7.2",
|
||||
"rxjs": "~7.4.0",
|
||||
"tslib": "^2.3.0",
|
||||
"zone.js": "~0.11.4"
|
||||
@ -3401,6 +3402,14 @@
|
||||
"@popperjs/core": "^2.10.2"
|
||||
}
|
||||
},
|
||||
"node_modules/bootstrap-icons": {
|
||||
"version": "1.7.2",
|
||||
"resolved": "https://registry.npmjs.org/bootstrap-icons/-/bootstrap-icons-1.7.2.tgz",
|
||||
"integrity": "sha512-NiR2PqC73AQOPdVSu6GJfnk+hN2z6powcistXk1JgPnKuoV2FSdSl26w931Oz9HYbKCcKUSB6ncZTYJAYJl3QQ==",
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||
@ -15041,6 +15050,11 @@
|
||||
"integrity": "sha512-fcQztozJ8jToQWXxVuEyXWW+dSo8AiXWKwiSSrKWsRB/Qt+Ewwza+JWoLKiTuQLaEPhdNAJ7+Dosc9DOIqNy7Q==",
|
||||
"requires": {}
|
||||
},
|
||||
"bootstrap-icons": {
|
||||
"version": "1.7.2",
|
||||
"resolved": "https://registry.npmjs.org/bootstrap-icons/-/bootstrap-icons-1.7.2.tgz",
|
||||
"integrity": "sha512-NiR2PqC73AQOPdVSu6GJfnk+hN2z6powcistXk1JgPnKuoV2FSdSl26w931Oz9HYbKCcKUSB6ncZTYJAYJl3QQ=="
|
||||
},
|
||||
"brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||
|
||||
@ -20,6 +20,7 @@
|
||||
"@angular/platform-browser-dynamic": "~13.0.0",
|
||||
"@angular/router": "~13.0.0",
|
||||
"bootstrap": "^5.1.3",
|
||||
"bootstrap-icons": "^1.7.2",
|
||||
"rxjs": "~7.4.0",
|
||||
"tslib": "^2.3.0",
|
||||
"zone.js": "~0.11.4"
|
||||
|
||||
@ -1,27 +1,58 @@
|
||||
<div class="container position-relative shadow p-0 mb-5 bg-body rounded rounded m-5 rounded-top " style="width: 18rem;" >
|
||||
<div class="container position-relative shadow p-0 mb-5 bg-body rounded rounded m-5 rounded-top " style="width: 19rem;" >
|
||||
<img class="card-img-top " src="assets/ImagesRestos/photo.jpg" alt="Card image cap">
|
||||
<div class="rond position-absolute">
|
||||
<i class="heart far fa-heart"></i>
|
||||
</div>
|
||||
<div class="card-body rounded-bottom">
|
||||
<h3 class="titre-resto d-flex justify-content-center d-flex align-items-center" style="font-size: 24px;">NOM RESTAURANT</h3>
|
||||
|
||||
|
||||
<div class="accordion" id="accordionExample">
|
||||
|
||||
<h2 class="accordion-header" id="headingOne">
|
||||
<button class="btn" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
|
||||
<h2 class="accordion-header pt-1" id="headingOne">
|
||||
<button class="btn accordion-button collapsed ps-5 pe-5 " type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
|
||||
PLUS D'INFOS
|
||||
</button>
|
||||
</h2>
|
||||
|
||||
<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
|
||||
<div class=" body accordion-body pt-5">
|
||||
<div id="collapseOne" class="accordion-collapse collapse" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
|
||||
<div class=" body accordion-body">
|
||||
<strong>This is the first item's accordion body.</strong>
|
||||
<ul>
|
||||
<li><i class="far fa-star"></i></li>
|
||||
<li><i class="far fa-star"></i></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="star-icon d-flex justify-content-flex-start d-flex align-items-center pt-2 ">
|
||||
<ul class="avis-star d-flex flex-row ps-1 pt-3 pe-0 pb-0 mb-0 ">
|
||||
<li class="star pe-2"><i class="bi bi-star-fill"></i></li>
|
||||
<li class="star pe-2"><i class="bi bi-star-fill"></i></li>
|
||||
<li class="star pe-2"><i class="bi bi-star-fill"></i></li>
|
||||
<li class="star pe-2"><i class="bi bi-star-fill"></i></li>
|
||||
<li class="star"><i class="bi bi-star-fill"></i></li>
|
||||
</ul>
|
||||
<span class="ps-3 mt-3 "style="font-size: 1.1em; color:#545454" >5/5</span>
|
||||
</div>
|
||||
<div class="infos ps-1 pt-2"style="color:#545454">
|
||||
<span class="categorie pe-4"style="font-style: italic;">Kebab</span>
|
||||
<i class="fas fa-walking ps-2 pe-1"style="color:#a8a8a8"></i><span class="categorie pe-4"style="font-weight: bold;">550m</span>
|
||||
<i class="fas fa-euro-sign ps-2 pe-1"style="color:#a8a8a8"></i><span class="prix"style="font-weight: bold;">5-10€</span>
|
||||
</div>
|
||||
<div class="trait-rouge pt-3"></div>
|
||||
<p class="description pt-3 ps-1 pe-1 text-justify d-block" style="font-size:0.9em; color:#545454"><span class="description pe-1"style="font-style: italic;font-weight: bold;">Descriptif :</span> c’est le faux texte standard de l'imprimerie depuis
|
||||
les années 1500, quand un imprimeur anonyme assembla ensemble des morceaux de texte pour
|
||||
réaliser un livre spécimen de polices de texte.</p>
|
||||
<div class="trait-rouge pt-2 pb-0"></div>
|
||||
<div class="critere ps-1 pt-3">
|
||||
<span class="sur-place pe-1" style="color:#545454">Sur place :</span><i class="fas fa-check-square" style="color:#4ECB71"></i>
|
||||
<span class="a-emporter ps-3 pe-1" style="color:#545454">A emporter :</span><i class="fas fa-check-square" style="color:#4ECB71"></i>
|
||||
</div>
|
||||
<div class="trait-rouge pt-3"></div>
|
||||
<div class="critere d-flex justify-content-center ps-1 pt-3 pb-3">
|
||||
<span class="acces-pmr pe-1" style="color:#545454">Accès PMR :</span><i class="fas fa-times-circle ps-1 pt-1" style="color:#ED2F2F"style="color:#ED2F2F"></i>
|
||||
</div>
|
||||
<div class="reserver pt-2">
|
||||
<button type="button" class="button">Réserver</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
@ -1,3 +1,19 @@
|
||||
.rond{
|
||||
padding: 0.7em;
|
||||
background-color: rgb(255, 255, 255);
|
||||
top: 1em;
|
||||
right: 1em;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.heart{
|
||||
display: flex;
|
||||
font-size: 1.6em;
|
||||
padding: 0;
|
||||
margin:0;
|
||||
color: #FF2048;
|
||||
}
|
||||
|
||||
.titre-resto{
|
||||
margin-bottom: 0.9rem;
|
||||
}
|
||||
@ -10,12 +26,58 @@
|
||||
border-radius: 0 0 0.25rem 0.25rem;
|
||||
padding: 1.375rem 0.75rem;
|
||||
|
||||
|
||||
}
|
||||
.accordion-button.collapsed {
|
||||
background: #CE0000;
|
||||
}
|
||||
|
||||
.accordion-button.collapsed::after {
|
||||
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
|
||||
}
|
||||
|
||||
|
||||
.ps-5 {
|
||||
padding-left: 5.4rem !important;
|
||||
}
|
||||
.pe-5 {
|
||||
padding-right: 5rem !important;
|
||||
}
|
||||
|
||||
|
||||
.accordion .btn:focus{
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.star{
|
||||
list-style-type: none;
|
||||
font-size: 1.5em;
|
||||
color:#ffd900;
|
||||
|
||||
}
|
||||
|
||||
.trait-rouge{
|
||||
border-bottom: 1px solid #CE0000;
|
||||
opacity: 50%;
|
||||
|
||||
}
|
||||
|
||||
.button{
|
||||
display: block;
|
||||
padding: 0.5em 2em 0.5em ;
|
||||
width: 100%;
|
||||
border-radius: 5px;
|
||||
border: none;
|
||||
background-color: #545454;
|
||||
color: #ffffff;
|
||||
text-transform: uppercase;
|
||||
font-weight: bold;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@ -1,11 +1,13 @@
|
||||
<nav class="navbar navbar-light">
|
||||
<div class="container-fluid">
|
||||
<img src="assets/images-header/logo.png" alt="logo">
|
||||
<form style="width: 30%;" class="d-flex">
|
||||
<input class="form-control me-5" type="search" placeholder="Trouver votre SIMPL'EAT..." aria-label="Search">
|
||||
</form>
|
||||
<div class="trait">
|
||||
<p>LE BON PLAN POUR MANGER</p>
|
||||
</div>
|
||||
<nav class="navbar navbar-light p-0">
|
||||
<div class="container-fluid d-flex align-items-center pt-3">
|
||||
<div class="logo ps-4">
|
||||
<img src="assets/images-header/LOGO2.png" alt="logo">
|
||||
</div>
|
||||
<form style="width: 30%;" class="d-flex align-items-center pe-2 pt-2">
|
||||
<input class="form-control me-5 position-relative" type="search" placeholder="Trouver votre SIMPL'EAT..." aria-label="Search">
|
||||
</form>
|
||||
<div class="trait">
|
||||
<p>LE BON PLAN POUR MANGER</p>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
@ -19,22 +19,18 @@
|
||||
|
||||
}
|
||||
|
||||
img{
|
||||
padding-left: 2%;
|
||||
|
||||
}
|
||||
|
||||
|
||||
p{
|
||||
background-color: white;
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
left: 130px;
|
||||
left: 68px;
|
||||
padding : 0 10px 0 10px;
|
||||
font-weight: bolder;
|
||||
color: grey;
|
||||
}
|
||||
|
||||
// .form-control{
|
||||
// }
|
||||
|
||||
|
||||
input[type="search"], textarea{
|
||||
background-color: #edf5f1;
|
||||
}
|
||||
|
||||
|
||||
BIN
src/assets/ImagesRestos/pieton.png
Normal file
BIN
src/assets/ImagesRestos/pieton.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 521 B |
BIN
src/assets/images-header/LOGO2.png
Normal file
BIN
src/assets/images-header/LOGO2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.1 KiB |
4
src/assets/pieton.svg
Normal file
4
src/assets/pieton.svg
Normal file
@ -0,0 +1,4 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<circle cx="8" cy="8" r="7.5" stroke="#545454"/>
|
||||
<path d="M8.33333 3C8.10417 3 7.90799 3.09415 7.74479 3.28245C7.5816 3.47075 7.5 3.69712 7.5 3.96154C7.5 4.22596 7.5816 4.45232 7.74479 4.64062C7.90799 4.82893 8.10417 4.92308 8.33333 4.92308C8.5625 4.92308 8.75868 4.82893 8.92188 4.64062C9.08507 4.45232 9.16667 4.22596 9.16667 3.96154C9.16667 3.69712 9.08507 3.47075 8.92188 3.28245C8.75868 3.09415 8.5625 3 8.33333 3ZM6.43229 12.7115L7.3125 11.0469C7.40972 10.8626 7.48264 10.6783 7.53125 10.494L7.83333 9.34014L8.74479 10.4399L9.54167 12.6454C9.57986 12.7536 9.63976 12.8397 9.72135 12.9038C9.80295 12.9679 9.89583 13 10 13C10.1389 13 10.2569 12.9439 10.3542 12.8317C10.4514 12.7196 10.5 12.5833 10.5 12.4231C10.5 12.355 10.4878 12.2829 10.4635 12.2067L9.73438 10.1334C9.68924 10.0012 9.65365 9.91206 9.6276 9.86599C9.60156 9.81991 9.5434 9.74079 9.45312 9.62861L8.42708 8.35457L8.73958 6.65986L9.03125 7.3149C9.08681 7.45112 9.16319 7.54928 9.26042 7.60938C9.28125 7.62139 9.64062 7.83173 10.3385 8.24038C10.5052 8.33654 10.6146 8.38462 10.6667 8.38462C10.7639 8.38462 10.8438 8.34856 10.9062 8.27644C10.9688 8.20433 11 8.11218 11 8C11 7.83574 10.934 7.71354 10.8021 7.63341L9.60938 6.90024L9.14062 5.66226C9.05382 5.44191 8.93924 5.32171 8.79688 5.30168L7.60417 5.14543C7.49306 5.13341 7.34375 5.17147 7.15625 5.25962L5.89583 5.83654C5.82639 5.86859 5.75868 5.92268 5.69271 5.9988C5.62674 6.07492 5.58333 6.15304 5.5625 6.23317C5.28819 7.05048 5.10764 7.59535 5.02083 7.86779C5.00694 7.90385 5 7.94792 5 8C5 8.10417 5.03299 8.19431 5.09896 8.27043C5.16493 8.34655 5.24306 8.38462 5.33333 8.38462C5.40278 8.38462 5.47309 8.36558 5.54427 8.32752C5.61545 8.28946 5.66146 8.24038 5.68229 8.18029L6.21354 6.56971L7.30729 6.09495L6.54167 10.2236L5.5625 12.1466C5.52083 12.2388 5.5 12.3309 5.5 12.4231C5.5 12.5833 5.54861 12.7196 5.64583 12.8317C5.74306 12.9439 5.86111 13 6 13C6.1875 13 6.3316 12.9038 6.43229 12.7115Z" fill="#545454"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.0 KiB |
@ -7,6 +7,7 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="icon" type="image/x-icon" href="favicon.ico">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.2/font/bootstrap-icons.css">
|
||||
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.4/css/all.css" integrity="sha384-DyZ88mC6Up2uqS4h/KRgHuoeGwBcD4Ng9SiP4dIRy0EXTlnuz47vAwmeGwVChigm" crossorigin="anonymous">
|
||||
</head>
|
||||
<body>
|
||||
<app-root></app-root>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user