ui changes trying delete

This commit is contained in:
jostheta 2024-07-18 16:19:23 +05:30
parent 0ab5a64f42
commit 826d3016d2
10 changed files with 144 additions and 49 deletions

View File

@ -4,8 +4,8 @@
<div class="section">
<div class="form_container">
<div class="form_container_top">
<input type="text" id="form-title" class="form_container_top_title" style="color: black;" placeholder="Untitled Form">
<input type="text" id="form-desc" class="form_container_top_desc" style="color: black;" placeholder="Form Description">
<input type="text" id="form-title" class="form_container_top_title" style="color: black;" placeholder="Untitled Form" required autofocus>
<input type="text" id="form-desc" class="form_container_top_desc" style="color: black;" placeholder="Form Description" required autofocus>
</div>
<br>
@ -13,7 +13,7 @@
<div class="question-box" id="question-template" style="display:none;" data-question-type="multiple-choice">
<!-- This is the question-box header contains question, type, add an img -->
<div class="question-box_header">
<input type="text" id="" class="question-box_header_question" style="color: black;" placeholder="Question">
<input type="text" id="" class="question-box_header_question" style="color: black;" placeholder="Question" required autofocus>
<img src="<?= base_url() ?>assets/images/image.png" alt="add an image" height="20px" width="20px">
<div class="question-box_header_question-type">
<select id="question-type" class="question-box_header_question-type_select">

View File

@ -1,4 +1,4 @@
<div class="page_layout">
<div style="margin: 0 10%;">
<h1>Responses for: <?= htmlspecialchars($form->title, ENT_QUOTES, 'UTF-8') ?></h1>
<a href="<?php echo base_url('responses/index/' . $form->form_id); ?>">View responses Question wise</a>
@ -26,4 +26,4 @@
</tbody>
</table>
</div>
</div>

View File

@ -7,15 +7,21 @@
<th>Form Title</th>
<th>Published</th>
<th>Created At</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<?php if (!empty($forms)) : ?>
<?php foreach ($forms as $form) : ?>
<tr>
<td><a href="<?= base_url() ?>forms/preview/<?=$form->form_id?> "><?= htmlspecialchars($form->title, ENT_QUOTES, 'UTF-8') ?></a></td>
<td>
<a href="<?= base_url() ?>forms/preview/<?=$form->form_id?>">
<?= htmlspecialchars($form->title ? $form->title : $form->form_id, ENT_QUOTES, 'UTF-8') ?>
</a>
</td>
<td><?= ($form->is_published == 0)?'No':'Yes'?></td>
<td><?php echo date('Y-m-d H:i:s', strtotime($form->created_at)); ?></td>
<td><a href="<?= base_url() ?>forms/delete/<?= $form->form_id ?>" onclick="return confirm('Are you sure you want to delete this form?');">Delete</a></td>
</tr>
<?php endforeach; ?>
<?php else : ?>

View File

@ -1,21 +1,23 @@
<div class="page_layout">
<br>
<div class="section">
<div class="form-container">
<h1><?= htmlspecialchars($form->title, ENT_QUOTES, 'UTF-8') ?></h1>
<p><?= htmlspecialchars($form->description, ENT_QUOTES, 'UTF-8') ?></p>
<div class="form_container-response">
<div class="form_container_top">
<div class = "form_container_top_title"><?= htmlspecialchars($form->title, ENT_QUOTES, 'UTF-8') ?></div>
<div class = "form_container_top_desc"><?= htmlspecialchars($form->description, ENT_QUOTES, 'UTF-8') ?></div>
</div>
<div id="questions-container">
<?php if (!empty($questions)) : ?>
<?php foreach ($questions as $index => $question) : ?>
<div class="question-box" data-question-type="<?= htmlspecialchars($question->question_type, ENT_QUOTES, 'UTF-8') ?>" id="question-template" data-question_id="<?=htmlspecialchars($question->question_id, ENT_QUOTES, 'UTF-8')?>">
<div class="question-box_header">
<h3><?= htmlspecialchars($question->question_text, ENT_QUOTES, 'UTF-8') ?></h3>
<div class="response-questions" style="color:black;"><?= htmlspecialchars($question->question_text, ENT_QUOTES, 'UTF-8') ?></div>
</div>
<br>
<?php if ($question->question_type == 'paragraph') : ?>
<div class="question-box_short-answer">
<textarea placeholder="Paragraph"></textarea>
<textarea class="response-text-area" placeholder="Your Answer"></textarea>
</div>
<?php else : ?>
<div id="options-container">
@ -23,11 +25,11 @@
<?php foreach ($question->options as $optionIndex => $option) : ?>
<div class="question-box_option-block" id="option-template" data-option_id="<?=htmlspecialchars($option->option_id, ENT_QUOTES, 'UTF-8') ?>" >
<?php if ($question->question_type == 'multiple-choice') : ?>
<input type="radio" id="option-<?= $optionIndex ?>" name="question-<?= $index ?>">
<label for="option-<?= $optionIndex ?>"><?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?></label>
&nbsp;<input type="radio" id="option-<?= $optionIndex ?>" name="question-<?= $index ?>">
<label style="padding-top:12px;" for="option-<?= $optionIndex ?>"><?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?></label>
<?php elseif ($question->question_type == 'checkbox') : ?>
<input type="checkbox" id="option-<?= $optionIndex ?>" name="question-<?= $index ?>[]">
<label for="option-<?= $optionIndex ?>"><?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?></label>
&nbsp;<input type="checkbox" id="option-<?= $optionIndex ?>" name="question-<?= $index ?>[]">
<label style="padding-top:12px;" for="option-<?= $optionIndex ?>"><?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?></label>
<?php endif; ?>
</div>
<br>
@ -42,7 +44,7 @@
<p>No questions found for this form.</p>
<?php endif; ?>
</div>
<a href="<?= base_url() ?>forms/publish_form/<?=$form->form_id?> ">Publish</a>
<a class = "publish-button"href="<?= base_url() ?>forms/publish_form/<?=$form->form_id?> ">Publish</a>
</div>
</div>
</div>

