adm_tueit/TueIT_App
2
0
Fork 0
Code Issues 3 Pull Requests 3 Packages Projects Releases Wiki Activity

fixed small bugs and made comment fields bigger

Browse Source
This commit is contained in:
selina.mail
2024-04-02 14:53:14 +02:00
parent 423ff7e48b
commit aaa3bba79f
20 changed files with 502 additions and 412 deletions
Download Patch File Download Diff File Expand all files Collapse all files

115
components/server/TemplateChecklist.vue
View File

@ -17,7 +17,7 @@
<th :class="['Comments', darkMode ? 'th-darkmode' : 'th-lightmode']">Comments</th>
</tr>
<tr v-for="todo in potTodos" :key="todo.primaryID"
:class="['table-row', darkMode ? 'tr-darkmode' : 'tr-lightmode']" id="row-1">
:class="['table-row-data', darkMode ? 'tr-darkmode' : 'tr-lightmode']" id="row-1">
<td
:class="['Step', darkMode ? 'td-darkmode' : 'td-lightmode', darkMode ? 'Step-darkmode' : 'Step-lightmode']">
{{ todo.rowID }}
@ -42,22 +42,15 @@
<input type="text" v-model="todo.task" @change="updatePOTTodo(todo)"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</td>
<td v-if="!editable" :class="['Comments', darkMode ? 'td-darkmode' : 'td-lightmode']"> {{
todo.comments
}}</td>
<td v-if="editable" :class="['Comments', darkMode ? 'td-darkmode' : 'td-lightmode']"> <input type="text" v-model="todo.comments"
<td :class="['Comments', darkMode ? 'td-darkmode' : 'td-lightmode']">
<textarea type="text" v-model="todo.comments" :readonly="!editable"
@change="updatePOTTodo(todo)"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
<!-- <p><span id="spanElement"
:class="['data-span', 'textarea', 'input-span', darkMode ? 'data-darkmode' : 'data-lightmode']"
role="textbox" contenteditable></span></p> -->
<button :class="[darkMode ? 'deletePOTTodos-darkmode' : 'deletePOTTodos-lightmode']"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']"> </textarea>
<button v-if="editable" :class="[darkMode ? 'deletePOTTodos-darkmode' : 'deletePOTTodos-lightmode']"
@click="deletePOTTodo(todo.primaryID)">-</button>
</td>
</tr>
<tr v-if="editable && addRow" :class="['table-row', darkMode ? 'tr-darkmode' : 'tr-lightmode']"
<tr v-if="editable && addRow" :class="['table-row-data', darkMode ? 'tr-darkmode' : 'tr-lightmode']"
id="row-1">
<td
:class="['Step', darkMode ? 'td-darkmode' : 'td-lightmode', darkMode ? 'Step-darkmode' : 'Step-lightmode']">
@ -77,10 +70,10 @@
<input type="text" v-model="newTaskTodo"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</td>
<td :class="['Comments', darkMode ? 'td-darkmode' : 'td-lightmode']"><input type="text"
v-model="newCommentsTodo"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']"> <button
:class="[darkMode ? 'savePOTTodos-darkmode' : 'savePOTTodos-lightmode']"
<td :class="['Comments', darkMode ? 'td-darkmode' : 'td-lightmode']">
<textarea type="text" v-model="newCommentsTodo"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']"> </textarea>
<button :class="[darkMode ? 'savePOTTodos-darkmode' : 'savePOTTodos-lightmode']"
@click="addPOTTodo()">Save</button> <button
:class="[darkMode ? 'deleteLastPOTTodos-darkmode' : 'deleteLastPOTTodos-lightmode']"
@click="deleteNewRow()">-</button>
@ -111,7 +104,7 @@
<th :class="['Comments', darkMode ? 'th-darkmode' : 'th-lightmode']">Comments</th>
</tr>
<tr v-for="(newT, index) in newTodos" :key="index"
:class="['table-row', darkMode ? 'tr-darkmode' : 'tr-lightmode']" id="row-1">
:class="['table-row-data', darkMode ? 'tr-darkmode' : 'tr-lightmode']" id="row-1">
<td
:class="['Step', darkMode ? 'td-darkmode' : 'td-lightmode', darkMode ? 'Step-darkmode' : 'Step-lightmode']">
{{ newT.rowID }}
@ -130,10 +123,10 @@
<input type="text" v-model="newT.task"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</td>
<td :class="['Comments', darkMode ? 'td-darkmode' : 'td-lightmode']"> <input type="text"
<td :class="['Comments', darkMode ? 'td-darkmode' : 'td-lightmode']"> <textarea type="text"
v-model="newT.comments"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
<button :class="[darkMode ? 'deleteLastPOTTodos-darkmode' : 'deleteLastPOTTodos-lightmode']"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']"> </textarea>
<button :class="[darkMode ? 'deletePOTTodos-darkmode' : 'deletePOTTodos-lightmode']"
@click="deletePOTTodoFromNewTodos(index)">-</button>
</td>
</tr>
@ -573,6 +566,14 @@ export default {
gap: 0.625rem;
}
.table-row-data {
display: flex;
flex-direction: row;
align-items: center;
padding: 0.625rem;
gap: 0.625rem;
}
.tr-head-darkmode {
border-top: none;
border-bottom: 0.0625rem solid #000000;
@ -594,13 +595,16 @@ export default {
th,
td {
height: 1.875rem;
/* height: 1px; */
text-align: left;
padding: 0;
letter-spacing: 5%;
font: 400 0.875rem/1.875rem Overpass, sans-serif;
}
td {
height: 5rem;
}
th {
font: 700 0.875rem/1.875rem Overpass, sans-serif;
}
@ -702,9 +706,11 @@ th {
font: 400 0.875rem/1.875rem Overpass, sans-serif;
border: none;
border-radius: 0.625rem;
margin-left: 10rem;
margin-left: 1rem;
padding-left: 0.9rem;
padding-right: 0.9rem;
height: 2.1rem;
margin-top: 1.5rem;
}
.saveNewPOT-darkmode {
@ -724,9 +730,11 @@ th {
font: 400 0.875rem/1.875rem Overpass, sans-serif;
border: none;
border-radius: 0.625rem;
margin-left: 15.8rem;
margin-left: 6rem;
padding-left: 0.9rem;
padding-right: 0.9rem;
height: 2.1rem;
margin-top: 1.5rem;
}
.deleteLastPOTTodos-darkmode {
@ -735,9 +743,11 @@ th {
font: 400 0.875rem/1.875rem Overpass, sans-serif;
border: none;
border-radius: 0.625rem;
margin-left: 15.8rem;
margin-left: 1rem;
padding-left: 0.9rem;
padding-right: 0.9rem;
height: 2.1rem;
margin-top: 1.5rem;
}
@ -758,9 +768,11 @@ th {
font: 400 0.875rem/1.875rem Overpass, sans-serif;
border: none;
border-radius: 0.625rem;
margin-left: 10rem;
margin-left: 1rem;
padding-left: 0.9rem;
padding-right: 0.9rem;
height: 2.1rem;
margin-top: 1.5rem;
}
.deletePOTTodos-lightmode {
@ -769,9 +781,11 @@ th {
font: 400 0.875rem/1.875rem Overpass, sans-serif;
border: none;
border-radius: 0.625rem;
margin-left: 15.8rem;
margin-left: 6rem;
padding-left: 0.9rem;
padding-right: 0.9rem;
height: 2.1rem;
margin-top: 1.5rem;
}
.deleteLastPOTTodos-lightmode {
@ -780,9 +794,11 @@ th {
font: 400 0.875rem/1.875rem Overpass, sans-serif;
border: none;
border-radius: 0.625rem;
margin-left: 2rem;
margin-left: 1rem;
padding-left: 0.9rem;
padding-right: 0.9rem;
height: 2.1rem;
margin-top: 1.5rem;
}
.saveNewPOT-lightmode {
@ -824,44 +840,9 @@ th {
text-align: right;
}
/* .input-span {
border: none;
} */
/* .input,
.textarea {
border: 1px solid #ccc;
font-family: inherit;
font-size: inherit;
padding: 1px 6px;
} */
/* .input-wrap {
position: relative;
textarea {
resize: none;
width: 20rem;
height: 5rem;
}
.input-wrap .input {
position: absolute;
width: 100%;
left: 0;
}
.width-machine {
padding: 0 1rem;
}
.textarea {
display: block;
width: 100%;
overflow: hidden;
resize: both;
min-height: 40px;
line-height: 20px;
}
.textarea[contenteditable]:empty::before {
content: "Placeholder still possible";
color: gray;
} */
</style>