Skip to content

Commit 6a9c5fb

Browse files
Aniket-EnggAniket-Engg
authored
Merge pull request #6134 from ethereum/bootstrap_5
bootstrap 5 & react-bootstrap 2
2 parents 0dcee85 + e744469 commit 6a9c5fb

File tree

294 files changed

+21032
-103875
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

294 files changed

+21032
-103875
lines changed

‎apps/circuit-compiler/src/app/components/configurations.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ export function Configurations ({primeValue, setPrimeValue, versionValue}: Confi
66
return (
77
<div className="flex-column">
88
<div className="flex-column d-flex">
9-
<div className="ml-0">
9+
<div className="ms-0">
1010
<label className="circuit_inner_label form-check-label" htmlFor="circuitPrimeSelector">
1111
<FormattedMessage id="circuit.prime" />
1212
</label>
@@ -20,7 +20,7 @@ export function Configurations ({primeValue, setPrimeValue, versionValue}: Confi
2020
<select
2121
onChange={(e) => setPrimeValue(e.target.value as PrimeValue)}
2222
value={primeValue}
23-
className="custom-select"
23+
className="form-select"
2424
style={{
2525
pointerEvents: 'auto'
2626
}}

‎apps/circuit-compiler/src/app/components/container.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -124,7 +124,7 @@ export function Container () {
124124
tooltipClasses="text-nowrap"
125125
tooltipText='See compiler license'
126126
>
127-
<span className="far fa-file-certificate border-0 p-0 ml-2" onClick={() => showCompilerLicense()}></span>
127+
<span className="far fa-file-certificate border-0 p-0 ms-2" onClick={() => showCompilerLicense()}></span>
128128
</CustomTooltip>
129129
<VersionList setVersion={handleVersionSelect} versionList={circuitApp.appState.versionList} currentVersion={circuitApp.appState.version} downloadList={circuitApp.appState.versionDownloadList} />
130130
<CompileOptions setCircuitAutoCompile={handleCircuitAutoCompile} setCircuitHideWarnings={handleCircuitHideWarnings} autoCompile={circuitApp.appState.autoCompile} hideWarnings={circuitApp.appState.hideWarnings} />

‎apps/circuit-compiler/src/app/components/generateProof.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,16 +10,16 @@ export function GenerateProof () {
1010

1111
return (
1212
<div className="flex-column d-flex">
13-
<div className="mt-2 custom-control custom-checkbox">
13+
<div className="mt-2 form-check">
1414
<input
15-
className="custom-control-input"
15+
className="form-check-input"
1616
type="checkbox"
1717
title="Export Verifier Calldata"
1818
id="circuitExportVerifierCalldata"
1919
onChange={() => circuitApp.dispatch({ type: 'SET_EXPORT_VERIFIER_CALLDATA', payload: !circuitApp.appState.exportVerifierCalldata })}
2020
checked={circuitApp.appState.exportVerifierCalldata}
2121
/>
22-
<label className="form-check-label custom-control-label pt-1" htmlFor="circuitExportVerifierCalldata">
22+
<label className="form-check-label pt-1" htmlFor="circuitExportVerifierCalldata">
2323
<FormattedMessage id="circuit.exportVerifierCalldata" />
2424
</label>
2525
</div>
@@ -30,7 +30,7 @@ export function GenerateProof () {
3030
data-id="generateProofBtn"
3131
>
3232
<RenderIf condition={status === 'proving'}>
33-
<i className="fas fa-sync fa-spin mr-2" aria-hidden="true"></i>
33+
<i className="fas fa-sync fa-spin me-2" aria-hidden="true"></i>
3434
</RenderIf>
3535
<FormattedMessage id="circuit.generateProof" />
3636
</button>

‎apps/circuit-compiler/src/app/components/setupExports.tsx

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -11,42 +11,42 @@ export function SetupExports () {
1111
return (
1212
<div className="flex-column">
1313
<div className="flex-column d-flex">
14-
<div className="mb-1 ml-0">
14+
<div className="mb-1 ms-0">
1515
<label className="circuit_inner_label form-check-label">
1616
<FormattedMessage id="circuit.provingScheme" />
1717
</label>
18-
<div className="radio custom-control custom-radio mb-1 form-check">
18+
<div className="radio form-control custom-radio mb-1 form-check">
1919
<input
2020
type="radio"
21-
className="align-middle custom-control-input"
21+
className="align-middle form-check-input"
2222
name="circuitProvingScheme"
2323
id="groth16ProvingScheme"
2424
onClick={() => circuitApp.dispatch({ type: 'SET_PROVING_SCHEME', payload: 'groth16' })}
2525
value='groth16'
2626
checked={circuitApp.appState.provingScheme === 'groth16'}
2727
readOnly
2828
/>
29-
<label className="form-check-label custom-control-label" data-id="groth16ProvingScheme" htmlFor="groth16ProvingScheme" style={{ paddingTop: '0.125rem' }}>
29+
<label className="form-check-label" data-id="groth16ProvingScheme" htmlFor="groth16ProvingScheme" style={{ paddingTop: '0.125rem' }}>
3030
Groth16
3131
</label>
3232
</div>
33-
<div className="radio custom-control custom-radio form-check">
33+
<div className="radio form-control custom-radio form-check">
3434
<input
3535
type="radio"
36-
className="align-middle custom-control-input"
36+
className="align-middle form-check-input"
3737
name="circuitProvingScheme"
3838
id="plonkProvingScheme"
3939
onClick={() => circuitApp.dispatch({ type: 'SET_PROVING_SCHEME', payload: 'plonk' })}
4040
value='plonk'
4141
checked={circuitApp.appState.provingScheme === 'plonk'}
4242
readOnly
4343
/>
44-
<label className="form-check-label custom-control-label" data-id="plonkProvingScheme" htmlFor="plonkProvingScheme" style={{ paddingTop: '0.125rem' }}>
44+
<label className="form-check-label" data-id="plonkProvingScheme" htmlFor="plonkProvingScheme" style={{ paddingTop: '0.125rem' }}>
4545
Plonk
4646
</label>
4747
</div>
4848
</div>
49-
<div className="mb-1 ml-0">
49+
<div className="mb-1 ms-0">
5050
<label className="circuit_inner_label form-check-label">
5151
<FormattedMessage id="circuit.ptau" />
5252
</label>
@@ -59,7 +59,7 @@ export function SetupExports () {
5959
<div className="mb-1">
6060
<select
6161
value={circuitApp.appState.ptauValue}
62-
className="custom-select"
62+
className="form-select"
6363
style={{
6464
pointerEvents: 'auto'
6565
}}
@@ -76,29 +76,29 @@ export function SetupExports () {
7676
</select>
7777
</div>
7878
</CustomTooltip>
79-
<div className="mt-2 custom-control custom-checkbox">
79+
<div className="mt-2 form-check">
8080
<input
81-
className="custom-control-input"
81+
className="form-check-input"
8282
type="checkbox"
8383
title="Export Verifier Contract"
8484
id="circuitExportVerifierContract"
8585
onChange={() => circuitApp.dispatch({ type: 'SET_EXPORT_VERIFICATION_CONTRACT', payload: !circuitApp.appState.exportVerificationContract })}
8686
checked={circuitApp.appState.exportVerificationContract}
8787
/>
88-
<label className="form-check-label custom-control-label pt-1" htmlFor="circuitExportVerifierContract">
88+
<label className="form-check-label pt-1" htmlFor="circuitExportVerifierContract">
8989
<FormattedMessage id="circuit.exportVerifierContract" />
9090
</label>
9191
</div>
92-
<div className="mt-2 custom-control custom-checkbox">
92+
<div className="mt-2 form-check">
9393
<input
94-
className="custom-control-input"
94+
className="form-check-input"
9595
type="checkbox"
9696
title="Export Verification Key"
9797
id="circuitExportVerificationKey"
9898
onChange={() => circuitApp.dispatch({ type: 'SET_EXPORT_VERIFICATION_KEY', payload: !circuitApp.appState.exportVerificationKey })}
9999
checked={circuitApp.appState.exportVerificationKey}
100100
/>
101-
<label className="form-check-label custom-control-label pt-1" htmlFor="circuitExportVerificationKey">
101+
<label className="form-check-label pt-1" htmlFor="circuitExportVerificationKey">
102102
<FormattedMessage id="circuit.exportVerificationKey" />
103103
</label>
104104
</div>

‎apps/circuit-compiler/src/app/components/setupExportsBtn.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export function SetupExportsBtn ({ handleRunSetup, status }: { handleRunSetup: (
1212
placement="auto"
1313
tooltipId="overlay-tooltip-compile"
1414
tooltipText={
15-
<div className="text-left">
15+
<div className="text-start">
1616
<div>
1717
Click to setup and export verification keys
1818
</div>
@@ -21,7 +21,7 @@ export function SetupExportsBtn ({ handleRunSetup, status }: { handleRunSetup: (
2121
>
2222
<div className="d-flex align-items-center justify-content-center">
2323
<RenderIf condition={status === 'exporting'}>
24-
<i className="fas fa-sync fa-spin mr-2" aria-hidden="true"></i>
24+
<i className="fas fa-sync fa-spin me-2" aria-hidden="true"></i>
2525
</RenderIf>
2626
<div className="text-truncate overflow-hidden text-nowrap">
2727
<span>

‎apps/circuit-compiler/src/app/components/toggler.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,9 +26,9 @@ export function Toggler ({ children, title, dataId, show = false, icon, iconTool
2626
tooltipClasses="text-nowrap"
2727
tooltipText={iconTooltip}
2828
>
29-
<span className={`${icon} border-0 p-0 ml-2`} aria-hidden="true"></span>
29+
<span className={`${icon} border-0 p-0 ms-2`} aria-hidden="true"></span>
3030
</CustomTooltip>) :
31-
<span className={`${icon} border-0 p-0 ml-2`} aria-hidden="true"></span> : null }
31+
<span className={`${icon} border-0 p-0 ms-2`} aria-hidden="true"></span> : null }
3232
</label>
3333
</div>
3434
<div>

‎apps/circuit-compiler/src/app/components/versions.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,20 +13,20 @@ export function VersionList ({ currentVersion, versionList, downloadList, setVer
1313
</div>
1414
</Dropdown.Toggle>
1515

16-
<Dropdown.Menu as={CircomVersionMenu} className="w-100 custom-dropdown-items overflow-hidden">
16+
<Dropdown.Menu as={CircomVersionMenu} className="w-100 form-select overflow-hidden">
1717
{
1818
versionListKeys.reverse().map((version, index) => (
1919
<Dropdown.Item key={index} onClick={() => {
2020
setVersion(version)
2121
}}>
2222
<div className='d-flex w-100 justify-content-between'>
2323
<div>
24-
<span className={`fas fa-check text-success mr-2 ${currentVersion === version ? 'visible' : 'invisible'}`}></span>
24+
<span className={`fas fa-check text-success me-2 ${currentVersion === version ? 'visible' : 'invisible'}`}></span>
2525
<span>
2626
{ isElectron() ? versionList[version].name.replace('wasm', '') : versionList[version].name }
2727
</span>
2828
</div>
29-
{ isElectron() ? downloadList.includes(version) ? <div className='far fa-arrow-circle-down'></div> : <div className='fas fa-arrow-circle-down text-success ml-auto'></div> : null }
29+
{ isElectron() ? downloadList.includes(version) ? <div className='far fa-arrow-circle-down'></div> : <div className='fas fa-arrow-circle-down text-success ms-auto'></div> : null }
3030
</div>
3131
</Dropdown.Item>
3232
))

‎apps/circuit-compiler/src/app/components/witness.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -41,24 +41,24 @@ export function WitnessSection () {
4141
<>
4242
{
4343
signalInputs.map((input, index) => (
44-
<div className="mb-2 ml-0" key={index}>
44+
<div className="mb-2 ms-0" key={index}>
4545
<label className="circuit_inner_label form-check-label" htmlFor="circuitPrimeSelector">
4646
<FormattedMessage id="circuit.signalInput" /> { input }
4747
</label>
4848
<input className="form-control m-0 txinput" placeholder={input} name={input} onChange={handleSignalInput} data-id={`circuit_input_${input}`} />
4949
</div>
5050
))
5151
}
52-
<div className="custom-control custom-checkbox">
52+
<div className="form-check">
5353
<input
54-
className="custom-control-input"
54+
className="form-check-input"
5555
type="checkbox"
5656
title="Export Witness As JSON"
5757
id="circuitExportWtnsJson"
5858
onChange={() => { dispatch({ type: 'SET_EXPORT_WTNS_JSON', payload: !exportWtnsJson }) }}
5959
checked={exportWtnsJson}
6060
/>
61-
<label className="form-check-label custom-control-label pt-1" htmlFor="circuitExportWtnsJson">
61+
<label className="form-check-label pt-1" htmlFor="circuitExportWtnsJson">
6262
<FormattedMessage id="circuit.exportWtnsJson" />
6363
</label>
6464
</div>
@@ -69,7 +69,7 @@ export function WitnessSection () {
6969
data-id="compute_witness_btn"
7070
>
7171
<RenderIf condition={status === 'computing'}>
72-
<i className="fas fa-sync fa-spin mr-2" aria-hidden="true"></i>
72+
<i className="fas fa-sync fa-spin me-2" aria-hidden="true"></i>
7373
</RenderIf>
7474
<FormattedMessage id="circuit.compute" />
7575
</button>

‎apps/contract-verification/src/app/components/AccordionReceipt.tsx

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -51,34 +51,34 @@ export const AccordionReceipt: React.FC<AccordionReceiptProps> = ({ contract, in
5151

5252
<div className={`${expanded ? '' : 'd-none'} px-2 pt-2 pb-3 small`}>
5353
<div>
54-
<span className="font-weight-bold">Chain: </span>
54+
<span className="fw-bold">Chain: </span>
5555
{chainName} ({contract.chainId})
5656
</div>
5757
<div>
58-
<span className="font-weight-bold">File: </span>
58+
<span className="fw-bold">File: </span>
5959
<span className="text-break">{contract.filePath}</span>
6060
</div>
6161
<div>
62-
<span className="font-weight-bold">Submitted at: </span>
62+
<span className="fw-bold">Submitted at: </span>
6363
{new Date(contract.date).toLocaleString()}
6464
</div>
6565

6666
<div>
67-
<span className="font-weight-bold">Verified at: </span>
67+
<span className="fw-bold">Verified at: </span>
6868
<ReceiptsBody receipts={contract.receipts} />
6969
</div>
7070

7171
{hasProxy && (
7272
<>
7373
<div className="mt-3">
74-
<span className="font-weight-bold">Proxy Address: </span>
74+
<span className="fw-bold">Proxy Address: </span>
7575
<CustomTooltip placement="top" tooltipClasses=" text-break" tooltipText={contract.proxyAddress}>
7676
<span>{shortenAddress(contract.proxyAddress)}</span>
7777
</CustomTooltip>
7878
<CopyToClipboard tip="Copy" content={contract.proxyAddress} direction={'top'} />
7979
</div>
8080
<div>
81-
<span className="font-weight-bold">Proxy verified at: </span>
81+
<span className="fw-bold">Proxy verified at: </span>
8282
<ReceiptsBody receipts={contract.proxyReceipts} />
8383
</div>
8484
</>
@@ -102,7 +102,7 @@ const ReceiptsBody = ({ receipts }: { receipts: VerificationReceipt[] }) => {
102102
tooltipTextClasses="text-capitalize"
103103
tooltipText={`Status: ${receipt.status}${receipt.message ? `, Message: ${receipt.message}` : ''}`}
104104
>
105-
<span className="mr-2">
105+
<span className="me-2">
106106
{['verified', 'partially verified', 'already verified'].includes(receipt.status) ?
107107
<i className="fas fa-check text-success px-1"></i> :
108108
receipt.status === 'fully verified' ?
@@ -117,11 +117,11 @@ const ReceiptsBody = ({ receipts }: { receipts: VerificationReceipt[] }) => {
117117
</CustomTooltip>
118118
<div className="d-flex flex-row w-100 justify-content-between">
119119
<CustomTooltip placement="top" tooltipClasses=" text-break" tooltipText={`API: ${receipt.verifierInfo.apiUrl}`}>
120-
<span className="font-weight-bold pr-2">{receipt.verifierInfo.name}</span>
120+
<span className="fw-bold pe-2">{receipt.verifierInfo.name}</span>
121121
</CustomTooltip>
122-
<div className="ml-1">
122+
<div className="ms-1">
123123
{!!receipt.lookupUrl && receipt.verifierInfo.name === 'Blockscout' ?
124-
<CopyToClipboard classList="pr-0 py-0" tip="Copy code URL" content={receipt.lookupUrl} direction="top" /> :
124+
<CopyToClipboard classList="pe-0 py-0" tip="Copy code URL" content={receipt.lookupUrl} direction="top" /> :
125125
!!receipt.lookupUrl && <a href={receipt.lookupUrl} target="_blank" className="fa fas fa-arrow-up-right-from-square" rel="noreferrer"></a>
126126
}
127127
</div>

‎apps/contract-verification/src/app/components/ConfigInput.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ export const ConfigInput: React.FC<ConfigInputProps> = ({ label, id, secret, ini
4242
<div className="d-flex flex-row justify-content-start">
4343
<input
4444
type={secret ? 'password' : 'text'}
45-
className={`form-control small w-100 ${!enabled ? 'bg-transparent pl-0 border-0' : ''}`}
45+
className={`form-control small w-100 ${!enabled ? 'bg-transparent ps-0 border-0' : ''}`}
4646
id={id}
4747
placeholder={intl.formatMessage({ id: "contract-verification.configInputPlaceholderText" }, { label })}
4848
value={value}
@@ -52,10 +52,10 @@ export const ConfigInput: React.FC<ConfigInputProps> = ({ label, id, secret, ini
5252

5353
{ enabled ? (
5454
<>
55-
<button type="button" className="btn btn-primary btn-sm ml-2" onClick={handleSave}>
55+
<button type="button" className="btn btn-primary btn-sm ms-2" onClick={handleSave}>
5656
<FormattedMessage id="contract-verification.configInputSaveButton" />
5757
</button>
58-
<button type="button" className="btn btn-secondary btn-sm ml-2" onClick={handleCancel}>
58+
<button type="button" className="btn btn-secondary btn-sm ms-2" onClick={handleCancel}>
5959
<FormattedMessage id="contract-verification.configInputCancelButton" />
6060
</button>
6161
</>

0 commit comments

Comments
 (0)