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

More hover effects

Browse Source
This commit is contained in:
Marco van Dijk 2022-03-05 18:10:56 +01:00
parent 5aadf97278
commit b116167f79
4 changed files with 31 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/OrchAddressViewer.js
View File

@ -4,10 +4,10 @@ import ReactTooltip from "react-tooltip";
const Address = (obj) => { const Address = (obj) => {
return ( return (
<div className="rowAlignLeft" style={{ width: 'unset' }}> <div className="rowAlignLeft" style={{ width: 'unset' }}>
<a href={"https://explorer.livepeer.org/accounts/" + obj.address} data-tip data-for={obj.seed} > <a className="selectOrchLight" href={"https://explorer.livepeer.org/accounts/" + obj.address} data-tip data-for={obj.seed} >
<div className="rowAlignLeft" style={{ width: 'unset' }}> <div className="rowAlignLeft" style={{ width: 'unset' }}>
<img alt="" src="livepeer.png" width="20" height="20" /> <img alt="" src="livepeer.png" width="20" height="20" />
{obj.address} <span className="elipsText">{obj.address}</span>
</div> </div>
</a> </a>
<ReactTooltip id={obj.seed} place="top" effect="solid"> <ReactTooltip id={obj.seed} place="top" effect="solid">

2
src/grafana.js
View File

@ -50,7 +50,7 @@ const Grafana = (obj) => {
<p>${lptPrice}</p> <p>${lptPrice}</p>
<p>({lptPriceChange24h}%)</p> <p>({lptPriceChange24h}%)</p>
</div> </div>
<div className="row"> <div className="row selectOrch">
<h2> <a href="https://explorer.livepeer.org/accounts/0x847791cbf03be716a7fe9dc8c9affe17bd49ae5e/">Livepeer Orchestrator</a></h2> <h2> <a href="https://explorer.livepeer.org/accounts/0x847791cbf03be716a7fe9dc8c9affe17bd49ae5e/">Livepeer Orchestrator</a></h2>
</div> </div>
<div className="row"> <div className="row">

2
src/orchestratorViewer.js
View File

@ -91,7 +91,7 @@ const Orchestrator = (obj) => {
<Stat header={"Stake"} title1={"Total"} content1={totalStake + " LPT"} title2={"Self"} content2={selfStake + " LPT (" + selfStakeRatio + ")%"} /> <Stat header={"Stake"} title1={"Total"} content1={totalStake + " LPT"} title2={"Self"} content2={selfStake + " LPT (" + selfStakeRatio + ")%"} />
</div> </div>
<div className="strokeSmollLeft" style={{ display: "flex" }}> <div className="strokeSmollLeft" style={{ display: "flex" }}>
<button style={{marginBottom:'1em'}} className="homeButton" data-tip data-for="registerTip" onClick={() => { <button style={{marginBottom:'1em'}} className="selectOrchLight" data-tip data-for="registerTip" onClick={() => {
copyLink(shareUrl); copyLink(shareUrl);
}}> }}>
<img alt="" src="clipboard.svg" width="20em" height="20em" /> <img alt="" src="clipboard.svg" width="20em" height="20em" />

40
src/style.css
View File

@ -50,19 +50,6 @@ h2, h3, h1, h4, h5, h6 {
width: 100%; width: 100%;
} }
.selectOrch{
text-shadow: 0.5px 0.5px 0.8px #948dff;
background-color: transparent;
border: none;
}
.selectOrch:hover{
text-decoration: none;
cursor: pointer;
backdrop-filter: blur(6px);
border-radius: 1em;
}
p { p {
text-shadow: 0.5px 0.5px 0.8px #948dff; text-shadow: 0.5px 0.5px 0.8px #948dff;
color: #1a1b26; color: #1a1b26;
@ -453,6 +440,33 @@ svg {
user-select: none; user-select: none;
} }
.selectOrch, .selectOrch a{
text-shadow: 0.5px 0.5px 0.8px #948dff;
background-color: transparent;
border: none;
}
.selectOrch:hover, .selectOrch a:hover{
backdrop-filter: blur(6px);
text-decoration: none;
cursor: pointer;
border-radius: 1em;
}
.selectOrchLight, .selectOrchLight a{
text-shadow: 0.5px 0.5px 0.8px #948dff;
background-color: transparent;
border: none;
}
.selectOrchLight:hover, .selectOrchLight a:hover{
backdrop-filter: blur(6px);
text-decoration: none;
cursor: pointer;
background-color: rgba(115, 114, 146, 0.9);
border-radius: 1em;
}
@media (max-aspect-ratio: 1/1) { @media (max-aspect-ratio: 1/1) {
.fullGrafana { .fullGrafana {
width: calc(100vw - 2em); width: calc(100vw - 2em);