diff --git a/package.json b/package.json index 833756d..5c30e14 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "name": "groovebrew-mockup", "version": "0.1.0", "private": true, - "homepage": "https://dev.kedaimaster.com", + "homepage": "https://kedaimaster.com", "dependencies": { "@emotion/react": "^11.13.3", "@emotion/styled": "^11.13.0", diff --git a/src/components/ButtonWithReplica.css b/src/components/ButtonWithReplica.css index 4b5ca07..2008495 100644 --- a/src/components/ButtonWithReplica.css +++ b/src/components/ButtonWithReplica.css @@ -64,7 +64,7 @@ } .bussinessName.active { - top: -700%; + top: -1000%; position: absolute; color: rgb(0, 0, 0); width: 60vw; @@ -90,7 +90,7 @@ .bussinessQR.active { position: absolute; - top: -250%; + top: -321%; transform: translate(-50%, -80%); transition: all 0.5s ease-in-out; diff --git a/src/components/Header.js b/src/components/Header.js index d0a46bb..66d984a 100644 --- a/src/components/Header.js +++ b/src/components/Header.js @@ -378,7 +378,7 @@ const Header = ({ Desain kafe setModal("edit_tables")}> - QR kedai dan meja + QR kedai setModal("payment_option")}> Metode pembayaran diff --git a/src/components/TablesPage.js b/src/components/TablesPage.js index dbd9c2d..e3d4396 100644 --- a/src/components/TablesPage.js +++ b/src/components/TablesPage.js @@ -138,9 +138,15 @@ const SetPaymentQr = ({ shop }) => { function downloadQrCodeContainer({ selectedTable, shop }) { const node = document.getElementById('qr-code-container'); - + if (!node) return; + // Save the original background color + const originalBackgroundColor = node.style.backgroundColor; + + // Temporarily remove the background color + node.style.backgroundColor = 'transparent'; + const isTableSelected = selectedTable != null; toPng(node, { pixelRatio: 2 }) // Adjust pixel ratio for higher resolution @@ -158,27 +164,35 @@ const SetPaymentQr = ({ shop }) => { .catch((err) => { console.error('Could not download the image', err); }) + .finally(() => { + // Restore the original background color after the download + node.style.backgroundColor = originalBackgroundColor; + }); } + return (
-

QR kedai dan meja

+

QR kedai

+ QR Code QR Code {

Klik untuk ganti background

-

{setIsConfig(!isConfig); setIsConfigQR(false); setIsConfigFont(false)}}> {isConfig ? '˅' : '˃'} Konfigurasi

+

{setIsConfig(!isConfig); setIsConfigQR(!isConfigQR); setIsConfigFont(false)}}> {isConfig ? '˅' : '˃'} Konfigurasi QR

qrBackgroundInputRef.current.click()} style={styles.changeButton}>Ganti
{isConfig &&
-

{ setIsConfigQR(!isConfigQR); setIsConfigFont(false) }}> + {/*

{ setIsConfigQR(!isConfigQR); setIsConfigFont(false) }}> {isConfigQR ? '˅' : '˃'} Konfigurasi QR -

+

*/} {isConfigQR && <>
} -

{ setIsConfigFont(!isConfigFont); setIsConfigQR(false) }}> + {/*

{ setIsConfigFont(!isConfigFont); setIsConfigQR(false) }}> {isConfigFont ? '˅' : '˃'} Konfigurasi nomor -

+

*/} {isConfigFont && ( <>
@@ -371,9 +385,9 @@ const SetPaymentQr = ({ shop }) => {
} -

setIsViewTables(!isViewTables)}> + {/*

setIsViewTables(!isViewTables)}> {isViewTables ? '˅' : '˃'} Daftar meja -

+

*/} {isViewTables &&
@@ -421,7 +435,8 @@ const SetPaymentQr = ({ shop }) => { : <>
-

QR ini akan menjadi identifikasi bahwa pelanggan memesan dari {selectedTable? `(${selectedTable?.tableNo})` : 'link kafe ini. Untuk mengantarkan pelanggan ke meja yang teridentifikasi, anda perlu membuat meja.'}

+

Ini adalah QR yang dapat di scan oleh tamu untuk memesan

+ {/*

QR ini akan menjadi identifikasi bahwa pelanggan memesan dari {selectedTable? `(${selectedTable?.tableNo})` : 'link kafe ini. Untuk mengantarkan pelanggan ke meja yang teridentifikasi, anda perlu membuat meja.'}

*/}