View File

@ -1,10 +1,11 @@
<div class="page_layout">
<br>
<div class="section">
<div class="form-container">
<h1><?= htmlspecialchars($form->title, ENT_QUOTES, 'UTF-8') ?></h1>
<p><?= htmlspecialchars($form->description, ENT_QUOTES, 'UTF-8') ?></p>
<div class="form_container-response">
<div class="form_container_top">
<div class = "form_container_top_title"><?= htmlspecialchars($form->title, ENT_QUOTES, 'UTF-8') ?></div>
<div class = "form_container_top_desc"><?= htmlspecialchars($form->description, ENT_QUOTES, 'UTF-8') ?></div>
</div>
<form id="response-form" action="<?= base_url('forms/submit_response') ?>" method="post">
<input type="hidden" name="form_id" value="<?= $form->form_id ?>">
<div id="questions-container">
@ -12,12 +13,12 @@
<?php foreach ($questions as $index => $question) : ?>
<div class="question-box" data-question-type="<?= htmlspecialchars($question->question_type, ENT_QUOTES, 'UTF-8') ?>">
<div class="question-box_header">
<h3><?= htmlspecialchars($question->question_text, ENT_QUOTES, 'UTF-8') ?></h3>
<div class="response-questions" ><?= htmlspecialchars($question->question_text, ENT_QUOTES, 'UTF-8') ?></div>
</div>
<br>
<?php if ($question->question_type == 'paragraph') : ?>
<div class="question-box_short-answer">
<textarea name="responses[<?= $question->question_id ?>]" placeholder="Paragraph"></textarea>
<textarea class="response-text-area" style="color:black;font-style:normal;" name="responses[<?= $question->question_id ?>]" placeholder="Your Answer"></textarea>
</div>
<?php else : ?>
<div id="options-container">
@ -25,11 +26,11 @@
<?php foreach ($question->options as $optionIndex => $option) : ?>
<div class="question-box_option-block" id="option-template" data-option_id="<?= htmlspecialchars($option->option_id, ENT_QUOTES, 'UTF-8') ?>" >
<?php if ($question->question_type == 'multiple-choice') : ?>
<input type="radio" id="option-<?= $optionIndex ?>" name="responses[<?= $question->question_id ?>]" value="<?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?>">
<label for="option-<?= $optionIndex ?>"><?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?></label>
&nbsp;<input type="radio" id="option-<?= $optionIndex ?>" name="responses[<?= $question->question_id ?>]" value="<?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?>">
<label style="padding-top:12px;"for="option-<?= $optionIndex ?>"><?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?></label>
<?php elseif ($question->question_type == 'checkbox') : ?>
<input type="checkbox" id="option-<?= $optionIndex ?>" name="responses[<?= $question->question_id ?>][]" value="<?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?>">
<label for="option-<?= $optionIndex ?>"><?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?></label>
&nbsp;<input type="checkbox" id="option-<?= $optionIndex ?>" name="responses[<?= $question->question_id ?>][]" value="<?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?>">
<label style="padding-top:12px;" for="option-<?= $optionIndex ?>"><?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?></label>
<?php endif; ?>
</div>
<br>
@ -44,7 +45,7 @@
<p>No questions found for this form.</p>
<?php endif; ?>
</div>
<button class="response-submit" type="submit" style="color: #fff; background-color: #1a73e8; font-weight: 500; padding: 10px; border: none;">Submit</button>
<button class="response-submit" type="submit" >Submit</button>
</form>
</div>
</div>

