mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
a858b85899
* feature: adding support for truffle and etherscan accreditation * Fix scss linting * fix styling and classnames * Switch font size to rem * Update ui/components/app/transaction-decoding/components/ui/accreditation/accreditation.component.js Co-authored-by: George Marshall <georgewrmarshall@gmail.com> * Update ui/components/app/transaction-decoding/components/ui/accreditation/index.scss Co-authored-by: George Marshall <georgewrmarshall@gmail.com> * Update ui/components/app/transaction-decoding/components/ui/accreditation/accreditation.component.js Co-authored-by: George Marshall <georgewrmarshall@gmail.com> * Update ui/components/app/transaction-decoding/components/ui/accreditation/accreditation.component.js Co-authored-by: George Marshall <georgewrmarshall@gmail.com> * Fix linting Co-authored-by: g. nicholas d'andrea <gnidan@trufflesuite.com> Co-authored-by: Dan J Miller <danjm.com@gmail.com> Co-authored-by: George Marshall <georgewrmarshall@gmail.com> Co-authored-by: g. nicholas d'andrea <gnidan@users.noreply.github.com>
173 lines
3.2 KiB
SCSS
173 lines
3.2 KiB
SCSS
//styling for ui components
|
|
@import './components/ui/copy-raw-data/index';
|
|
@import './components/ui/accreditation/index';
|
|
|
|
//styling for decoding components
|
|
@import './components/decoding/address/index';
|
|
|
|
.tx-insight {
|
|
overflow-x: hidden;
|
|
|
|
&-loading {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
min-height: 100px;
|
|
|
|
.spinner {
|
|
width: 30px;
|
|
}
|
|
}
|
|
|
|
& > details {
|
|
margin: 20px 0;
|
|
}
|
|
|
|
& > details > summary {
|
|
&.tx-insight-title {
|
|
font-size: 14px;
|
|
position: relative;
|
|
margin: 12px 0 4px;
|
|
padding-inline-start: 22px;
|
|
cursor: pointer;
|
|
|
|
& + .tx-insight-content {
|
|
padding-inline-start: 14px;
|
|
padding-top: 5px;
|
|
}
|
|
}
|
|
}
|
|
|
|
&-error {
|
|
cursor: auto;
|
|
}
|
|
|
|
.tx-insight-content {
|
|
&__tree-component {
|
|
line-height: 175%;
|
|
|
|
& > ol {
|
|
padding-left: 0;
|
|
}
|
|
|
|
.eth-tx-params {
|
|
padding: 8px;
|
|
width: 343px;
|
|
background: white;
|
|
text-align: left;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: left;
|
|
font-family: Euclid Circular B, sans-serif;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-size: 14px;
|
|
line-height: 172%;
|
|
}
|
|
|
|
ol ol {
|
|
padding-left: 22px;
|
|
margin-left: 4px;
|
|
}
|
|
|
|
details > summary {
|
|
position: relative;
|
|
cursor: pointer;
|
|
padding-bottom: 5px;
|
|
}
|
|
|
|
.eth-tx-params .solidity-func-name {
|
|
width: fit-content;
|
|
padding: 4px;
|
|
text-transform: uppercase;
|
|
border: 1px solid rgb(149, 149, 149);
|
|
color: rgb(149, 149, 149);
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.eth-tx-params .sol-value {
|
|
display: flex;
|
|
flex-flow: row wrap;
|
|
}
|
|
|
|
.eth-tx-params .sol-value > {
|
|
overflow: ellipses;
|
|
}
|
|
|
|
.eth-tx-params ol {
|
|
list-style: none;
|
|
padding: 0;
|
|
max-width: inherit;
|
|
}
|
|
|
|
.eth-tx-params > ol {
|
|
margin-left: 16px;
|
|
}
|
|
|
|
/*
|
|
Use this parameter to change the indentation!! */
|
|
.eth-tx-params ol ol:not(:first-child) {
|
|
padding-left: 8px;
|
|
}
|
|
|
|
pre.solidity-raw {
|
|
text-align: left;
|
|
}
|
|
|
|
.solidity-address {
|
|
display: flex;
|
|
flex-direction: row;
|
|
}
|
|
|
|
.solidity-address :first-child {
|
|
width: 16px;
|
|
height: 16px;
|
|
margin: 0 8px;
|
|
}
|
|
|
|
.solidity-item .param-name {
|
|
padding-right: 4px;
|
|
}
|
|
|
|
.solidity-value {
|
|
color: #6a737d;
|
|
overflow-x: hidden;
|
|
padding-bottom: 5px;
|
|
|
|
& > div {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
word-break: break-all;
|
|
}
|
|
}
|
|
|
|
.solidity-error {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
& > .error-message__icon {
|
|
width: 14px;
|
|
margin-right: 5px;
|
|
}
|
|
}
|
|
|
|
.eth-tx-params details > summary {
|
|
color: black;
|
|
font-family: sans-serif;
|
|
}
|
|
|
|
.eth-tx-params footer {
|
|
text-align: center;
|
|
color: #8d959e;
|
|
}
|
|
|
|
.eth-tx-params footer a {
|
|
text-align: center;
|
|
color: #8d959e;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|