diff options
Diffstat (limited to 'src/components/Card.js')
| -rw-r--r-- | src/components/Card.js | 38 |
1 files changed, 13 insertions, 25 deletions
diff --git a/src/components/Card.js b/src/components/Card.js index 9dfd098..b487b1e 100644 --- a/src/components/Card.js +++ b/src/components/Card.js | |||
| @@ -70,6 +70,15 @@ export const Card = ({ direction = 'ltr' }) => { | |||
| 70 | setQrvalue(`WIFI:T:${network.encryptionMode};S:${ssid};P:${password};;`); | 70 | setQrvalue(`WIFI:T:${network.encryptionMode};S:${ssid};P:${password};;`); |
| 71 | }, [network]); | 71 | }, [network]); |
| 72 | 72 | ||
| 73 | const setEncryptionMode = (e) => | ||
| 74 | setNetwork({ | ||
| 75 | ...network, | ||
| 76 | encryptionMode: e.target.value, | ||
| 77 | }); | ||
| 78 | |||
| 79 | const checkDirectionAndSetPadding = | ||
| 80 | direction === 'ltr' ? { paddingRight: '1em' } : { paddingLeft: '1em' }; | ||
| 81 | |||
| 73 | return ( | 82 | return ( |
| 74 | <div> | 83 | <div> |
| 75 | <fieldset | 84 | <fieldset |
| @@ -86,13 +95,7 @@ export const Card = ({ direction = 'ltr' }) => { | |||
| 86 | > | 95 | > |
| 87 | <QRCode | 96 | <QRCode |
| 88 | className="qrcode" | 97 | className="qrcode" |
| 89 | style={ | 98 | style={!portrait && checkDirectionAndSetPadding} |
| 90 | !portrait | ||
| 91 | ? direction === 'ltr' | ||
| 92 | ? { paddingRight: '1em' } | ||
| 93 | : { paddingLeft: '1em' } | ||
| 94 | : {} | ||
| 95 | } | ||
| 96 | value={qrvalue} | 99 | value={qrvalue} |
| 97 | size={175} | 100 | size={175} |
| 98 | renderAs="svg" | 101 | renderAs="svg" |
| @@ -175,12 +178,7 @@ export const Card = ({ direction = 'ltr' }) => { | |||
| 175 | name="encrypt-select" | 178 | name="encrypt-select" |
| 176 | id="encrypt-none" | 179 | id="encrypt-none" |
| 177 | value="nopass" | 180 | value="nopass" |
| 178 | onChange={(e) => { | 181 | onChange={setEncryptionMode} |
| 179 | setNetwork({ | ||
| 180 | ...network, | ||
| 181 | encryptionMode: e.target.value, | ||
| 182 | }); | ||
| 183 | }} | ||
| 184 | /> | 182 | /> |
| 185 | <label htmlFor="encrypt-none">None</label> | 183 | <label htmlFor="encrypt-none">None</label> |
| 186 | <input | 184 | <input |
| @@ -188,12 +186,7 @@ export const Card = ({ direction = 'ltr' }) => { | |||
| 188 | name="encrypt-select" | 186 | name="encrypt-select" |
| 189 | id="encrypt-wpa-wpa2-wpa3" | 187 | id="encrypt-wpa-wpa2-wpa3" |
| 190 | value="WPA" | 188 | value="WPA" |
| 191 | onChange={(e) => | 189 | onChange={setEncryptionMode} |
| 192 | setNetwork({ | ||
| 193 | ...network, | ||
| 194 | encryptionMode: e.target.value, | ||
| 195 | }) | ||
| 196 | } | ||
| 197 | defaultChecked | 190 | defaultChecked |
| 198 | /> | 191 | /> |
| 199 | <label htmlFor="encrypt-wpa-wpa2-wpa3">WPA/WPA2/WPA3</label> | 192 | <label htmlFor="encrypt-wpa-wpa2-wpa3">WPA/WPA2/WPA3</label> |
| @@ -202,12 +195,7 @@ export const Card = ({ direction = 'ltr' }) => { | |||
| 202 | name="encrypt-select" | 195 | name="encrypt-select" |
| 203 | id="encrypt-wep" | 196 | id="encrypt-wep" |
| 204 | value="WEP" | 197 | value="WEP" |
| 205 | onChange={(e) => | 198 | onChange={setEncryptionMode} |
| 206 | setNetwork({ | ||
| 207 | ...network, | ||
| 208 | encryptionMode: e.target.value, | ||
| 209 | }) | ||
| 210 | } | ||
| 211 | /> | 199 | /> |
| 212 | <label htmlFor="encrypt-wep">WEP</label> | 200 | <label htmlFor="encrypt-wep">WEP</label> |
| 213 | </span> | 201 | </span> |