View File

@ -15,7 +15,11 @@
<?php foreach ($forms as $form) : ?>
<?php if ($form->is_published == 1) : ?>
<tr>
<td><a href="<?= base_url() ?>forms/list_form_responses/<?=$form->form_id?>"><?= htmlspecialchars($form->title, ENT_QUOTES, 'UTF-8') ?></a></td>
<td>
<a href="<?= base_url() ?>forms/list_form_responses/<?=$form->form_id?>">
<?= htmlspecialchars($form->title ? $form->title : $form->form_id, ENT_QUOTES, 'UTF-8') ?>
</a>
</td>
<td><?= date('Y-m-d H:i:s', strtotime($form->created_at)) ?></td>
<td><a href="<?= $form->response_link ?>"><?= $form->response_link ?></a></td>
</tr>

View File

@ -2,8 +2,10 @@
<br>
<div class="section">
<div class="form-container">
<div class="form_container_top">
<input type="text" id="form-title" value="<?= htmlspecialchars($form->title, ENT_QUOTES, 'UTF-8') ?>" class="form_container_top_title" style="color: black;" placeholder="Untitled Form">
<input type="text" id="form-desc" value="<?= htmlspecialchars($form->description, ENT_QUOTES, 'UTF-8') ?>" class="form_container_top_desc" style="color: black;" placeholder="Form Description">
</div>
<div id="questions-container">
<?php if (!empty($questions)) : ?>

View File

