Skip to content

Commit

Permalink
refactor: margin y icon
Browse files Browse the repository at this point in the history
  • Loading branch information
@dewanakl
dewanakl committed Jan 12, 2025
1 parent b8d7ba2 commit 7174d49
Show file tree
Hide file tree
Showing 4 changed files with 22 additions and 15 deletions.
6 changes: 3 additions & 3 deletions dashboard.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -223,7 +223,7 @@ <h5 class="fw-bold mt-1 mb-0 ms-0 p-0" style="color: var(--bs-gray-900); font-si

<!-- Form -->
<div class="bg-theme-light p-3 mt-2 rounded-4 shadow">
<label for="form-comment" class="form-label fw-bold mb-1"><i class="fa-solid fa-comment me-2"></i>Comment</label>
<label for="form-comment" class="form-label fw-bold my-1"><i class="fa-solid fa-comment me-2"></i>Comment</label>
<textarea class="form-control shadow-sm mb-3 rounded-4" id="form-comment" name="form-comment" rows="3" minlength="1" maxlength="1000" placeholder="Type to comment" data-offline-disabled="false"></textarea>

<div class="d-flex justify-content-end mb-0">
Expand Down Expand Up @@ -349,11 +349,11 @@ <h5 class="fw-bold mt-1 mb-0 ms-0 p-0" style="color: var(--bs-gray-900); font-si
<div class="modal-body">
<form>
<div class="mb-3">
<label for="loginEmail" class="form-label mb-1"><i class="fa-solid fa-envelope me-2"></i>Email</label>
<label for="loginEmail" class="form-label my-1"><i class="fa-solid fa-envelope me-2"></i>Email</label>
<input type="email" class="form-control shadow-sm rounded-4" id="loginEmail" minlength="5" maxlength="254" placeholder="Masukkan email Anda" required autocomplete="email" data-offline-disabled="false">
</div>
<div class="mb-3">
<label for="loginPassword" class="form-label mb-1"><i class="fa-solid fa-lock me-2"></i>Password</label>
<label for="loginPassword" class="form-label my-1"><i class="fa-solid fa-lock me-2"></i>Password</label>
<input type="password" class="form-control shadow-sm rounded-4" id="loginPassword" minlength="8" maxlength="20" placeholder="Masukkan password Anda" required autocomplete="current-password" data-offline-disabled="false">
</div>
<div class="d-grid">
Expand Down
6 changes: 3 additions & 3 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -420,12 +420,12 @@ <h2 class="font-esthetic pt-2 mb-4" style="font-size: 2.5rem;">Love Gift</h2>
<h2 class="font-esthetic text-center mt-2 mb-4" style="font-size: 2.5rem;">Ucapan &amp; Doa</h2>

<div class="mb-3">
<label for="form-name" class="form-label mb-1"><i class="fa-solid fa-person me-2"></i>Nama</label>
<label for="form-name" class="form-label my-1"><i class="fa-solid fa-person me-2"></i>Nama</label>
<input type="text" class="form-control shadow-sm rounded-4" id="form-name" minlength="2" maxlength="50" placeholder="Isikan Nama Anda" autocomplete="name" data-offline-disabled="false">
</div>

<div class="mb-3">
<label for="form-presence" class="form-label mb-1"><i class="fa-solid fa-person-circle-question me-2"></i>Presensi</label>
<label for="form-presence" class="form-label my-1"><i class="fa-solid fa-person-circle-question me-2"></i>Presensi</label>
<select class="form-select shadow-sm rounded-4" id="form-presence" autocomplete="off" data-offline-disabled="false">
<option value="0" selected>Konfirmasi Presensi</option>
<option value="1">Datang</option>
Expand All @@ -443,7 +443,7 @@ <h2 class="font-esthetic text-center mt-2 mb-4" style="font-size: 2.5rem;">Ucapa
<p class="m-0">Sama bisa format text seperti Whatsapp lohh... cobainn jugaaa, makaciwww bestieee</p>
</div>

<label for="form-comment" class="form-label mb-1"><i class="fa-solid fa-comment me-2"></i>Ucapan &amp; Doa</label>
<label for="form-comment" class="form-label my-1"><i class="fa-solid fa-comment me-2"></i>Ucapan &amp; Doa</label>
<textarea class="form-control shadow-sm rounded-4" id="form-comment" rows="4" minlength="1" maxlength="1000" placeholder="Tulis Ucapan dan Doa" autocomplete="off" data-offline-disabled="false"></textarea>
</div>

