stronk/LivepeerEvents
1
0
Fork 0
mirror of https://github.com/stronk-dev/LivepeerEvents.git synced 2025-07-05 10:45:10 +02:00
Code Issues Packages Projects Releases Wiki Activity

Sidebar scaling fix

Browse Source
This commit is contained in:
Marco van Dijk 2022-03-08 17:21:33 +01:00
parent fcdc274014
commit 02173f15f0
2 changed files with 26 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
src/livepeer.js
View File

@ -136,26 +136,29 @@ const Livepeer = (obj) => {
}
let sidebar;
if (showSidebar){
if (showSidebar) {
sidebar = <div id='sideContent'>
<div className="strokeSmollLeft" style={{ margin: 0, padding: 0, width: '100%', marginTop: '1em' }}>
<div className="row" style={{ alignItems: 'stretch', height: '100%', padding: '0.2em', width: "unset" }}>
<Orchestrator thisOrchestrator={thisOrchObj} rootOnly={false} forceVertical={true} />
</div>
<div className="stroke metaSidebar" style={{ padding: 0, maxWidth: "300px" }}>
<div className="row" style={{ margin: 0, padding: 0 }}>
<h3 style={{ margin: 0, padding: 0 }}>Smart contract prices</h3>
<div className="strokeSmollLeft" style={{ margin: 0, padding: 0, width: '100%', marginTop: '1em' }}>
<div className="row" style={{ alignItems: 'stretch', height: '100%', padding: '0.2em', width: "unset" }}>
<Orchestrator thisOrchestrator={thisOrchObj} rootOnly={false} forceVertical={true} />
</div>
<div className="stroke" style={{ margin: 0, padding: 0 }}>
<Stat header={"Reward Call"} content1={"$" + redeemRewardCostL2USD + " (vs " + redeemRewardCostL1USD + " on L1)"} />
<Stat header={"Claim Ticket"} content1={"$" + claimTicketCostL2USD + " (vs " + claimTicketCostL1USD + " on L1)"} />
<Stat header={"Staking Fees"} content1={"$" + stakeFeeCostL2USD + " (vs " + stakeFeeCostL1USD + " on L1)"} />
<Stat header={"Change Commission"} content1={"$" + commissionFeeCostL2USD + " (vs " + commissionFeeCostL1USD + " on L1)"} />
<Stat header={"Change URI"} content1={"$" + serviceUriFeeCostL2USD + " (vs " + serviceUriFeeCostL1USD + " on L1)"} />
<div className="stroke metaSidebar" style={{ padding: 0, maxWidth: "300px" }}>
<div className="row" style={{ margin: 0, padding: 0 }}>
<h3 style={{ margin: 0, padding: 0 }}>Smart contract prices</h3>
</div>
<div className="stroke" style={{ margin: 0, padding: 0 }}>
<div className='rowAlignRight'>
<Stat header={"Reward Call"} content1={"$" + redeemRewardCostL2USD + " (vs " + redeemRewardCostL1USD + " on L1)"} />
<Stat header={"Claim Ticket"} content1={"$" + claimTicketCostL2USD + " (vs " + claimTicketCostL1USD + " on L1)"} />
</div>
<div className='rowAlignRight'>
<Stat header={"Staking Fees"} content1={"$" + stakeFeeCostL2USD + " (vs " + stakeFeeCostL1USD + " on L1)"} />
<Stat header={"Set Config"} content1={"$" + commissionFeeCostL2USD + " (vs " + commissionFeeCostL1USD + " on L1)"} />
</div>
</div>
</div>
</div>
</div>
</div >
</div >
}
return (
@ -165,23 +168,23 @@ const Livepeer = (obj) => {
<button className="homeButton" onClick={() => {
setRedirectToHome(true);
}}>
<h1 style={{margin: 0, padding: 0}}>🏠</h1>
<h1 style={{ margin: 0, padding: 0 }}>🏠</h1>
</button>
<h4>{headerString}</h4>
</div>
<div className='rowAlignRight'>
<button className="homeButton" style={{padding: 0, paddingRight: '1em', paddingLeft: '1em'}} onClick={() => {
<button className="homeButton" style={{ padding: 0, paddingRight: '1em', paddingLeft: '1em' }} onClick={() => {
dispatch(clearOrchestrator());
setSearchTerm("");
}}>
<h4>✖️ Clear</h4>
</button>
<button className="homeButton" style={{padding: 0, paddingRight: '1em', paddingLeft: '1em'}} onClick={() => {
<button className="homeButton" style={{ padding: 0, paddingRight: '1em', paddingLeft: '1em' }} onClick={() => {
setShowSidebar(!showSidebar);
}}>
<h4>🔎 Sidebar</h4>
</button>
<button className="homeButton" style={{padding: 0, paddingRight: '1em', paddingLeft: '1em'}} onClick={() => {
<button className="homeButton" style={{ padding: 0, paddingRight: '1em', paddingLeft: '1em' }} onClick={() => {
setShowFilter(!showFilter);
}}>
<h4>🛠️ Filter</h4>

2
src/style.css
View File

@ -160,6 +160,8 @@ svg {
box-shadow: 9px 13px 8px 8px rgba(8, 7, 56, 0.692);
border-bottom-right-radius: 1em;
width: 400px;
overflow-y: auto;
overflow-x: hidden;
}
.mainContent {
overflow: hidden;