m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-10-22 11:22:43 +02:00
Code

UX Icon: Updated Icon for Disclosure (#17877)

Browse Source 
* updated fa-add

* updated summary icon

* updated styles for disclosure

* updated margin value
This commit is contained in:
Nidhi Kumari 2023-03-09 10:48:44 +05:30 committed by GitHub
parent 0ac54e40ee
commit bf06598d6e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
ui/components/ui/disclosure/disclosure.js
View File

@ -1,6 +1,8 @@
import React, { useState, useRef, useEffect } from 'react'; import React, { useState, useRef, useEffect } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import classnames from 'classnames'; import classnames from 'classnames';
import { Icon, ICON_NAMES } from '../../component-library';
import { Size } from '../../../helpers/constants/design-system';
const Disclosure = ({ children, title, size }) => { const Disclosure = ({ children, title, size }) => {
const disclosureFooterEl = useRef(null); const disclosureFooterEl = useRef(null);
@ -23,7 +25,12 @@ const Disclosure = ({ children, title, size }) => {
{title ? ( {title ? (
<details> <details>
<summary className="disclosure__summary"> <summary className="disclosure__summary">
<i className="fa fa-plus" /> <Icon
className="disclosure__summary--icon"
name={ICON_NAMES.ADD}
size={Size.SM}
marginInlineEnd={2}
/>
{title} {title}
</summary> </summary>
<div className={classnames('disclosure__content', size)}> <div className={classnames('disclosure__content', size)}>

7
ui/components/ui/disclosure/disclosure.scss
View File

@ -4,14 +4,9 @@
&__summary { &__summary {
position: relative; position: relative;
padding-left: 24px;
padding-bottom: 10px; padding-bottom: 10px;
font-weight: bold; font-weight: bold;
display: flex;
i {
margin-inline-start: -20px;
margin-inline-end: 10px;
}
&::-webkit-details-marker, &::-webkit-details-marker,
&::marker { &::marker {