form and recipe name style
This commit is contained in:
parent
a8ae987a1c
commit
e407e71eef
@ -20,7 +20,7 @@ if ($O_recipe === null) {
|
||||
}
|
||||
?>
|
||||
|
||||
<main>
|
||||
<main class="editRecipe">
|
||||
<?php
|
||||
if ($O_recipe !== null) { ?>
|
||||
<a href="/recipe/view/<?= $O_recipe->I_ID ?>">Retour</a>
|
||||
@ -29,15 +29,12 @@ if ($O_recipe === null) {
|
||||
|
||||
<form action="<?= $A_view["POST_URI"] ?>" method="post">
|
||||
|
||||
<label for="recipeImage">Entrez l'image de haut de page :</label>
|
||||
<label for="recipeImage">Ajoutez l'image de haut de page :</label>
|
||||
<input type="file" name="recipeImage" id="recipeImage">
|
||||
|
||||
<label for="recipeName">Nom de la recette :</label>
|
||||
<input type="text" name="recipeName" id="recipeName" placeholder="Nom du plat" value="<?= $S_name ?>" required>
|
||||
</br>
|
||||
<label for="recipeDescription">Description de la recette</label>
|
||||
</br>
|
||||
<textarea name="recipeDescription" id="recipeDescription"><?= $S_descr ?></textarea>
|
||||
<textarea name="recipeDescription" id="recipeDescription" placeholder="Faites une description appétissante ! 😋"><?= $S_descr ?></textarea>
|
||||
|
||||
<section>
|
||||
<h1>Informations alimentaires</h1>
|
||||
@ -133,6 +130,7 @@ if ($O_recipe === null) {
|
||||
</ol>
|
||||
<button type="button" disabled="disabled" id="recipeButtonInstructionLess">-</button>';
|
||||
$numberOfIngredients = 1;
|
||||
$numberOfInstructions = 1;
|
||||
}
|
||||
?>
|
||||
<button type="button" id="recipeButtonInstructionPlus">+</button>
|
||||
@ -147,6 +145,7 @@ if ($O_recipe === null) {
|
||||
</main>
|
||||
|
||||
<script>
|
||||
console.log("a");
|
||||
numberOfIngredients = <?= $numberOfIngredients ?>;
|
||||
const buttonIngredientPlus = document.querySelector("#recipeButtonIngredientPlus");
|
||||
const buttonIngredientLess = document.querySelector("#recipeButtonIngrdientLess");
|
||||
|
@ -302,7 +302,10 @@ main.userView > form > label {
|
||||
font-size: var(--size-l);
|
||||
}
|
||||
|
||||
:is(main.userView > form, main.search > article > form) > :is(input[type=text], input[type=email]) {
|
||||
:is(main.userView > form,
|
||||
main.search > article > form)
|
||||
> :is(input[type=text],
|
||||
input[type=email]) {
|
||||
height: var(--size-l);
|
||||
border-radius: var(--border-radius);
|
||||
padding: var(--size-l);
|
||||
@ -311,7 +314,9 @@ main.userView > form > label {
|
||||
font-size: var(--size-l);
|
||||
}
|
||||
|
||||
:is(main.userView > form, main.search > article > form) > input[type=submit] {
|
||||
:is(main.userView > form,
|
||||
main.search > article > form)
|
||||
> input[type=submit] {
|
||||
background: var(--principal-neutral);
|
||||
border: none;
|
||||
border-radius: var(--border-radius);
|
||||
@ -345,6 +350,50 @@ main.search > article > section {
|
||||
gap: var(--size-xl);
|
||||
}
|
||||
|
||||
main.editRecipe {
|
||||
min-width: 300px;
|
||||
width: 600px;
|
||||
max-width: 700px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
main.editRecipe > form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--size-l);
|
||||
margin-top: var(--size-xl);
|
||||
margin-bottom: var(--size-xl);
|
||||
}
|
||||
main.editRecipe > form > label {
|
||||
display: none;
|
||||
}
|
||||
main.editRecipe > form > label:first-child {
|
||||
display: block;
|
||||
}
|
||||
main.editRecipe > form > :is(input, textarea) {
|
||||
font-family: 'Nunito', 'Arial';
|
||||
}
|
||||
main.editRecipe > form > input#recipeName {
|
||||
font-weight: 600;
|
||||
font-size: var(--size-xl);
|
||||
background: var(--secondary-pastel);
|
||||
border: none;
|
||||
border-bottom: var(--border) var(--principal-neutral);
|
||||
padding-bottom: var(--size-m);
|
||||
padding-left: var(--size-m);
|
||||
}
|
||||
main.editRecipe > form > input#recipeName:focus-visible {
|
||||
outline: none;
|
||||
}
|
||||
main.editRecipe > form > textarea#recipeDescription {
|
||||
font-size: var(--size-l);
|
||||
border: none;
|
||||
background: var(--secondary-pastel);
|
||||
}
|
||||
main.editRecipe > form > textarea#recipeDescription:focus-visible {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
Loading…
Reference in New Issue
Block a user