@ -1,19 +1,23 @@
<div class="page_layout">
<br>
<div class="section">
<div class="form-container">
<h1><?= htmlspecialchars($form->title, ENT_QUOTES, 'UTF-8') ?></h1>
<p><?= htmlspecialchars($form->description, ENT_QUOTES, 'UTF-8') ?></p>
<h2>Response ID: <?= $response->response_id ?></h2>
<h3>Submitted At: <?= date('Y-m-d H:i:s', strtotime($response->created_at)) ?></h3>
<div class="form_container-response">
<div class="form_container_top">
<div class = "form_container_top_title" style="border-bottom:none;"><?= htmlspecialchars($form->title, ENT_QUOTES, 'UTF-8') ?></div>
<div class = "form_container_top_desc" style="border-bottom:none;"><?= htmlspecialchars($form->description, ENT_QUOTES, 'UTF-8') ?></div>
<div>
<br>
<div class = "form_container_top_user-details">Response ID: <?= $response->response_id ?></div>
<div class = "form_container_top_user-details">Submitted At: <?= date('Y-m-d H:i:s', strtotime($response->created_at)) ?></div>
</div>
</div>
<div id="questions-container">
<?php if (!empty($questions)) : ?>
<?php foreach ($questions as $index => $question) : ?>
<div class="question-box" data-question-type="<?= htmlspecialchars($question->question_type, ENT_QUOTES, 'UTF-8') ?>">
<div class="question-box_header">
<h3><?= htmlspecialchars($question->question_text, ENT_QUOTES, 'UTF-8') ?></h3>
<div class="response-questions" style="color:black;"><?= htmlspecialchars($question->question_text, ENT_QUOTES, 'UTF-8') ?></div>
</div>
<br>
<?php
@ -26,7 +30,7 @@
?>
<?php if ($question->question_type == 'paragraph') : ?>
<div class="question-box_short-answer">
<textarea name="responses[<?= $question->question_id ?>]" placeholder="Paragraph" readonly><?= implode("\n", $answer_texts) ?></textarea>
<textarea class="response-text-area" name="responses[<?= $question->question_id ?>]" placeholder="Paragraph" readonly><?= implode("\n", $answer_texts) ?></textarea>
</div>
<?php else : ?>
<div id="options-container">
@ -34,11 +38,11 @@
<?php foreach ($question->options as $optionIndex => $option) : ?>
<div class="question-box_option-block" id="option-template" data-option_id="<?= htmlspecialchars($option->option_id, ENT_QUOTES, 'UTF-8') ?>" >
<?php if ($question->question_type == 'multiple-choice') : ?>
<input type="radio" id="option-<?= $optionIndex ?>" name="responses[<?= $question->question_id ?>]" value="<?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?>" <?= (in_array(htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8'), $answer_texts)) ? 'checked' : '' ?> readonly>
<label for="option-<?= $optionIndex ?>"><?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?></label>
&nbsp;<input type="radio" id="option-<?= $optionIndex ?>" name="responses[<?= $question->question_id ?>]" value="<?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?>" <?= (in_array(htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8'), $answer_texts)) ? 'checked' : '' ?> readonly>
<label style="padding-top:12px;" for="option-<?= $optionIndex ?>"><?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?></label>
<?php elseif ($question->question_type == 'checkbox') : ?>
<input type="checkbox" id="option-<?= $optionIndex ?>" name="responses[<?= $question->question_id ?>][]" value="<?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?>" <?= (in_array(htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8'), $answer_texts)) ? 'checked' : '' ?> readonly>
<label for="option-<?= $optionIndex ?>"><?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?></label>
&nbsp;<input type="checkbox" id="option-<?= $optionIndex ?>" name="responses[<?= $question->question_id ?>][]" value="<?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?>" <?= (in_array(htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8'), $answer_texts)) ? 'checked' : '' ?> readonly>
<label style="padding-top:12px;" for="option-<?= $optionIndex ?>"><?= htmlspecialchars($option->option_text, ENT_QUOTES, 'UTF-8') ?></label>
<?php endif; ?>
</div>
<br>

View File

@ -7,8 +7,8 @@
<link rel="stylesheet" href="<?= base_url() ?>assets/css/bootstrap.min.css">
<link rel= "stylesheet" href = "<?= base_url() ?>assets/css/style.css">
</head>
<body style="background-color:#f0ebf8;">
<nav class = "navbar navbar-inverse" style="background-color:rgb(103, 58, 183);">
<body style="background-color:white;"><!--#f0ebf8-->
<nav class = "navbar navbar-inverse" style="background-color:rgb(103, 58, 183); margin-bottom:0px;">
<div class = "container">
<div id = "nav-header" class = "navbar-header">
<a class = "navbar-brand" href="<?= base_url(); ?>">Gforms</a>

View File

@ -27,12 +27,20 @@
width: 50%;
display: flex;
width: 52%;
align-items: center;
}
.form_container{
display:flex;
flex-direction: column;
width: 100%;
width: 800px;
}
.form_container-response{
display:flex;
flex-direction: column;
width: 640px;
}
@ -42,13 +50,14 @@
border-radius: 8px;
padding: 30px 25px;
text-transform: capitalize;
box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
}
.form_container_top_title{
box-sizing: border-box;
font-family: Arial, Helvetica, sans-serif;
font-family: 'Roboto', Helvetica, sans-serif;
font-size: 32px;
font-weight: 400;
font-weight: 350;
line-height: 135%;
width: 100%;
border: none;
@ -56,13 +65,15 @@
border-bottom: 1px solid #f4f4f9;
color: black;
height: 35px;
margin-bottom: 20px;
}
.form_container_top_desc{
box-sizing: border-box;
margin-top: 10px;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-family: 'Roboto', Helvetica, sans-serif;
font-size: 11pt;
font-weight: 400;
line-height: 100%;
width: 100%;
@ -80,6 +91,8 @@
margin-top: 10px;
margin-bottom: 10px;
font-family: 'Roboto';
box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 2px 0px;
}
@ -189,6 +202,9 @@
background-color: white;
border:none;
}
.question-box_short-answer{
display:flex;
}
.question-box_short-answer_placeholder {
border-bottom: 1px dotted #000;
@ -196,6 +212,7 @@
padding-bottom: 5px;
color: #999;
font-style: italic;
margin-left: 13px;
}
table {
@ -213,6 +230,65 @@ tr:nth-child(even) {
background-color: #f9f9f9;
}
.response-submit{
color: #fff;
background-color: #7349bd;
font-family:'Roboto';
font-weight: 500;
padding: 10px;
border: none;
width: 96px;
border-radius: 5px;
}
.publish-button{
color: #fff;
background-color: #7349bd;
font-family:'Roboto';
font-weight: 500;
padding: 10px;
border: none;
width: 96px;
border-radius: 5px;
text-align: center;
}
.form_container_top_user-details{
box-sizing: border-box;
margin-top: 10px;
font-family: 'Roboto', Helvetica, sans-serif;
font-size: 11pt;
font-weight: 400;
line-height: 100%;
width: 100%;
border: none;
outline: none;
color: gray;
height: 20px;
}
.response-text-area{
width:100%;
margin-left: 10px;
border:none;
outline:none;
}
.response-quesitons{
font-family: 'Roboto';
color:#000;
font-weight: 500;
font-size: 12pt;
line-height: 1.5;
letter-spacing: 0;
width: 424px;
height: 50px;
padding: 16px;
box-sizing: border-box;
border: none; /* Remove default border */
outline: none; /* Remove default focus outline */
}