better popup

This commit is contained in:
Dobromir Popov
2025-04-09 15:10:04 +03:00
parent 178cf9e6dc
commit 5bcb943761

View File

@ -197,13 +197,14 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
//check if the day is thursday
const dayOfWeek = common.getDayOfWeekNameEnEnumForDate(shift.date);
if (dayOfWeek == "Thursday") {
shift.notes = `<a href="#" onclick="document.getElementById('imageModal').style.display='block'; return false;" style="color: blue; text-decoration: underline; cursor: pointer;">Специален текст с линк към снимка</a>
<div id="imageModal" style="display: none; position: fixed; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.7);">
<div style="position: relative; margin: auto; padding: 20px; width: 90%; height: 90%; max-width: 90vw; max-height: 90vh; background-color: white; border-radius: 5px; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column;">
<span onclick="document.getElementById('imageModal').style.display='none'" style="position: absolute; right: 10px; top: 10px; color: #aaa; font-size: 28px; font-weight: bold; cursor: pointer;">&times;</span>
<div style="flex: 1; display: flex; justify-content: center; align-items: center; overflow: hidden;">
<img src="/images/cart_EN.jpg" style="max-width: 100%; max-height: 100%; object-fit: contain;" />
shift.notes = `<a href="#" onclick="document.getElementById('cart-image-modal').style.display='block'; return false;" class="text-blue-600 hover:underline">Специален текст с линк към снимка</a>
<div id="cart-image-modal" style="display: none;">
<div class="fixed inset-0 flex items-center justify-center z-50">
<div style="background-color: white; padding: 16px; border-radius: 8px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); position: relative; max-width: fit-content;">
<span onclick="document.getElementById('cart-image-modal').style.display='none'" style="position: absolute; right: 10px; top: 5px; cursor: pointer; font-size: 24px; color: #6b7280;">&times;</span>
<img src="/images/cart_EN.jpg" style="max-height: 80vh; object-fit: contain;" />
</div>
<div class="fixed inset-0 bg-black opacity-50" onclick="document.getElementById('cart-image-modal').style.display='none'"></div>
</div>
</div>`;
}