cleaned css and html

Co-authored-by: Arthur Lu <learthurgo@gmail.com>
This commit is contained in:
rheabhutada02 2022-11-21 12:32:54 -08:00
parent 1798835807
commit 68b0c8edf5
3 changed files with 27 additions and 25 deletions

View File

@ -19,25 +19,28 @@
<script src="./assets/scripts/CreatePage.js" type="module"></script> <script src="./assets/scripts/CreatePage.js" type="module"></script>
</head> </head>
<body> <header>
<input type="button" value="Home" id="home-btn" onclick="window.location.assign('./index.html')">
<div class="top-bar"> <div class="top-bar">
<img src ="./assets/images/icons/Logo.png" alt="logo" /> <img src ="./assets/images/icons/Logo.png" alt="logo" />
<h1> Food Journal </h1> <h1> Food Journal </h1>
<img src ="./assets/images/icons/Logo.png" alt="logo" />
</div> </div>
</header>
<body>
<input type="button" value="Home" id="home-btn" onclick="window.location.assign('./index.html')">
<div class="journal-form"> <div class="journal-form">
<h1>New Entry</h1> <h1>New Entry</h1>
<form id="new-food-entry"> <form id="new-food-entry">
<fieldset> <fieldset>
<legend>Pic:</legend>
Choose Input type: Choose Input type:
<select id="select" name="select"> <select id="select" name="select">
<option value="file">File Upload</option> <option value="file">File Upload</option>
<option value="url">From an URL</option> <option value="url">From an URL</option>
</select> </select>
<label for="mealImage" id="source"> <label for="mealImage" id="source">
Source:
<input type="file" accept="image/*" id="mealImg" name="mealImg"> <input type="file" accept="image/*" id="mealImg" name="mealImg">
</label> </label>
<label for="image-alt"> <label for="image-alt">
@ -45,9 +48,7 @@
Alt Text: Alt Text:
<input type="text" id="imgAlt" name="imgAlt"> <input type="text" id="imgAlt" name="imgAlt">
</label> </label>
</fieldset>
<fieldset>
<legend> Meal: </legend>
<label for="Meal: ">Meal: <label for="Meal: ">Meal:
<input type="text" id="mealName" name="mealName" required> <input type="text" id="mealName" name="mealName" required>
</label> </label>
@ -59,7 +60,9 @@
</label> </label>
</fieldset> </fieldset>
<fieldset class="rating"> <fieldset class="rating">
<legend> Rating: </legend> <br>
Rating:
<br>
<input type="radio" id="s5" name="rating" value="5"/> <label for="s5" id="s5-select"> 5 stars </label> <input type="radio" id="s5" name="rating" value="5"/> <label for="s5" id="s5-select"> 5 stars </label>
<input type="radio" id="s4" name="rating" value="4"/> <label for="s4" id="s4-select"> 4 stars </label> <input type="radio" id="s4" name="rating" value="4"/> <label for="s4" id="s4-select"> 4 stars </label>
<input type="radio" id="s3" name="rating" value="3"/> <label for="s3" id="s3-select"> 3 stars </label> <input type="radio" id="s3" name="rating" value="3"/> <label for="s3" id="s3-select"> 3 stars </label>
@ -68,7 +71,7 @@
</fieldset> </fieldset>
<fieldset> <fieldset>
<legend>Other Info:</legend>
<label for="restaurant"> <label for="restaurant">
Restaurant: Restaurant:
<input type="text" id="restaurant" name="restaurant" required> <input type="text" id="restaurant" name="restaurant" required>
@ -82,8 +85,6 @@
<button type="button" id="tag-add-btn">Add Tag</button> <button type="button" id="tag-add-btn">Add Tag</button>
</label> </label>
</fieldset> </fieldset>
<button type="submit" id="save-btn" value="Submit">Save Review</button> <button type="submit" id="save-btn" value="Submit">Save Review</button>
</form> </form>

View File

@ -10,30 +10,31 @@ body {
} }
h1 {
text-align: center;
}
.top-bar { .top-bar {
margin-top: -8cm; display: flex;
justify-content: center;
} }
.top-bar > img { .top-bar > img {
position: relative; position: relative;
top: 7.85cm; align-self: center;
padding-left: 2.5%;
padding-right: 2.5%;
} }
.top-bar > h1 { .top-bar > h1 {
position: relative; position: relative;
top: 2.2cm; text-align: center;
font-size: 3cm; /*color: #e4c3d2;*/
/*color: rgb(145, 124, 175);*/
color:#516754; color:#516754;
font-size: 6rem;
font-family: 'testFont'; font-family: 'testFont';
} }
.top-bar > form { .journal-form > h1 {
position: relative; font-family: 'testFont';
left: 32cm; text-align: center;
} }
.journal-form { .journal-form {

View File

@ -78,7 +78,7 @@ img#create-btn {
.review-container > div { .review-container > div {
background-color: #f1f1f1; background-color: #f1f1f1;
text-align: center; text-align: center;
}} }
img#create-btn { img#create-btn {
position: relative; position: relative;