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

New colours

Browse Source
This commit is contained in:
Marco van Dijk 2022-03-13 00:27:55 +01:00
parent e433d8fd9b
commit 488b8c47ab
9 changed files with 96 additions and 106 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@ -19,7 +19,6 @@
"react-retro-hit-counter": "^1.0.1",
"react-router-dom": "^6.0.2",
"react-scripts": "3.2.0",
"react-tooltip": "^4.2.21",
"redux": "^4.1.2",
"redux-thunk": "^2.4.1",
"styled-components": "^5.3.3"

42
src/actions/livepeer.js
View File

@ -1,16 +1,16 @@
import * as apiUtil from "../util/livepeer";
import { receiveErrors } from "./error";
const activationColour = "rgba(23, 60, 122, 0.3)";
const rewardColour = "rgba(20, 99, 29, 0.3)";
const updateColour = "rgba(122, 63, 23, 0.3)";
const withdrawStakeColour = "rgba(115, 110, 22, 0.3)";
const stakeColour = "rgba(56, 23, 122, 0.3)";
const unbondColour = "rgba(122, 23, 51, 0.3)";
const claimColour = "rgba(77, 91, 42, 0.3)";
const claimColour = "rgba(25, 158, 29, 0.3)";
const stakeColour = "rgba(25, 158, 147, 0.3)";
const ticketRedeemColour = "rgba(25, 98, 158, 0.3)";
const rewardColour = "rgba(25, 27, 158, 0.3)";
const unbondColour = "rgba(105, 25, 158, 0.3)";
const updateColour = "rgba(158, 25, 52, 0.3)";
const withdrawStakeColour = "rgba(158, 98, 25, 0.3)";
const activationColour = "rgba(154, 158, 25, 0.3)";
const ticketTransferColour = "rgba(88, 91, 42, 0.3)";
const ticketRedeemColour = "rgba(42, 44, 91, 0.3)";
const thresholdStaking = 0.001;
const thresholdFees = 0.00009;
@ -117,16 +117,16 @@ export const getEvents = () => async dispatch => {
eventFrom = "";
eventTo = "";
if (eventContainsBond) {
eventDescription = "activated with a self stake of " + tmpAmount.toFixed(2) + " LPT and will become active in round " + tmpWhen;
eventDescription = "🚀activated with a self stake of " + tmpAmount.toFixed(2) + " LPT and will become active in round " + tmpWhen;
} else {
eventDescription = "reactivated and will become active in round " + tmpWhen;
eventDescription = "🚀reactivated and will become active in round " + tmpWhen;
}
}
// Lone Unbond => Unbond Event
else if (eventContainsUnbond) {
eventType = "Unbond";
eventColour = unbondColour;
eventDescription = "unbonded " + tmpAmount.toFixed(2) + " LPT starting from round " + tmpWhen;
eventDescription = "❌unbonded " + tmpAmount.toFixed(2) + " LPT starting from round " + tmpWhen;
}
// Lone Bond => Stake Event
@ -138,18 +138,18 @@ export const getEvents = () => async dispatch => {
else if (eventContainsRebond) {
eventType = "Stake";
eventColour = stakeColour;
eventDescription = "is now staking " + tmpAmount.toFixed(2) + " LPT";
eventDescription = "⌛is now staking " + tmpAmount.toFixed(2) + " LPT";
}
// Fill description of Stake Event if it wasn't set yet
if (eventType === "Stake" && eventDescription === "") {
if (eventFrom === "0x0000000000000000000000000000000000000000") {
eventDescription = "staked " + tmpAmount.toFixed(2) + " LPT";
eventDescription = "⌛staked " + tmpAmount.toFixed(2) + " LPT";
} else if (eventFrom === eventTo) {
eventFrom = "";
eventDescription = "is now staking " + tmpAmount.toFixed(2) + " LPT";
eventDescription = "⌛is now staking " + tmpAmount.toFixed(2) + " LPT";
} else {
eventDescription = "moved a " + tmpAmount.toFixed(2) + " LPT stake";
eventDescription = "⌛moved a " + tmpAmount.toFixed(2) + " LPT stake";
}
}
// If we have an eventType at this point, we have a completed Event from the previous transaction
@ -199,7 +199,7 @@ export const getEvents = () => async dispatch => {
if (amount < thresholdFees) {
continue;
}
const txt = " withdrew a " + amount.toFixed(2) + " LPT stake in round " + eventObj.data.withdrawRound;
const txt = "🏦withdrew a " + amount.toFixed(2) + " LPT stake in round " + eventObj.data.withdrawRound;
finalEventList.push({
eventType: "Withdraw",
eventDescription: txt,
@ -218,7 +218,7 @@ export const getEvents = () => async dispatch => {
if (amount < thresholdFees) {
continue;
}
const txt = " withdrew " + amount.toFixed(2) + " LPT earned fees";
const txt = "🏦withdrew " + amount.toFixed(2) + " LPT earned fees";
finalEventList.push({
eventType: "Withdraw",
eventDescription: txt,
@ -238,7 +238,7 @@ export const getEvents = () => async dispatch => {
eventContainsTranscoderUpdate = true;
const amount1 = parseFloat(eventObj.data.rewardCut) / 10000;
const amount2 = 100 - (eventObj.data.feeShare / 10000);
const txt = "changed their reward commission to " + amount1.toFixed(2) + "% and their fee commission to " + amount2.toFixed(2) + "%";
const txt = "🔄changed their reward commission to " + amount1.toFixed(2) + "% and their fee commission to " + amount2.toFixed(2) + "%";
finalEventList.push({
eventType: "Update",
eventDescription: txt,
@ -261,7 +261,7 @@ export const getEvents = () => async dispatch => {
if (amount1 < thresholdStaking && amount2 < thresholdFees) {
continue;
}
let txt = "delegator claimed ";
let txt = "💰delegator claimed ";
if (amount1 > thresholdStaking) {
txt += amount1.toFixed(2) + " LPT staking rewards";
if (amount2 > thresholdFees) {
@ -290,7 +290,7 @@ export const getEvents = () => async dispatch => {
else if (eventObj.name === "Reward") {
eventContainsReward = true;
const amount1 = parseFloat(eventObj.data.amount) / 1000000000000000000;
let txt = "called reward worth " + amount1.toFixed(2) + " LPT";
let txt = "💸called reward worth " + amount1.toFixed(2) + " LPT";
if (Math.floor(amount1) == 69) {
txt += "... Nice!";
}
@ -389,7 +389,7 @@ export const getTickets = () => async dispatch => {
// Always split off WithdrawStake as a separate Withdraw Event
if (eventObj.name === "WinningTicketRedeemed") {
const amount = parseFloat(eventObj.data.faceValue) / 1000000000000000000;
const txt = " redeemed a winning ticket worth " + amount.toFixed(4) + " Eth";
const txt = "🎟️winning ticket worth " + amount.toFixed(4) + " Eth";
finalTicketList.push({
eventType: "RedeemTicket",
eventDescription: txt,

8
src/components/OrchAddressViewer.js
View File

@ -1,18 +1,14 @@
import React from "react";
import ReactTooltip from "react-tooltip";
const Address = (obj) => {
return (
<div className="rowAlignLeft" style={{ width: 'unset', margin: 0 }}>
<a className="selectOrchLight" target="_blank" rel="noopener noreferrer" href={"https://explorer.livepeer.org/accounts/" + obj.address} data-tip data-for={obj.seed} >
<a className="selectOrchLight" target="_blank" rel="noopener noreferrer" href={"https://explorer.livepeer.org/accounts/" + obj.address} >
<div className="rowAlignLeft" style={{ width: 'unset', margin: 0 }}>
<img alt="" src="livepeer.png" width="20" height="20" />
<span className="elipsText elipsOnMobile">{obj.address}</span>
<span className="elipsText elipsOnMobile" style={{ marginRight: "0.5em" }}>{obj.address}</span>
</div>
</a>
<ReactTooltip id={obj.seed} place="top" effect="solid">
{"https://explorer.livepeer.org/accounts/" + obj.address}
</ReactTooltip>
</div>
)
}

6
src/components/OrchDelegatorViewer.js
View File

@ -12,12 +12,12 @@ const OrchDelegatorViewer = (obj) => {
<h3 style={{ padding: 0, margin: 0 }}>{delegators.length} Current Delegators</h3>
</div>
<div className="content-wrapper">
<ScrollContainer className="overflow-container" hideScrollbars={false}>
<div className="overflow-content" style={{ cursor: 'grab', padding: 0, maxHeight: '300px' }}>
<ScrollContainer className="overflow-container" hideScrollbars={false} style={{ }}>
<div className="overflow-content" style={{ cursor: 'grab', padding: 0, maxHeight: '300px', margin: '0.5em' }}>
{
delegators.map((delObj, idx) => {
return (
<div className="flexContainer forceWrap" key={"delegator" + idx} style={{ margin: 0, textAlign: 'center',alignItems: 'center', justifyContent:'center' }}>
<div className="flexContainer forceWrap" key={"delegator" + idx} style={{ margin: 0, textAlign: 'center', alignItems: 'center', justifyContent: 'center' }}>
<Address address={delObj.id} seed={"delegator" + idx + delObj.id} />
<div className="rowAlignRight" style={{ margin: 0 }}>
<p className="darkText">{parseFloat(delObj.bondedAmount).toFixed(2)} LPT since round {delObj.startRound}</p>

6
src/components/OrchInfoViewer.js
View File

@ -1,6 +1,5 @@
import React from "react";
import Stat from "./statViewer";
import ReactTooltip from "react-tooltip";
import Address from "./OrchAddressViewer";
function updateClipboard(newClip) {
@ -88,14 +87,11 @@ const OrchInfoViewer = (obj) => {
<Stat header={"Stake"} title1={"Total"} content1={totalStake + " LPT"} title2={"Self"} content2={selfStake + " LPT (" + selfStakeRatio + ")%"} />
</div>
<div className="strokeSmollLeft" style={{ display: "flex" }}>
<button style={{ marginBottom: '1em' }} className="selectOrchLight" data-tip data-for="registerTip" onClick={() => {
<button style={{ marginBottom: '1em' }} className="selectOrchLight" onClick={() => {
copyLink(shareUrl);
}}>
<img alt="" src="clipboard.svg" width="20em" height="20em" />
</button>
<ReactTooltip id="registerTip" place="top" effect="solid">
Copy to clipboard
</ReactTooltip>
</div>
</div>
</div>

14
src/components/eventButton.js
View File

@ -24,14 +24,14 @@ const EventButton = (obj) => {
if (obj.eventObj.eventTo || obj.eventObj.eventFrom || obj.eventObj.eventCaller) {
if (obj.eventObj.eventTo) {
eventTo =
<div className="rowAlignLeft" style={{ width: '100%', margin: 0, marginLeft: '0.5em' }}>
<div className="rowAlignLeft" style={{ width: '100%', margin: 0 }}>
<a className="selectOrch" style={{ cursor: 'alias' }} rel="noopener noreferrer" target="_blank" href={"https://explorer.livepeer.org/accounts/" + obj.eventObj.eventTo}>
<img alt="" src="livepeer.png" width="20em" height="20em" style={{ margin: 0 }} />
</a>
<button className="selectOrch" style={{ margin: 0, padding: '0.5em', cursor: 'pointer' }} onClick={() => { obj.setSearchTerm(obj.eventObj.eventTo) }} >
<span className="elipsText">🔎</span>
</button>
<span>To&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</span>
<span>To&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:&nbsp;</span>
<button className="selectOrch" style={{ margin: 0, padding: '0.5em', cursor: 'help' }} onClick={() => { dispatch(getOrchestratorInfo(obj.eventObj.eventTo)) }} >
<span className="elipsText elipsOnMobileExtra">{obj.eventObj.eventTo}</span>
</button>
@ -39,14 +39,14 @@ const EventButton = (obj) => {
}
if (obj.eventObj.eventFrom) {
eventFrom =
<div className="rowAlignLeft" style={{ width: '100%', margin: 0, marginLeft: '0.5em' }}>
<div className="rowAlignLeft" style={{ width: '100%', margin: 0 }}>
<a className="selectOrch" style={{ cursor: 'alias' }} rel="noopener noreferrer" target="_blank" href={"https://explorer.livepeer.org/accounts/" + obj.eventObj.eventFrom}>
<img alt="" src="livepeer.png" width="20em" height="20em" style={{ margin: 0 }} />
</a>
<button className="selectOrch" style={{ margin: 0, padding: '0.5em', cursor: 'pointer' }} onClick={() => { obj.setSearchTerm(obj.eventObj.eventFrom) }} >
<span className="elipsText">🔎</span>
</button>
<span>From&nbsp;&nbsp;:</span>
<span>From&nbsp;&nbsp;:&nbsp;</span>
<button className="selectOrch" style={{ margin: 0, padding: '0.5em', cursor: 'help' }} onClick={() => { dispatch(getOrchestratorInfo(obj.eventObj.eventFrom)) }}>
<span className="elipsText elipsOnMobileExtra">{obj.eventObj.eventFrom}</span>
</button>
@ -54,14 +54,14 @@ const EventButton = (obj) => {
}
if (obj.eventObj.eventCaller) {
eventCaller =
<div className="rowAlignLeft" style={{ width: '100%', margin: 0, marginLeft: '0.5em' }}>
<div className="rowAlignLeft" style={{ width: '100%', margin: 0 }}>
<a className="selectOrch" style={{ cursor: 'alias' }} rel="noopener noreferrer" target="_blank" href={"https://explorer.livepeer.org/accounts/" + obj.eventObj.eventCaller}>
<img alt="" src="livepeer.png" width="20em" height="20em" style={{ margin: 0 }} />
</a>
<button className="selectOrch" style={{ margin: 0, padding: '0.5em', cursor: 'pointer' }} onClick={() => { obj.setSearchTerm(obj.eventObj.eventCaller) }} >
<span className="elipsText">🔎</span>
</button>
<span>Caller&nbsp;:</span>
<span>Caller&nbsp;:&nbsp;</span>
<button className="selectOrch" style={{ margin: 0, padding: '0.5em', cursor: 'help' }} onClick={() => { dispatch(getOrchestratorInfo(obj.eventObj.eventCaller)) }} >
<span className="elipsText elipsOnMobileExtra">{obj.eventObj.eventCaller}</span>
</button>
@ -86,7 +86,7 @@ const EventButton = (obj) => {
</div>
<div className="row">
<p className="row withWrap" style={{ maxWidth: '61.8%', textAlign: 'justify', padding: '0.5em', border: '0.1em solid rgba(54, 46, 46, 0.1)', boxShadow: "4px 2px 3px 2px rgba(54, 46, 46, 0.1)" }}>
💬 {obj.eventObj.eventDescription}
{obj.eventObj.eventDescription}
</p>
</div>
<div className="rowAlignLeft">

60
src/components/eventViewer.js
View File

@ -5,15 +5,15 @@ import Filter from './filterComponent';
import ReactPaginate from 'react-paginate';
/// A scrollable and filterable list of EventButtons
const activationColour = "rgba(23, 60, 122, 0.3)";
const rewardColour = "rgba(20, 99, 29, 0.3)";
const updateColour = "rgba(122, 63, 23, 0.3)";
const withdrawStakeColour = "rgba(115, 110, 22, 0.3)";
const stakeColour = "rgba(71, 23, 122, 0.3)";
const claimColour = "rgba(77, 91, 42, 0.3)";
const unbondColour = "rgba(122, 23, 51, 0.3)";
const ticketRedeemColour = "rgba(42, 44, 91, 0.3)";
const greyColour = "rgba(122, 128, 127, 0.3)";
const claimColour = "rgba(25, 158, 29, 0.4)";
const stakeColour = "rgba(25, 158, 147, 0.4)";
const ticketRedeemColour = "rgba(25, 98, 158, 0.4)";
const rewardColour = "rgba(25, 27, 158, 0.4)";
const unbondColour = "rgba(105, 25, 158, 0.4)";
const updateColour = "rgba(158, 25, 52, 0.4)";
const withdrawStakeColour = "rgba(158, 98, 25, 0.4)";
const activationColour = "rgba(154, 158, 25, 0.4)";
const greyColour = "rgba(122, 128, 127, 0.4)";
const defaultIncrementMaxShown = 100;
@ -244,16 +244,31 @@ const EventViewer = (obj) => {
</div>
</ScrollContainer>
<div className="strokeSmollLeft" style={{ marginRight: "1em" }}>
<button className={filterActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: filterActivatedColour, marginTop: '0.7em' }} onClick={() => {
setFilterActivated(!filterActivated);
<button className={delegatorRewardActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: delegatorActivatedColour, marginTop: '0.7em' }} onClick={() => {
setDelegatorRewardActivated(!delegatorRewardActivated);
}}>
<h3>Activated</h3>
<h3>Claim</h3>
</button>
<button className={stakeActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: stakeActivatedColour }} onClick={() => {
setStakeActivated(!stakeActivated);
}}>
<h3>Stake</h3>
</button>
<button className={ticketRedemptionActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: ticketActivatedColour }} onClick={() => {
setTicketRedemptionActivated(!ticketRedemptionActivated);
}}>
<h3>Tickets</h3>
</button>
<button className={rewardActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: rewardActivatedColour }} onClick={() => {
setRewardActivated(!rewardActivated);
}}>
<h3>Reward</h3>
</button>
<button className={unbondActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: unbondActivatedColour }} onClick={() => {
setUnbondActivated(!unbondActivated);
}}>
<h3>Unbond</h3>
</button>
<button className={updateActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: updateActivatedColour }} onClick={() => {
setUpdateActivated(!updateActivated);
}}>
@ -264,25 +279,10 @@ const EventViewer = (obj) => {
}}>
<h3>Withdraw</h3>
</button>
<button className={stakeActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: stakeActivatedColour }} onClick={() => {
setStakeActivated(!stakeActivated);
<button className={filterActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: filterActivatedColour }} onClick={() => {
setFilterActivated(!filterActivated);
}}>
<h3>Stake</h3>
</button>
<button className={delegatorRewardActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: delegatorActivatedColour }} onClick={() => {
setDelegatorRewardActivated(!delegatorRewardActivated);
}}>
<h3>Claim</h3>
</button>
<button className={unbondActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: unbondActivatedColour }} onClick={() => {
setUnbondActivated(!unbondActivated);
}}>
<h3>Unbond</h3>
</button>
<button className={ticketRedemptionActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: ticketActivatedColour }} onClick={() => {
setTicketRedemptionActivated(!ticketRedemptionActivated);
}}>
<h3>Tickets</h3>
<h3>Activated</h3>
</button>
</div>
</div>

6
src/pages/livepeer.js
View File

@ -76,16 +76,16 @@ const Livepeer = (obj) => {
}}>
<h1 style={{ margin: 0, padding: 0 }}>🏠</h1>
</button>
<h4 className="rowAlignLeft withWrap elipsOnMobile">{headerString}</h4>
<h4 className="rowAlignLeft withWrap showNeverOnMobile">{headerString}</h4>
</div>
<div className='rowAlignRight'>
<button className="homeButton" style={{ padding: 0, paddingRight: '1em', paddingLeft: '1em' }} onClick={() => {
<button className="homeButton" onClick={() => {
dispatch(clearOrchestrator());
setSearchTerm("");
setAmountFilter(0);
setMaxAmount(defaultMaxShown);
}}>
<h4>✖️ Clear</h4>
<h4 style={{margin: 0, padding: 0}}>✖️ Clear</h4>
</button>
<p>Sidebar</p>
<div className="toggle-container" onClick={() => setShowSidebar(!showSidebar)}>

59
src/style.css
View File

@ -42,9 +42,9 @@ code, pre{
}
h2, h3, h1, h4, h5, h6 {
text-shadow: 0.5px 0.5px 0.8px #948dff;
text-shadow: 0.5px 0.5px 0.8px #9493aa;
color: #1a1b26;
cursor: default;
cursor: inherit;
text-align: center;
justify-content: center;
align-items: center;
@ -61,7 +61,7 @@ h2, h3, h1, h4, h5, h6 {
}
p {
text-shadow: 0.5px 0.5px 0.8px #948dff;
text-shadow: 0.5px 0.5px 0.8px #9493aa;
color: #1a1b26;
font-size: 1.2em;
margin: 0.3em;
@ -75,19 +75,19 @@ p {
/* Track */
::-webkit-scrollbar-track {
background-color: rgba(146, 144, 196, 0.9);
background-color: rgba(61, 61, 66, 0.3);
border-radius: 10px;
}
/* Handle */
::-webkit-scrollbar-thumb {
background-color: rgba(51, 50, 78, 0.9);
background-color: rgba(44, 44, 46, 0.7);
border-radius: 10px;
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
background-color: rgba(25, 25, 59, 0.9);
background-color: rgba(35, 35, 39, 0.9);
}
#dvdlogo {
@ -145,7 +145,7 @@ svg {
height: 50px;
display: flex;
align-items: center;
background-color: rgba(180, 175, 252, 0.80);
background-color: rgba(214, 214, 214, 0.80);
}
#bodyContent {
height: calc( 100vh - 50px);
@ -155,9 +155,9 @@ svg {
overflow: hidden;
}
#sideContent {
background-color: rgba(180, 175, 252, 0.80);
background-color: rgba(214, 214, 214, 0.8);
backdrop-filter: blur(6px);
box-shadow: 9px 13px 8px 8px rgba(8, 7, 56, 0.692);
box-shadow: 9px 13px 8px 8px rgba(27, 23, 19, 0.692);
border-bottom-right-radius: 1em;
width: 400px;
overflow-y: auto;
@ -187,7 +187,7 @@ svg {
}
.lightText {
color: rgba(162, 161, 255, 0.5);
color: rgba(176, 175, 218, 0.7);
}
.darkText {
@ -205,7 +205,7 @@ svg {
user-select: text;
font-size: small;
color: rgba(15, 15, 15, 0.8750);
background-color: rgba(148, 154, 184, 0.8);
background-color: rgba(206, 206, 206, 0.8);
-webkit-box-shadow: inset 3px 3px 12px 2px rgba(28, 28, 170, 0.2);
-moz-box-shadow: inset 3px 3px 12px 2px rgba(28, 28, 170, 0.2);
box-shadow: inset 3px 3px 12px 2px rgba(28, 28, 170, 0.2);
@ -328,8 +328,8 @@ svg {
padding: 8px;
border: 0;
border-radius: 5px;
background-color: rgba(163, 161, 255, 0.9);
box-shadow: 4px 5px 3px 2px rgba(8, 7, 56, 0.692);
background-color: rgba(157, 157, 158, 0.9);
box-shadow: 4px 5px 3px 2px rgba(20, 20, 19, 0.692);
text-align: center;
justify-content: center;
align-items: center;
@ -339,7 +339,7 @@ svg {
backdrop-filter: blur(6px);
}
.waveButton:hover {
background-color: rgba(122, 121, 207, 0.9);
background-color: rgba(192, 195, 200, 0.8);
}
.waveButton:disabled {
cursor: default;
@ -360,11 +360,11 @@ svg {
z-index: 10;
}
.homeButton:hover {
box-shadow: 4px 5px 3px 2px rgba(8, 7, 56, 0.692);
box-shadow: 4px 5px 3px 2px rgba(20, 20, 19, 0.692);
backdrop-filter: blur(6px);
}
.homeButton:active {
box-shadow: inset -4px -5px 6px 4px rgba(8, 7, 56, 0.692);
box-shadow: inset -4px -5px 6px 4px rgba(20, 20, 19, 0.692);
}
.homeButton:disabled {
cursor: default;
@ -385,30 +385,29 @@ svg {
margin-bottom: 0.7em;
}
.nonHomeButton:hover {
box-shadow: 4px 5px 3px 2px rgba(8, 7, 56, 0.692);
box-shadow: 4px 5px 3px 2px rgba(20, 20, 19, 0.692);
backdrop-filter: blur(6px);
}
.nonHomeButton:active {
box-shadow: inset -4px -5px 6px 4px rgba(8, 7, 56, 0.692);
box-shadow: inset -4px -5px 6px 4px rgba(20, 20, 19, 0.692);
}
.active {
box-shadow: inset -4px -5px 6px 4px rgba(8, 7, 56, 0.692);
box-shadow: inset -4px -5px 6px 4px rgba(20, 20, 19, 0.692);
}
.searchField {
margin: auto;
display: flex;
background-color: rgba(44, 96, 238, 0.199);
background-color: rgba(107, 111, 122, 0.199);
padding: 5px;
border-radius: 20px;
color:rgba(8, 7, 56, 0.747);
color:rgba(20, 20, 19, 0.747);
}
.searchField::placeholder {
color:rgba(8, 7, 56, 0.445);
color:rgba(20, 20, 19, 0.445);
}
.searchField:focus {
outline: none !important;
border:2px solid rgba(49, 13, 134, 0.459);
box-shadow: 0px 0px 3px 2px rgba(53, 118, 138, 0.8);
box-shadow: 0px 0px 3px 2px rgba(99, 109, 112, 0.8);
}
.main-container {
@ -450,8 +449,8 @@ svg {
}
.roundedOpaque {
background-color: rgba(180, 175, 252, 0.80);
box-shadow: 9px 13px 18px 8px rgba(8, 7, 56, 0.692);
background-color: rgba(214, 214, 214, 0.80);
box-shadow: 9px 13px 18px 8px rgba(20, 20, 19, 0.692);
border-radius: 30px;
box-sizing: border-box;
backdrop-filter: blur(6px);
@ -479,7 +478,7 @@ svg {
}
.selectOrch, .selectOrch a{
text-shadow: 0.5px 0.5px 0.8px #948dff;
text-shadow: 0.5px 0.5px 0.8px #9493aa;
background-color: transparent;
border: none;
}
@ -492,7 +491,7 @@ svg {
}
.selectOrchLight, .selectOrchLight a{
text-shadow: 0.5px 0.5px 0.8px #948dff;
text-shadow: 0.5px 0.5px 0.8px #9493aa;
background-color: transparent;
border: none;
}
@ -501,7 +500,7 @@ svg {
backdrop-filter: blur(6px);
text-decoration: none;
cursor: pointer;
background-color: rgba(115, 114, 146, 0.9);
background-color: rgba(187, 187, 187, 0.9);
border-radius: 1em;
}
@ -541,7 +540,7 @@ svg {
}
.disabled {
background-color: #384e5c;
background-color: #495258;
left: 2px;
}