1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-22 09:57:02 +01:00

[FLASK] Fix classnames for snaps components (#19234)

* renamed classnames according to BEM, removed unnecessary scss file

* remove plurality in classnames
This commit is contained in:
Hassan Malik 2023-05-23 09:07:44 -04:00 committed by GitHub
parent dfb2c0e0e8
commit a9429c5c0d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 19 additions and 92 deletions

View File

@ -41,7 +41,6 @@
@import 'snaps/snap-ui-markdown/index';
@import 'snaps/snap-delineator/index';
@import 'snaps/snap-settings-card/index';
@import 'snaps/update-snap-permission-list/index';
@import 'snaps/copyable/index';
@import 'snaps/snap-version/index';
@import 'gas-details-item/index';

View File

@ -1,62 +0,0 @@
.update-snap-permission-list {
width: 100%;
.approved-permission,
.new-permission,
.revoked-permission {
@include H6;
width: 100%;
padding-bottom: 16px;
border-bottom: 1px solid var(--color-border-default);
display: flex;
flex-direction: row;
align-items: center;
color: var(--color-text-default);
i {
display: block;
padding: 16px;
min-width: 16px;
min-height: 16px;
font-size: 1rem;
}
}
.approved-permission {
color: var(--color-success-default);
}
.revoked-permission {
color: var(--color-error-alternative);
}
.new-permission {
color: var(--color-info-default);
}
.permission-description {
width: 100%;
display: flex;
flex-direction: column;
}
.permission-description-subtext {
@include H7;
}
.permission {
&__tooltip-icon {
margin-left: auto !important;
padding-left: 16px;
i {
color: var(--color-icon-muted);
}
&__warning i {
color: var(--color-warning-default);
}
}
}
}

View File

@ -1,10 +1,10 @@
.snap-install {
box-shadow: none;
.content {
&__content {
flex: 1;
.loader-container {
&__loader-container {
height: 100%;
}

View File

@ -84,7 +84,7 @@ export default function SnapInstall({
flexDirection={FLEX_DIRECTION.COLUMN}
>
<Box
className="header"
className="snap-install__header"
alignItems={AlignItems.center}
paddingLeft={4}
paddingRight={4}
@ -101,10 +101,10 @@ export default function SnapInstall({
</Text>
)}
</Box>
<Box className="content">
<Box className="snap-install__content">
{isLoading && (
<Box
className="loader-container"
className="snap-install__content__loader-container"
flexDirection={FLEX_DIRECTION.COLUMN}
alignItems={AlignItems.center}
justifyContent={JustifyContent.center}
@ -118,7 +118,7 @@ export default function SnapInstall({
{hasPermissions && (
<>
<Text
className="content__permission-description"
className="snap-install__content__permission-description"
paddingBottom={4}
paddingLeft={4}
paddingRight={4}
@ -152,7 +152,7 @@ export default function SnapInstall({
)}
</Box>
<Box
className="footers"
className="snap-install__footer"
alignItems={AlignItems.center}
flexDirection={FLEX_DIRECTION.COLUMN}
>

View File

@ -1,10 +1,10 @@
.snap-result {
box-shadow: none;
.headers {
&__header {
flex: 1;
.loader-container {
&__loader-container {
height: 100%;
}
}

View File

@ -48,7 +48,7 @@ export default function SnapResult({
flexDirection={FLEX_DIRECTION.COLUMN}
>
<Box
className="headers"
className="snap-result__header"
paddingLeft={4}
paddingRight={4}
alignItems={AlignItems.center}
@ -57,7 +57,7 @@ export default function SnapResult({
<SnapAuthorship snapId={targetSubjectMetadata.origin} />
{isLoading && (
<Box
className="loader-container"
className="snap-result__header__loader-container"
flexDirection={FLEX_DIRECTION.COLUMN}
alignItems={AlignItems.center}
justifyContent={JustifyContent.center}
@ -94,7 +94,7 @@ export default function SnapResult({
)}
</Box>
<Box
className="footers"
className="snap-result__footer"
alignItems={AlignItems.center}
flexDirection={FLEX_DIRECTION.COLUMN}
>

View File

@ -1,23 +1,13 @@
.snap-update {
box-shadow: none;
.content {
&__content {
flex: 1;
.loader-container {
&__loader-container {
height: 100%;
}
.update-snap-permission-list {
padding: 0 24px;
.new-permission,
.approved-permission,
.revoked-permission {
padding: 8px 0;
}
}
&__permission-description {
border-bottom: 1px solid var(--color-border-default);
}

View File

@ -90,7 +90,7 @@ export default function SnapUpdate({
flexDirection={FLEX_DIRECTION.COLUMN}
>
<Box
className="header"
className="snap-update__header"
paddingLeft={4}
paddingRight={4}
alignItems={AlignItems.center}
@ -107,10 +107,10 @@ export default function SnapUpdate({
</Text>
)}
</Box>
<Box className="content">
<Box className="snap-update__content">
{isLoading && (
<Box
className="loader-container"
className="snap-update__content__loader-container"
flexDirection={FLEX_DIRECTION.COLUMN}
alignItems={AlignItems.center}
justifyContent={JustifyContent.center}
@ -124,7 +124,7 @@ export default function SnapUpdate({
{hasPermissions && (
<>
<Text
className="content__permission-description"
className="snap-update__content__permission-description"
paddingBottom={4}
paddingLeft={4}
paddingRight={4}
@ -160,7 +160,7 @@ export default function SnapUpdate({
)}
</Box>
<Box
className="footers"
className="snap-update__footer"
alignItems={AlignItems.center}
flexDirection={FLEX_DIRECTION.COLUMN}
>