m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-22 09:23:21 +01:00
Code

style: update Desktop App settings styles (#20676)

Browse Source
This commit is contained in:
Ariella Vu 2023-08-31 06:50:21 -07:00 committed by GitHub
parent ebf2156573
commit c15226325e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 41 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
app/_locales/en/messages.json generated
View File

@ -1159,6 +1159,9 @@
"message": "Description from $1",
"description": "$1 represents the name of the snap"
},
"desktopApp": {
"message": "Desktop App"
},
"desktopConnectionCriticalErrorDescription": {
"message": "This error could be intermittent, so try restarting the extension or disable MetaMask Desktop."
},

19
ui/pages/settings/experimental-tab/__snapshots__/experimental-tab.test.js.snap
View File

@ -197,19 +197,22 @@ exports[`ExperimentalTab with desktop enabled renders ExperimentalTab component
</div>
</div>
</div>
<h4
class="mm-box mm-text mm-text--heading-sm mm-box--margin-bottom-2 mm-box--color-text-alternative"
>
Desktop App
</h4>
<div
class="mm-box settings-page__content-row mm-box--display-flex mm-box--flex-direction-row mm-box--justify-content-space-between"
class="mm-box mm-box--display-flex mm-box--flex-direction-row mm-box--flex-wrap-wrap mm-box--justify-content-space-between mm-box--align-items-center"
data-testid="advanced-setting-desktop-pairing"
>
<div
class="settings-page__content-item"
<p
class="mm-box mm-text mm-text--body-md mm-box--margin-top-3 mm-box--padding-right-2 mm-box--color-text-default"
>
<span>
Click to run all background processes in the desktop app.
</span>
</div>
Click to run all background processes in the desktop app.
</p>
<div
class="settings-page__content-item-col"
class="mm-box settings-page__content-item-col mm-box--padding-top-3"
>
<button
class="button btn--rounded btn-primary btn--large"

43
ui/pages/settings/experimental-tab/experimental-tab.component.js
View File

@ -13,8 +13,10 @@ import {
TextVariant,
FontWeight,
///: BEGIN:ONLY_INCLUDE_IN(desktop)
AlignItems,
Display,
FlexDirection,
FlexWrap,
JustifyContent,
///: END:ONLY_INCLUDE_IN
} from '../../../helpers/constants/design-system';
@ -245,22 +247,31 @@ export default class ExperimentalTab extends PureComponent {
const { t } = this.context;
return (
<Box
ref={this.settingsRefs[6]}
className="settings-page__content-row"
data-testid="advanced-setting-desktop-pairing"
display={Display.Flex}
flexDirection={FlexDirection.Row}
justifyContent={JustifyContent.spaceBetween}
>
<div className="settings-page__content-item">
<span>{t('desktopEnableButtonDescription')}</span>
</div>
<div className="settings-page__content-item-col">
<DesktopEnableButton />
</div>
</Box>
<>
<Text
variant={TextVariant.headingSm}
color={TextColor.textAlternative}
marginBottom={2}
>
{t('desktopApp')}
</Text>
<Box
ref={this.settingsRefs[6]}
data-testid="advanced-setting-desktop-pairing"
display={Display.Flex}
alignItems={AlignItems.center}
flexDirection={FlexDirection.Row}
flexWrap={FlexWrap.Wrap}
justifyContent={JustifyContent.spaceBetween}
>
<Text marginTop={3} paddingRight={2}>
{t('desktopEnableButtonDescription')}
</Text>
<Box className="settings-page__content-item-col" paddingTop={3}>
<DesktopEnableButton />
</Box>
</Box>
</>
);
}
///: END:ONLY_INCLUDE_IN