ok
This commit is contained in:
@@ -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={{
|
||||
|
||||
Reference in New Issue
Block a user