This commit is contained in:
zadit
2025-01-18 07:42:39 +07:00
parent b111195491
commit 6b95656c4d
12 changed files with 548 additions and 44 deletions

View File

@@ -176,6 +176,480 @@ const SetPaymentQr = ({ shop }) => {
<div style={styles.container}>
<h3 style={styles.title}>QR kedai</h3>
<div style={{ height: 80, position: 'relative', scale: '80%' }}>
<div
style={{
width: '100%',
height: 38,
left: 0,
top: 42,
position: 'absolute',
zIndex: 1,
}}
>
<div
style={{
width: '100%',
height: 38,
left: 0,
top: 0,
position: 'absolute',
overflow: 'hidden'
}}
>
<div
style={{
width: '100%',
height: 38,
left: 0,
top: 0,
position: 'absolute',
background: '#35363A',
boxShadow: '0px -1px 0px #DADCE0 inset',
}}
/>
<div
style={{
width: 51,
height: 22,
left: 1375,
top: 8,
position: 'absolute',
}}
>
<div
style={{
width: 16,
height: 16,
left: 35,
top: 3,
position: 'absolute',
}}
>
<img
style={{
width: 3,
height: 12,
left: 6.67,
top: 2,
position: 'absolute',
}}
src='https://via.placeholder.com/3x12'
/>
</div>
<img
style={{
width: 22,
height: 22,
left: 0,
top: 0,
position: 'absolute',
borderRadius: 9999,
}}
src='https://via.placeholder.com/22x22'
/>
</div>
<div
style={{
width: '100%',
height: 28,
left: 134,
top: 5,
position: 'absolute',
}}
>
<div
style={{
width: '100%',
height: 28,
left: 0,
top: 0,
position: 'absolute',
background: '#202124',
borderRadius: 14,
}}
/>
<div
style={{
width: 16,
height: 16,
left: 1199,
top: 6,
position: 'absolute',
}}
>
<img
style={{
width: 12,
height: 11.47,
left: 2,
top: 2,
position: 'absolute',
}}
src='https://via.placeholder.com/12x11'
/>
</div>
<div
style={{
width: 165,
height: 16,
left: 33,
top: 6,
position: 'absolute',
}}
>
<div
style={{
left: 0,
top: 0,
position: 'absolute',
justifyContent: 'flex-start',
alignItems: 'center',
display: 'inline-flex',
}}
>
<div
style={{
color: 'white',
fontSize: 14,
fontFamily: 'Roboto',
fontWeight: '400',
letterSpacing: 0.25,
wordWrap: 'break-word',
}}
>
kedaimaster.com/
</div>
<div
style={{
color: '#86888A',
fontSize: 14,
fontFamily: 'Roboto',
fontWeight: '400',
letterSpacing: 0.25,
wordWrap: 'break-word',
}}
>
galauers
</div>
</div>
</div>
<div
style={{
width: 12,
height: 12,
left: 11,
top: 8,
position: 'absolute',
}}
>
<img
style={{
width: 8,
height: 10.5,
left: 2,
top: 0.5,
position: 'absolute',
}}
src='https://via.placeholder.com/8x10'
/>
</div>
</div>
<div
style={{
width: 109,
height: 16,
left: 12,
top: 11,
position: 'absolute',
}}
>
<div
style={{
width: 16,
height: 16,
left: 93,
top: 0,
position: 'absolute',
}}
>
<img
style={{
width: 12,
height: 12,
left: 2,
top: 2,
position: 'absolute',
}}
src='https://via.placeholder.com/12x12'
/>
</div>
<div
style={{
width: 16,
height: 16,
left: 62,
top: 0,
position: 'absolute',
}}
>
<div
style={{
width: 12,
height: 12,
left: 2,
top: 2,
position: 'absolute',
background: 'white',
}}
></div>
</div>
<div
style={{
width: 16,
height: 16,
left: 31,
top: 0,
position: 'absolute',
}}
>
<div
style={{
width: 12,
height: 11.69,
left: 2,
top: 2,
position: 'absolute',
background: '#86888A',
}}
></div>
</div>
<div
style={{
width: 16,
height: 16,
left: 0,
top: 0,
position: 'absolute',
}}
>
<div
style={{
width: 12,
height: 11.69,
left: 2,
top: 2,
position: 'absolute',
background: 'white',
}}
></div>
</div>
</div>
</div>
</div>
<div
style={{
width: '100%',
height: 42,
left: 0,
top: 0,
position: 'absolute',
}}
>
<div
style={{
width: '100%',
height: 42,
left: 0,
top: 0,
position: 'absolute',
}}
>
<div
style={{
width: '100%',
height: 42,
left: 0,
top: 0,
position: 'absolute',
background: '#202124',
boxShadow: '0px 4px 4px rgba(0, 0, 0, 0.25)',
borderTopLeftRadius: 8,
borderTopRightRadius: 8,
}}
/>
<div
style={{
width: 167,
height: 34,
left: 72,
top: 8,
position: 'absolute',
}}
>
<div
style={{
width: 131,
height: 34,
left: 8,
top: 0,
position: 'absolute',
}}
>
<div
style={{
left: -6,
top: 0,
position: 'absolute',
justifyContent: 'flex-start',
alignItems: 'center',
gap: 8,
display: 'inline-flex',
}}
>
<div
style={{
justifyContent: 'flex-start',
alignItems: 'flex-start',
display: 'flex',
}}
>
<div
style={{ width: 6, height: 8, background: '#35363A' }}
></div>
<div
style={{
padding: 8,
background: '#35363A',
borderTopLeftRadius: 8,
borderTopRightRadius: 8,
overflow: 'hidden',
justifyContent: 'flex-start',
alignItems: 'center',
gap: 9,
display: 'flex',
}}
>
<img
style={{ width: 16, height: 16 }}
src='https://via.placeholder.com/16x16'
/>
<div>
<span
style={{
color: 'white',
fontSize: 12,
fontFamily: 'Roboto',
fontWeight: '400',
letterSpacing: 0.2,
wordWrap: 'break-word',
}}
>
KedaiMaster
</span>
<span
style={{
color: '#35363A',
fontSize: 12,
fontFamily: 'Roboto',
fontWeight: '400',
letterSpacing: 0.2,
wordWrap: 'break-word',
}}
>
.
</span>
</div>
<div
style={{ width: 18, height: 18, position: 'relative' }}
>
<div
style={{
width: 7.5,
height: 7.5,
left: 5.25,
top: 5.25,
position: 'absolute',
background: 'white',
}}
></div>
</div>
</div>
<div
style={{
width: 6,
height: 8,
transform: 'rotate(180deg)',
transformOrigin: '0 0',
background: '#35363A',
}}
></div>
</div>
<div style={{ width: 20, height: 20, position: 'relative' }}>
<div
style={{
width: 13.33,
height: 13.33,
left: 3.33,
top: 3.33,
position: 'absolute',
background: '#BDC1C6',
}}
></div>
</div>
</div>
</div>
</div>
<div
style={{
width: 52,
height: 12,
left: 13,
top: 15.5,
position: 'absolute',
}}
>
<div
style={{
width: 12,
height: 12,
left: 40,
top: 0,
position: 'absolute',
background: '#27CA40',
borderRadius: 9999,
border: '0.50px #3EAF3F solid',
}}
/>
<div
style={{
width: 12,
height: 12,
left: 20,
top: 0,
position: 'absolute',
background: '#FFC130',
borderRadius: 9999,
border: '0.50px #E1A325 solid',
}}
/>
<div
style={{
width: 12,
height: 12,
left: 0,
top: 0,
position: 'absolute',
background: '#FF6058',
borderRadius: 9999,
border: '0.50px #E14942 solid',
}}
/>
</div>
</div>
</div>
</div>
<div
id="qr-code-container"
style={{