almost done

This commit is contained in:
abh1sh3kk 2023-03-31 23:21:13 +05:45
parent cdf7a087e3
commit 7c443ed8d4
6 changed files with 157 additions and 82 deletions

View File

@ -19,19 +19,20 @@ export const TemplateManagement = () => {
return (
<main class="template-page">
<section class="form-container2">
<section class="form-container">
<h1>Template Management Page</h1>
<form onsubmit={submitForm}>
<div class="create-template">Create Template </div>
<label>
<div class="create-template">Create HTML Template </div>
<div>
<div>HTML Template:</div>
<textarea
value={htmlBody()}
class="textarea"
onInput={(e) => setHtmlBody(e.target.value)}
/>
</div>
</label>
<label>
<div>Subject:</div>
@ -54,13 +55,73 @@ export const TemplateManagement = () => {
<input class="btn" type="submit" value="Submit" />
</form>
</section>
<section class="template-list">
<section class="template-list-container">
<h2>Templates</h2>
<ul>
<For each={templates()}>
<ul class="template-list">
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
<li>Hi, I am Abhishek</li>
{/* <For each={templates()}>
{(template) => <li>{template}</li>}
</For>
</For> */}
</ul>
</section>
</main>

View File

@ -74,6 +74,7 @@ export const MailManagement = () => {
return (
<main class="mail-management-page">
<div class="mail-management-container flex-center flex-column">
<section class="form-container">
<h1>Mail Management Page</h1>
@ -116,12 +117,15 @@ export const MailManagement = () => {
</>
)}
<input type="submit" value="Send" class="btn btn-send" />
<input
type="submit"
value="Send"
class="btn btn-send"
/>
</form>
</section>
<div>
<section>
<table border={1} class="the-table">
<table class="the-table">
<thead>
<tr>
<For each={variables()}>

View File

@ -5,18 +5,7 @@ nav {
display: flex;
justify-content: center;
align-items: center;
/* -------testing--------- */
/* position: fixed;
top: 0;
left: 0;
right: 0; */
/* -------testing--------- */
}
main {
/* margin-top: 64px; */
}
.nav-list {
display: flex;
gap: 3rem;

View File

@ -1,9 +1,21 @@
.template-list {
border: 2px solid red;
.template-list-container {
border: 2px solid gray;
margin: 1rem;
padding: 0.5rem;
align-self: center;
min-width: 350px;
}
.template-list {
max-height: 500px;
overflow: scroll;
}
.template-list-container > h2 {
margin-bottom: 0.5rem;
}
.template-page {
display: flex;
flex-direction: row;
@ -11,5 +23,9 @@
gap: 2rem;
}
.form-container {
max-width: 600px;
flex: 1;
}
.template-list > li {
margin-block: 0.5rem;
}

View File

@ -20,15 +20,22 @@ body {
/* -----------Homepage----------------- */
/* ---------------------------- */
.flex-center {
display: flex;
justify-content: center;
align-items: center;
}
.flex-column {
flex-direction: column;
}
/* ---------------------------- */
input,
.textarea {

View File

@ -7,7 +7,7 @@ main {
}
.form-container {
min-width: 400px;
max-width: 900px;
max-width: 600px;
border-radius: 0.3rem;
padding: 1.5rem;
@ -24,22 +24,20 @@ label {
}
.input-file {
display: none;
border: 1px solid #ccc;
display: inline-block;
padding: 6px 12px;
/* padding: 6px 12px; */
outline: none;
display: none;
}
.input-file-label {
outline: 2px solid grey;
height: 100px;
/* outline: 2px solid grey; */
/* height: 100px; */
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
border-radius: 0.5rem;
}