Expand Down
8 changes: 4 additions & 4 deletions js/app/component/card.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -164,8 +164,8 @@ export const card = (() => {
inner.classList.add('my-2');
inner.id = `inner-${id}`;
inner.innerHTML = `
<label for="form-inner-${id}" class="form-label" style="font-size: 0.95rem;"><i class="fa-solid fa-reply me-1"></i>Reply</label>
<textarea class="form-control shadow-sm rounded-4 mb-2" id="form-inner-${id}" placeholder="Type reply comment" rows="3" data-offline-disabled="false"></textarea>
<label for="form-inner-${id}" class="form-label my-1" style="font-size: 0.95rem;"><i class="fa-solid fa-reply me-2"></i>Reply</label>
<textarea class="form-control shadow-sm rounded-4 mb-2" id="form-inner-${id}" minlength="1" maxlength="1000" placeholder="Type reply comment" rows="3" data-offline-disabled="false"></textarea>
<div class="d-flex flex-wrap justify-content-end align-items-center mb-0">
<button style="font-size: 0.8rem;" onclick="undangan.comment.cancel('${id}')" class="btn btn-sm btn-outline-${theme.isDarkMode('light', 'dark')} rounded-4 py-0 me-1" data-offline-disabled="false">Cancel</button>
<button style="font-size: 0.8rem;" onclick="undangan.comment.send(this)" data-uuid="${id}" class="btn btn-sm btn-outline-${theme.isDarkMode('light', 'dark')} rounded-4 py-0" data-offline-disabled="false">Send</button>
Expand All @@ -179,13 +179,13 @@ export const card = (() => {
inner.classList.add('my-2');
inner.id = `inner-${id}`;
inner.innerHTML = `
<label for="form-inner-${id}" class="form-label" style="font-size: 0.95rem;"><i class="fa-solid fa-pen me-1"></i>Edit</label>
<label for="form-inner-${id}" class="form-label my-1" style="font-size: 0.95rem;"><i class="fa-solid fa-pen me-2"></i>Edit</label>
${document.getElementById(id).getAttribute('data-parent') === 'true' && !session.isAdmin() ? `
<select class="form-select shadow-sm mb-2 rounded-4" id="form-inner-presence-${id}" data-offline-disabled="false">
<option value="1" ${presence ? 'selected' : ''}>Datang</option>
<option value="2" ${presence ? '' : 'selected'}>Berhalangan</option>
</select>` : ''}
<textarea class="form-control shadow-sm rounded-4 mb-2" id="form-inner-${id}" placeholder="Type update comment" rows="3" data-offline-disabled="false"></textarea>
<textarea class="form-control shadow-sm rounded-4 mb-2" id="form-inner-${id}" minlength="1" maxlength="1000" placeholder="Type update comment" rows="3" data-offline-disabled="false"></textarea>
<div class="d-flex flex-wrap justify-content-end align-items-center mb-0">
<button style="font-size: 0.8rem;" onclick="undangan.comment.cancel('${id}')" class="btn btn-sm btn-outline-${theme.isDarkMode('light', 'dark')} rounded-4 py-0 me-1" data-offline-disabled="false">Cancel</button>
<button style="font-size: 0.8rem;" onclick="undangan.comment.update(this)" data-uuid="${id}" class="btn btn-sm btn-outline-${theme.isDarkMode('light', 'dark')} rounded-4 py-0" data-offline-disabled="false">Update</button>
Expand Down
17 changes: 12 additions & 5 deletions js/app/component/like.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,11 +16,13 @@ export const like = (() => {
* @returns {Promise<void>}
*/
const like = async (button) => {
const id = button.getAttribute('data-uuid');

const info = button.firstElementChild;
const heart = button.lastElementChild;

const id = button.getAttribute('data-uuid');
const count = parseInt(info.getAttribute('data-count-like'));

button.disabled = true;

if (likes.has(id)) {
Expand All @@ -34,7 +36,7 @@ export const like = (() => {
heart.classList.remove('fa-solid', 'text-danger');
heart.classList.add('fa-regular');

info.setAttribute('data-count-like', (parseInt(info.getAttribute('data-count-like')) - 1).toString());
info.setAttribute('data-count-like', String(count - 1));
}
});
} else {
Expand All @@ -48,7 +50,7 @@ export const like = (() => {
heart.classList.remove('fa-regular');
heart.classList.add('fa-solid', 'text-danger');

info.setAttribute('data-count-like', (parseInt(info.getAttribute('data-count-like')) + 1).toString());
info.setAttribute('data-count-like', String(count + 1));
}
});
}
Expand All @@ -70,7 +72,10 @@ export const like = (() => {
const tapLength = currentTime - parseInt(div.getAttribute('data-tapTime'));
const uuid = div.id.replace('body-content-', '');

if (tapLength < 300 && tapLength > 0 && !likes.has(uuid) && div.getAttribute('data-liked') !== 'true') {
const isTapTap = tapLength < 300 && tapLength > 0;
const notLiked = !likes.has(uuid) && div.getAttribute('data-liked') !== 'true';

if (isTapTap && notLiked) {
if (navigator.vibrate) {
navigator.vibrate(100);
}
Expand All @@ -79,8 +84,10 @@ export const like = (() => {
tapTapAnimation(div);
}

const likeButton = document.querySelector(`[onclick="undangan.comment.like.like(this)"][data-uuid="${uuid}"]`);

div.setAttribute('data-liked', 'true');
await like(document.querySelector(`[onclick="undangan.comment.like.like(this)"][data-uuid="${uuid}"]`));
await like(likeButton);
div.setAttribute('data-liked', 'false');
}

Expand Down

0 comments on commit 7174d49

Please sign in to comment.