1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-10-22 19:26:13 +02:00

Fix permission site origin overflow (#13868)

* Fix permission site origin overflow

* Standardize connect flow a bit

* Another standardization change

* Fix another chip width issue

* Standardize snap install

* Fix lint

* Fix overflow after rebase
This commit is contained in:
Frederik Bolding 2022-03-10 18:03:32 +01:00 committed by GitHub
parent c439953d94
commit 0d961a655e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 45 additions and 24 deletions

View File

@ -1,7 +1,9 @@
.permissions-connect-header {
flex: 0;
width: 100%;
&__icon {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;

View File

@ -34,9 +34,9 @@
}
&__wrapper {
width: 92%;
display: flex;
overflow: hidden;
width: 100%;
}
&__list {

View File

@ -1,4 +1,10 @@
.site-origin {
max-width: 100%;
.chip {
max-width: 100%;
}
.chip__left-icon {
padding: 4px 0 4px 8px;
}

View File

@ -49,28 +49,30 @@ const ChooseAccount = ({
return (
<>
<PermissionsConnectHeader
iconUrl={targetSubjectMetadata?.iconUrl}
iconName={targetSubjectMetadata?.name}
headerTitle={t('connectWithMetaMask')}
headerText={
accounts.length > 0
? t('selectAccounts')
: t('connectAccountOrCreate')
}
siteOrigin={targetSubjectMetadata?.origin}
/>
<AccountList
accounts={accounts}
selectNewAccountViaModal={selectNewAccountViaModal}
addressLastConnectedMap={addressLastConnectedMap}
nativeCurrency={nativeCurrency}
selectedAccounts={selectedAccounts}
allAreSelected={allAreSelected}
deselectAll={deselectAll}
selectAll={selectAll}
handleAccountClick={handleAccountClick}
/>
<div className="permissions-connect-choose-account__content">
<PermissionsConnectHeader
iconUrl={targetSubjectMetadata?.iconUrl}
iconName={targetSubjectMetadata?.name}
headerTitle={t('connectWithMetaMask')}
headerText={
accounts.length > 0
? t('selectAccounts')
: t('connectAccountOrCreate')
}
siteOrigin={targetSubjectMetadata?.origin}
/>
<AccountList
accounts={accounts}
selectNewAccountViaModal={selectNewAccountViaModal}
addressLastConnectedMap={addressLastConnectedMap}
nativeCurrency={nativeCurrency}
selectedAccounts={selectedAccounts}
allAreSelected={allAreSelected}
deselectAll={deselectAll}
selectAll={selectAll}
handleAccountClick={handleAccountClick}
/>
</div>
<div className="permissions-connect-choose-account__footer-container">
<PermissionsConnectFooter />
<div className="permissions-connect-choose-account__bottom-buttons">

View File

@ -7,6 +7,16 @@
color: var(--Red-400);
}
&__content {
display: flex;
overflow-y: auto;
flex-direction: column;
width: 100%;
padding-left: 24px;
padding-right: 24px;
margin-top: 2px;
}
&__footer-container {
width: 100%;
flex: 1;
@ -27,7 +37,7 @@
width: 100%;
padding-top: 16px;
padding-bottom: 16px;
margin-top: 8px;
margin-top: 12px;
border-top: 1px solid #d6d9dc;
@media screen and (min-width: $break-large) {

View File

@ -24,5 +24,6 @@
.page-container__footer {
width: 100%;
margin-top: 12px;
}
}