mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
EIP-1559 V2 UI/UX improvements (#13419)
This commit is contained in:
Jyoti Puri
GitHub
parent
869d7a21bf
commit
11c61a3ead
@ -1,25 +1 @@
|
||||
<svg width="162" height="32" viewBox="0 0 162 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_2140_17920)">
|
||||
<rect width="161" height="31" transform="translate(0.8125 0.0820312)" fill="white"/>
|
||||
<path d="M117.469 8.63798H118.499L120.889 14.288L123.289 8.63798H124.299L121.279 15.738H120.499L117.469 8.63798Z" fill="#F66A0A"/>
|
||||
<path d="M126.795 15.838C126.409 15.838 126.055 15.7713 125.735 15.638C125.415 15.5046 125.142 15.3213 124.915 15.088C124.689 14.8546 124.512 14.5813 124.385 14.268C124.265 13.948 124.205 13.6046 124.205 13.238C124.205 12.8713 124.269 12.5313 124.395 12.218C124.522 11.898 124.699 11.6213 124.925 11.388C125.159 11.1546 125.435 10.9713 125.755 10.838C126.075 10.7046 126.425 10.638 126.805 10.638C127.132 10.638 127.439 10.6946 127.725 10.808C128.012 10.9146 128.262 11.078 128.475 11.298C128.695 11.5113 128.869 11.7746 128.995 12.088C129.122 12.3946 129.185 12.748 129.185 13.148C129.185 13.1946 129.185 13.238 129.185 13.278C129.185 13.3113 129.182 13.3546 129.175 13.408H125.075C125.082 13.6413 125.129 13.858 125.215 14.058C125.309 14.258 125.429 14.4313 125.575 14.578C125.729 14.7246 125.909 14.8413 126.115 14.928C126.329 15.008 126.559 15.048 126.805 15.048C127.192 15.048 127.509 14.9713 127.755 14.818C128.009 14.658 128.212 14.4446 128.365 14.178L129.045 14.648C128.819 15.0146 128.515 15.3046 128.135 15.518C127.762 15.7313 127.315 15.838 126.795 15.838ZM128.305 12.708C128.272 12.5013 128.209 12.318 128.115 12.158C128.029 11.998 127.915 11.8613 127.775 11.748C127.642 11.6346 127.489 11.548 127.315 11.488C127.142 11.428 126.962 11.398 126.775 11.398C126.589 11.398 126.405 11.428 126.225 11.488C126.045 11.548 125.882 11.6346 125.735 11.748C125.589 11.8546 125.462 11.9913 125.355 12.158C125.249 12.318 125.175 12.5013 125.135 12.708H128.305Z" fill="#F66A0A"/>
|
||||
<path d="M130.406 10.738H131.266V11.708C131.312 11.548 131.386 11.4046 131.486 11.278C131.586 11.1513 131.699 11.0446 131.826 10.958C131.952 10.8713 132.086 10.8046 132.226 10.758C132.372 10.7113 132.519 10.688 132.666 10.688C132.799 10.688 132.929 10.7013 133.056 10.728V11.618C132.976 11.5846 132.899 11.5646 132.826 11.558C132.752 11.5446 132.672 11.538 132.586 11.538C132.426 11.538 132.266 11.5746 132.106 11.648C131.952 11.7146 131.812 11.818 131.686 11.958C131.566 12.098 131.466 12.278 131.386 12.498C131.306 12.7113 131.266 12.9646 131.266 13.258V15.738H130.406V10.738Z" fill="#F66A0A"/>
|
||||
<path d="M134.438 17.828L135.528 15.478L133.338 10.738H134.288L136.008 14.538L137.718 10.738H138.678L135.398 17.828H134.438Z" fill="#F66A0A"/>
|
||||
<path d="M141.724 15.738V8.23798H142.584V11.508C142.757 11.208 142.984 10.988 143.264 10.848C143.544 10.708 143.847 10.638 144.174 10.638C144.454 10.638 144.711 10.6846 144.944 10.778C145.177 10.8713 145.374 11.008 145.534 11.188C145.701 11.3613 145.831 11.5746 145.924 11.828C146.017 12.0746 146.064 12.3513 146.064 12.658V15.738H145.214V12.788C145.214 12.368 145.104 12.038 144.884 11.798C144.671 11.5513 144.387 11.428 144.034 11.428C143.834 11.428 143.644 11.468 143.464 11.548C143.291 11.628 143.137 11.748 143.004 11.908C142.877 12.0613 142.774 12.2513 142.694 12.478C142.621 12.7046 142.584 12.9646 142.584 13.258V15.738H141.724Z" fill="#F66A0A"/>
|
||||
<path d="M148.053 9.39798C147.879 9.39798 147.733 9.34131 147.613 9.22798C147.493 9.10798 147.433 8.96131 147.433 8.78798C147.433 8.62131 147.493 8.47798 147.613 8.35798C147.733 8.23798 147.879 8.17798 148.053 8.17798C148.226 8.17798 148.369 8.23798 148.483 8.35798C148.596 8.47798 148.653 8.62131 148.653 8.78798C148.653 8.96131 148.596 9.10798 148.483 9.22798C148.369 9.34131 148.226 9.39798 148.053 9.39798ZM147.613 10.738H148.473V15.738H147.613V10.738Z" fill="#F66A0A"/>
|
||||
<path d="M152.283 14.928C152.53 14.928 152.756 14.8846 152.963 14.798C153.176 14.7113 153.356 14.5913 153.503 14.438C153.65 14.278 153.763 14.0913 153.843 13.878C153.93 13.6646 153.973 13.4313 153.973 13.178C153.973 12.9313 153.93 12.7013 153.843 12.488C153.763 12.268 153.65 12.0813 153.503 11.928C153.356 11.7746 153.176 11.6546 152.963 11.568C152.756 11.4746 152.53 11.428 152.283 11.428C152.03 11.428 151.8 11.4746 151.593 11.568C151.386 11.6546 151.21 11.7746 151.063 11.928C150.916 12.0813 150.8 12.268 150.713 12.488C150.633 12.7013 150.593 12.9313 150.593 13.178C150.593 13.4313 150.633 13.6646 150.713 13.878C150.8 14.0913 150.916 14.278 151.063 14.438C151.21 14.5913 151.386 14.7113 151.593 14.798C151.8 14.8846 152.03 14.928 152.283 14.928ZM152.233 17.928C151.693 17.928 151.22 17.828 150.813 17.628C150.406 17.428 150.096 17.188 149.883 16.908L150.483 16.308C150.683 16.5613 150.926 16.7646 151.213 16.918C151.506 17.0713 151.846 17.148 152.233 17.148C152.446 17.148 152.653 17.1146 152.853 17.048C153.053 16.9813 153.23 16.8746 153.383 16.728C153.543 16.588 153.67 16.408 153.763 16.188C153.856 15.9746 153.903 15.718 153.903 15.418V14.848C153.73 15.1013 153.49 15.3113 153.183 15.478C152.876 15.6446 152.536 15.728 152.163 15.728C151.816 15.728 151.493 15.6646 151.193 15.538C150.893 15.4046 150.633 15.2246 150.413 14.998C150.193 14.7646 150.02 14.4946 149.893 14.188C149.773 13.8746 149.713 13.538 149.713 13.178C149.713 12.8246 149.773 12.4946 149.893 12.188C150.02 11.8746 150.193 11.6046 150.413 11.378C150.633 11.1446 150.893 10.9646 151.193 10.838C151.493 10.7046 151.816 10.638 152.163 10.638C152.536 10.638 152.876 10.7213 153.183 10.888C153.49 11.048 153.73 11.2546 153.903 11.508V10.738H154.763V15.448C154.763 15.868 154.696 16.2313 154.563 16.538C154.436 16.8513 154.26 17.108 154.033 17.308C153.806 17.5146 153.54 17.668 153.233 17.768C152.926 17.8746 152.593 17.928 152.233 17.928Z" fill="#F66A0A"/>
|
||||
<path d="M156.382 15.738V8.23798H157.242V11.508C157.416 11.208 157.642 10.988 157.922 10.848C158.202 10.708 158.506 10.638 158.832 10.638C159.112 10.638 159.369 10.6846 159.602 10.778C159.836 10.8713 160.032 11.008 160.192 11.188C160.359 11.3613 160.489 11.5746 160.582 11.828C160.676 12.0746 160.722 12.3513 160.722 12.658V15.738H159.872V12.788C159.872 12.368 159.762 12.038 159.542 11.798C159.329 11.5513 159.046 11.428 158.692 11.428C158.492 11.428 158.302 11.468 158.122 11.548C157.949 11.628 157.796 11.748 157.662 11.908C157.536 12.0613 157.432 12.2513 157.352 12.478C157.279 12.7046 157.242 12.9646 157.242 13.258V15.738H156.382Z" fill="#F66A0A"/>
|
||||
<path opacity="0.3" d="M45.774 22.738C35.0101 30.158 26.3574 30.738 26.3574 30.738H136.608C136.608 30.738 127.955 30.158 117.191 22.738C106.427 15.3181 93.8273 0.738037 81.4825 0.738037C69.1377 0.738037 56.5378 15.3181 45.774 22.738Z" fill="#037DD6"/>
|
||||
<mask id="mask0_2140_17920" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="26" y="0" width="111" height="31">
|
||||
<path d="M45.774 22.6052C35.0101 30.0252 26.3574 30.6052 26.3574 30.6052H136.608C136.608 30.6052 127.955 30.0252 117.191 22.6052C106.427 15.1853 93.8273 0.605225 81.4825 0.605225C69.1377 0.605225 56.5378 15.1853 45.774 22.6052Z" fill="#EAF6FF"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_2140_17920)">
|
||||
<rect x="118.254" y="-5.20923" width="20.7061" height="39.25" fill="#F66A0A" stroke="white" stroke-width="2"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_2140_17920">
|
||||
<rect width="161" height="31" fill="white" transform="translate(0.8125 0.0820312)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
<svg width="162" height="32" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path fill="#fff" d="M.813.082h161v31h-161z"/><path d="M117.469 8.638h1.03l2.39 5.65 2.4-5.65h1.01l-3.02 7.1h-.78l-3.03-7.1ZM126.795 15.838c-.386 0-.74-.067-1.06-.2a2.436 2.436 0 0 1-1.35-1.37 2.91 2.91 0 0 1-.18-1.03c0-.367.064-.707.19-1.02.127-.32.304-.597.53-.83.234-.233.51-.417.83-.55.32-.133.67-.2 1.05-.2.327 0 .634.057.92.17.287.107.537.27.75.49.22.213.394.477.52.79.127.307.19.66.19 1.06v.13c0 .033-.003.077-.01.13h-4.1c.007.233.054.45.14.65.094.2.214.373.36.52.154.147.334.263.54.35.214.08.444.12.69.12.387 0 .704-.077.95-.23.254-.16.457-.373.61-.64l.68.47c-.226.367-.53.657-.91.87-.373.213-.82.32-1.34.32Zm1.51-3.13a1.56 1.56 0 0 0-.19-.55c-.086-.16-.2-.297-.34-.41a1.408 1.408 0 0 0-.46-.26 1.636 1.636 0 0 0-.54-.09 1.732 1.732 0 0 0-1.04.35 1.512 1.512 0 0 0-.38.41c-.106.16-.18.343-.22.55h3.17ZM130.406 10.738h.86v.97c.046-.16.12-.303.22-.43s.213-.233.34-.32a1.59 1.59 0 0 1 .4-.2c.146-.047.293-.07.44-.07.133 0 .263.013.39.04v.89a.782.782 0 0 0-.23-.06 1.348 1.348 0 0 0-.24-.02c-.16 0-.32.037-.48.11-.154.067-.294.17-.42.31-.12.14-.22.32-.3.54-.08.213-.12.467-.12.76v2.48h-.86v-5ZM134.438 17.828l1.09-2.35-2.19-4.74h.95l1.72 3.8 1.71-3.8h.96l-3.28 7.09h-.96ZM141.724 15.738v-7.5h.86v3.27c.173-.3.4-.52.68-.66s.583-.21.91-.21c.28 0 .537.047.77.14.233.093.43.23.59.41.167.173.297.387.39.64.093.247.14.523.14.83v3.08h-.85v-2.95c0-.42-.11-.75-.33-.99-.213-.247-.497-.37-.85-.37-.2 0-.39.04-.57.12-.173.08-.327.2-.46.36-.127.153-.23.343-.31.57-.073.227-.11.487-.11.78v2.48h-.86ZM148.053 9.398a.599.599 0 0 1-.62-.61c0-.167.06-.31.18-.43s.266-.18.44-.18c.173 0 .316.06.43.18.113.12.17.263.17.43 0 .173-.057.32-.17.44a.584.584 0 0 1-.43.17Zm-.44 1.34h.86v5h-.86v-5ZM152.283 14.928c.247 0 .473-.043.68-.13.213-.087.393-.207.54-.36a1.7 1.7 0 0 0 .34-.56c.087-.213.13-.447.13-.7a1.81 1.81 0 0 0-.13-.69 1.573 1.573 0 0 0-.34-.56 1.54 1.54 0 0 0-.54-.36 1.632 1.632 0 0 0-.68-.14c-.253 0-.483.047-.69.14a1.554 1.554 0 0 0-.53.36 1.7 1.7 0 0 0-.35.56c-.08.213-.12.443-.12.69 0 .253.04.487.12.7.087.213.203.4.35.56.147.153.323.273.53.36.207.087.437.13.69.13Zm-.05 3c-.54 0-1.013-.1-1.42-.3-.407-.2-.717-.44-.93-.72l.6-.6c.2.253.443.457.73.61.293.153.633.23 1.02.23.213 0 .42-.033.62-.1s.377-.173.53-.32c.16-.14.287-.32.38-.54.093-.213.14-.47.14-.77v-.57a2.015 2.015 0 0 1-.72.63c-.307.167-.647.25-1.02.25-.347 0-.67-.063-.97-.19-.3-.133-.56-.313-.78-.54a2.643 2.643 0 0 1-.52-.81 2.8 2.8 0 0 1-.18-1.01c0-.353.06-.683.18-.99.127-.313.3-.583.52-.81.22-.233.48-.413.78-.54.3-.133.623-.2.97-.2.373 0 .713.083 1.02.25.307.16.547.367.72.62v-.77h.86v4.71c0 .42-.067.783-.2 1.09-.127.313-.303.57-.53.77a2.17 2.17 0 0 1-.8.46c-.307.107-.64.16-1 .16ZM156.382 15.738v-7.5h.86v3.27c.174-.3.4-.52.68-.66s.584-.21.91-.21c.28 0 .537.047.77.14.234.093.43.23.59.41.167.173.297.387.39.64.094.247.14.523.14.83v3.08h-.85v-2.95c0-.42-.11-.75-.33-.99-.213-.247-.496-.37-.85-.37-.2 0-.39.04-.57.12-.173.08-.326.2-.46.36-.126.153-.23.343-.31.57-.073.227-.11.487-.11.78v2.48h-.86Z" fill="#F66A0A"/><path opacity=".3" d="M45.774 22.738c-10.764 7.42-19.417 8-19.417 8h110.251s-8.653-.58-19.417-8c-10.764-7.42-23.364-22-35.709-22-12.344 0-24.944 14.58-35.708 22Z" fill="#037DD6"/><mask id="b" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="26" y="0" width="111" height="31"><path d="M45.774 22.605c-10.764 7.42-19.417 8-19.417 8h110.251s-8.653-.58-19.417-8c-10.764-7.42-23.364-22-35.709-22-12.344 0-24.944 14.58-35.708 22Z" fill="#EAF6FF"/></mask><g mask="url(#b)"><path fill="#F66A0A" stroke="#fff" stroke-width="2" d="M118.254-5.209h20.706v39.25h-20.706z"/></g></g><defs><clipPath id="a"><path fill="#fff" transform="translate(.813 .082)" d="M0 0h161v31H0z"/></clipPath></defs></svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 7.0 KiB After Width: | Height: | Size: 3.7 KiB |
@ -1,20 +1 @@
|
||||
<svg width="162" height="32" viewBox="0 0 162 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_2140_18019)">
|
||||
<rect width="161" height="31" transform="translate(0.8125 0.0820312)" fill="white"/>
|
||||
<path d="M26.0469 8.63806H26.9769V14.8581H30.4069V15.7381H26.0469V8.63806Z" fill="#F66A0A"/>
|
||||
<path d="M33.4591 15.8381C33.0791 15.8381 32.7291 15.7714 32.4091 15.6381C32.0891 15.4981 31.8125 15.3114 31.5791 15.0781C31.3458 14.8447 31.1625 14.5714 31.0291 14.2581C30.9025 13.9381 30.8391 13.5981 30.8391 13.2381C30.8391 12.8781 30.9025 12.5414 31.0291 12.2281C31.1625 11.9081 31.3458 11.6314 31.5791 11.3981C31.8125 11.1647 32.0891 10.9814 32.4091 10.8481C32.7291 10.7081 33.0791 10.6381 33.4591 10.6381C33.8325 10.6381 34.1791 10.7081 34.4991 10.8481C34.8191 10.9814 35.0958 11.1647 35.3291 11.3981C35.5625 11.6314 35.7425 11.9081 35.8691 12.2281C36.0025 12.5414 36.0691 12.8781 36.0691 13.2381C36.0691 13.5981 36.0025 13.9381 35.8691 14.2581C35.7425 14.5714 35.5625 14.8447 35.3291 15.0781C35.0958 15.3114 34.8191 15.4981 34.4991 15.6381C34.1791 15.7714 33.8325 15.8381 33.4591 15.8381ZM33.4591 15.0381C33.7191 15.0381 33.9558 14.9914 34.1691 14.8981C34.3825 14.8047 34.5625 14.6781 34.7091 14.5181C34.8625 14.3514 34.9791 14.1614 35.0591 13.9481C35.1458 13.7281 35.1891 13.4914 35.1891 13.2381C35.1891 12.9914 35.1458 12.7581 35.0591 12.5381C34.9791 12.3181 34.8625 12.1281 34.7091 11.9681C34.5625 11.8014 34.3825 11.6714 34.1691 11.5781C33.9558 11.4847 33.7191 11.4381 33.4591 11.4381C33.1991 11.4381 32.9625 11.4847 32.7491 11.5781C32.5358 11.6714 32.3525 11.8014 32.1991 11.9681C32.0458 12.1281 31.9258 12.3181 31.8391 12.5381C31.7591 12.7581 31.7191 12.9914 31.7191 13.2381C31.7191 13.4914 31.7591 13.7281 31.8391 13.9481C31.9258 14.1614 32.0458 14.3514 32.1991 14.5181C32.3525 14.6781 32.5358 14.8047 32.7491 14.8981C32.9625 14.9914 33.1991 15.0381 33.4591 15.0381Z" fill="#F66A0A"/>
|
||||
<path d="M40.2841 12.1481L39.0541 15.7381H38.2941L36.5941 10.7381H37.4941L38.7041 14.3881L39.9541 10.7381H40.6141L41.8641 14.3881L43.0741 10.7381H43.9841L42.2841 15.7381H41.5241L40.2841 12.1481Z" fill="#F66A0A"/>
|
||||
<path opacity="0.3" d="M45.774 22.738C35.0101 30.158 26.3574 30.738 26.3574 30.738H136.608C136.608 30.738 127.955 30.158 117.191 22.738C106.427 15.3181 93.8273 0.738037 81.4825 0.738037C69.1377 0.738037 56.5378 15.3181 45.774 22.738Z" fill="#037DD6"/>
|
||||
<mask id="mask0_2140_18019" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="26" y="0" width="111" height="31">
|
||||
<path d="M45.774 22.6052C35.0101 30.0252 26.3574 30.6052 26.3574 30.6052H136.608C136.608 30.6052 127.955 30.0252 117.191 22.6052C106.427 15.1853 93.8273 0.605225 81.4825 0.605225C69.1377 0.605225 56.5378 15.1853 45.774 22.6052Z" fill="#EAF6FF"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_2140_18019)">
|
||||
<rect x="24.6074" y="16.738" width="20.7061" height="17.3027" fill="#F66A0A" stroke="white" stroke-width="2"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_2140_18019">
|
||||
<rect width="161" height="31" fill="white" transform="translate(0.8125 0.0820312)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
<svg width="162" height="32" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path fill="#fff" d="M.813.082h161v31h-161z"/><path d="M26.047 8.638h.93v6.22h3.43v.88h-4.36v-7.1ZM33.46 15.838c-.38 0-.73-.067-1.05-.2a2.573 2.573 0 0 1-1.38-1.38c-.127-.32-.19-.66-.19-1.02s.063-.697.19-1.01c.133-.32.316-.597.55-.83.233-.233.51-.417.83-.55.32-.14.67-.21 1.05-.21.373 0 .72.07 1.04.21.32.133.596.317.83.55.233.233.413.51.54.83.133.313.2.65.2 1.01s-.068.7-.2 1.02a2.438 2.438 0 0 1-.54.82c-.234.233-.51.42-.83.56-.32.133-.667.2-1.04.2Zm0-.8c.26 0 .496-.047.71-.14.212-.093.392-.22.54-.38.152-.167.27-.357.35-.57.086-.22.13-.457.13-.71 0-.247-.044-.48-.13-.7-.08-.22-.198-.41-.35-.57a1.518 1.518 0 0 0-.54-.39 1.752 1.752 0 0 0-.71-.14c-.26 0-.498.047-.71.14a1.62 1.62 0 0 0-.55.39 1.73 1.73 0 0 0-.36.57c-.08.22-.12.453-.12.7 0 .253.04.49.12.71.086.213.206.403.36.57.152.16.336.287.55.38.212.093.45.14.71.14ZM40.284 12.148l-1.23 3.59h-.76l-1.7-5h.9l1.21 3.65 1.25-3.65h.66l1.25 3.65 1.21-3.65h.91l-1.7 5h-.76l-1.24-3.59Z" fill="#F66A0A"/><path opacity=".3" d="M45.774 22.738c-10.764 7.42-19.417 8-19.417 8h110.251s-8.653-.58-19.417-8c-10.764-7.42-23.364-22-35.709-22-12.344 0-24.944 14.58-35.708 22Z" fill="#037DD6"/><mask id="b" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="26" y="0" width="111" height="31"><path d="M45.774 22.605c-10.764 7.42-19.417 8-19.417 8h110.251s-8.653-.58-19.417-8c-10.764-7.42-23.364-22-35.709-22-12.344 0-24.944 14.58-35.708 22Z" fill="#EAF6FF"/></mask><g mask="url(#b)"><path fill="#F66A0A" stroke="#fff" stroke-width="2" d="M24.607 16.738h20.706v17.303H24.607z"/></g></g><defs><clipPath id="a"><path fill="#fff" transform="translate(.813 .082)" d="M0 0h161v31H0z"/></clipPath></defs></svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 3.0 KiB After Width: | Height: | Size: 1.7 KiB |
@ -1,16 +1 @@
|
||||
<svg width="162" height="47" viewBox="0 0 162 47" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="161" height="46" transform="translate(0.8125 0.0820312)" fill="white"/>
|
||||
<path d="M64.268 1.50517L66.898 5.04517L69.548 1.50517H70.388V8.60517H69.468V3.08517L66.908 6.52517L64.348 3.08517V8.60517H63.418V1.50517H64.268Z" fill="#037DD6"/>
|
||||
<path d="M74.2575 8.70517C73.8708 8.70517 73.5175 8.6385 73.1975 8.50517C72.8775 8.37183 72.6042 8.1885 72.3775 7.95517C72.1508 7.72183 71.9742 7.4485 71.8475 7.13517C71.7275 6.81517 71.6675 6.47183 71.6675 6.10517C71.6675 5.7385 71.7308 5.3985 71.8575 5.08517C71.9842 4.76517 72.1608 4.4885 72.3875 4.25517C72.6208 4.02183 72.8975 3.8385 73.2175 3.70517C73.5375 3.57183 73.8875 3.50517 74.2675 3.50517C74.5942 3.50517 74.9008 3.56183 75.1875 3.67517C75.4742 3.78183 75.7242 3.94517 75.9375 4.16517C76.1575 4.3785 76.3308 4.64183 76.4575 4.95517C76.5842 5.26183 76.6475 5.61517 76.6475 6.01517C76.6475 6.06183 76.6475 6.10517 76.6475 6.14517C76.6475 6.1785 76.6442 6.22183 76.6375 6.27517H72.5375C72.5442 6.5085 72.5908 6.72517 72.6775 6.92517C72.7708 7.12517 72.8908 7.2985 73.0375 7.44517C73.1908 7.59183 73.3708 7.7085 73.5775 7.79517C73.7908 7.87517 74.0208 7.91517 74.2675 7.91517C74.6542 7.91517 74.9708 7.8385 75.2175 7.68517C75.4708 7.52517 75.6742 7.31183 75.8275 7.04517L76.5075 7.51517C76.2808 7.88183 75.9775 8.17183 75.5975 8.38517C75.2242 8.5985 74.7775 8.70517 74.2575 8.70517ZM75.7675 5.57517C75.7342 5.3685 75.6708 5.18517 75.5775 5.02517C75.4908 4.86517 75.3775 4.7285 75.2375 4.61517C75.1042 4.50183 74.9508 4.41517 74.7775 4.35517C74.6042 4.29517 74.4242 4.26517 74.2375 4.26517C74.0508 4.26517 73.8675 4.29517 73.6875 4.35517C73.5075 4.41517 73.3442 4.50183 73.1975 4.61517C73.0508 4.72183 72.9242 4.8585 72.8175 5.02517C72.7108 5.18517 72.6375 5.3685 72.5975 5.57517H75.7675Z" fill="#037DD6"/>
|
||||
<path d="M79.928 8.70517C79.5747 8.70517 79.248 8.6385 78.948 8.50517C78.6547 8.36517 78.398 8.1785 78.178 7.94517C77.958 7.70517 77.7847 7.4285 77.658 7.11517C77.538 6.80183 77.478 6.46517 77.478 6.10517C77.478 5.74517 77.538 5.4085 77.658 5.09517C77.7847 4.78183 77.958 4.5085 78.178 4.27517C78.398 4.03517 78.6547 3.8485 78.948 3.71517C79.248 3.57517 79.5747 3.50517 79.928 3.50517C80.308 3.50517 80.6547 3.59183 80.968 3.76517C81.2814 3.93183 81.5214 4.13517 81.688 4.37517V1.10517H82.548V8.60517H81.688V7.83517C81.5214 8.07517 81.2814 8.28183 80.968 8.45517C80.6547 8.62183 80.308 8.70517 79.928 8.70517ZM80.058 7.91517C80.3114 7.91517 80.5414 7.8685 80.748 7.77517C80.9547 7.68183 81.1314 7.55517 81.278 7.39517C81.4314 7.2285 81.548 7.03517 81.628 6.81517C81.7147 6.59517 81.758 6.3585 81.758 6.10517C81.758 5.85183 81.7147 5.61517 81.628 5.39517C81.548 5.17517 81.4314 4.98517 81.278 4.82517C81.1314 4.6585 80.9547 4.5285 80.748 4.43517C80.5414 4.34183 80.3114 4.29517 80.058 4.29517C79.8047 4.29517 79.5714 4.34183 79.358 4.43517C79.1514 4.5285 78.9714 4.6585 78.818 4.82517C78.6714 4.98517 78.5547 5.17517 78.468 5.39517C78.388 5.61517 78.348 5.85183 78.348 6.10517C78.348 6.3585 78.388 6.59517 78.468 6.81517C78.5547 7.03517 78.6714 7.2285 78.818 7.39517C78.9714 7.55517 79.1514 7.68183 79.358 7.77517C79.5714 7.8685 79.8047 7.91517 80.058 7.91517Z" fill="#037DD6"/>
|
||||
<path d="M84.6069 2.26517C84.4335 2.26517 84.2869 2.2085 84.1669 2.09517C84.0469 1.97517 83.9869 1.8285 83.9869 1.65517C83.9869 1.4885 84.0469 1.34517 84.1669 1.22517C84.2869 1.10517 84.4335 1.04517 84.6069 1.04517C84.7802 1.04517 84.9235 1.10517 85.0369 1.22517C85.1502 1.34517 85.2069 1.4885 85.2069 1.65517C85.2069 1.8285 85.1502 1.97517 85.0369 2.09517C84.9235 2.2085 84.7802 2.26517 84.6069 2.26517ZM84.1669 3.60517H85.0269V8.60517H84.1669V3.60517Z" fill="#037DD6"/>
|
||||
<path d="M88.4271 8.70517C88.1538 8.70517 87.9038 8.6585 87.6771 8.56517C87.4504 8.46517 87.2571 8.3285 87.0971 8.15517C86.9371 7.98183 86.8104 7.77183 86.7171 7.52517C86.6304 7.27183 86.5871 6.9885 86.5871 6.67517V3.60517H87.4471V6.54517C87.4471 6.96517 87.5471 7.2985 87.7471 7.54517C87.9538 7.79183 88.2304 7.91517 88.5771 7.91517C88.7704 7.91517 88.9504 7.87517 89.1171 7.79517C89.2904 7.7085 89.4371 7.5885 89.5571 7.43517C89.6838 7.27517 89.7838 7.08183 89.8571 6.85517C89.9304 6.6285 89.9671 6.37183 89.9671 6.08517V3.60517H90.8271V8.60517H89.9671V7.83517C89.8004 8.1285 89.5804 8.3485 89.3071 8.49517C89.0404 8.63517 88.7471 8.70517 88.4271 8.70517Z" fill="#037DD6"/>
|
||||
<path d="M98.8881 5.66517C98.8881 5.2585 98.8048 4.9285 98.6381 4.67517C98.4715 4.42183 98.2248 4.29517 97.8981 4.29517C97.4981 4.29517 97.1715 4.45183 96.9181 4.76517C96.6715 5.0785 96.5415 5.50517 96.5281 6.04517V8.60517H95.6681V5.66517C95.6681 5.2585 95.5848 4.9285 95.4181 4.67517C95.2581 4.42183 95.0148 4.29517 94.6881 4.29517C94.2815 4.29517 93.9481 4.4585 93.6881 4.78517C93.4348 5.11183 93.3081 5.5585 93.3081 6.12517V8.60517H92.4481V3.60517H93.3081V4.37517C93.4548 4.1085 93.6581 3.8985 93.9181 3.74517C94.1781 3.58517 94.4781 3.50517 94.8181 3.50517C95.1915 3.50517 95.5081 3.60183 95.7681 3.79517C96.0348 3.98183 96.2315 4.24183 96.3581 4.57517C96.4915 4.2485 96.7015 3.9885 96.9881 3.79517C97.2815 3.60183 97.6181 3.50517 97.9981 3.50517C98.2715 3.50517 98.5148 3.55517 98.7281 3.65517C98.9481 3.7485 99.1315 3.88517 99.2781 4.06517C99.4315 4.2385 99.5481 4.45183 99.6281 4.70517C99.7081 4.95183 99.7481 5.2285 99.7481 5.53517V8.60517H98.8881V5.66517Z" fill="#037DD6"/>
|
||||
<path opacity="0.3" d="M45.774 37.738C35.0101 45.158 26.3574 45.738 26.3574 45.738H136.608C136.608 45.738 127.955 45.158 117.191 37.738C106.427 30.3181 93.8273 15.738 81.4825 15.738C69.1377 15.738 56.5378 30.3181 45.774 37.738Z" fill="#037DD6"/>
|
||||
<mask id="mask0_2140_17999" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="26" y="15" width="111" height="31">
|
||||
<path d="M45.774 37.6052C35.0101 45.0252 26.3574 45.6052 26.3574 45.6052H136.608C136.608 45.6052 127.955 45.0252 117.191 37.6052C106.427 30.1853 93.8273 15.6052 81.4825 15.6052C69.1377 15.6052 56.5378 30.1853 45.774 37.6052Z" fill="#EAF6FF"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_2140_17999)">
|
||||
<rect x="62.3125" y="9.79077" width="37.3435" height="39.25" fill="#037DD6" stroke="white" stroke-width="2"/>
|
||||
</g>
|
||||
</svg>
|
||||
<svg width="162" height="47" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill="#fff" d="M.813.082h161v46h-161z"/><path d="m64.268 1.505 2.63 3.54 2.65-3.54h.84v7.1h-.92v-5.52l-2.56 3.44-2.56-3.44v5.52h-.93v-7.1h.85ZM74.257 8.705a2.73 2.73 0 0 1-1.06-.2 2.432 2.432 0 0 1-1.35-1.37 2.91 2.91 0 0 1-.18-1.03c0-.367.064-.707.19-1.02.127-.32.304-.596.53-.83.234-.233.51-.417.83-.55.32-.133.67-.2 1.05-.2.327 0 .634.057.92.17.287.107.537.27.75.49.22.213.394.477.52.79.127.307.19.66.19 1.06v.13c0 .034-.003.077-.01.13h-4.1c.007.233.054.45.14.65.094.2.214.373.36.52.154.147.334.263.54.35.214.08.444.12.69.12.387 0 .704-.077.95-.23.254-.16.457-.373.61-.64l.68.47c-.226.367-.53.657-.91.87-.373.213-.82.32-1.34.32Zm1.51-3.13a1.58 1.58 0 0 0-.19-.55c-.086-.16-.2-.296-.34-.41a1.42 1.42 0 0 0-.46-.26 1.639 1.639 0 0 0-.54-.09 1.728 1.728 0 0 0-1.04.35 1.498 1.498 0 0 0-.38.41 1.49 1.49 0 0 0-.22.55h3.17ZM79.928 8.705c-.353 0-.68-.066-.98-.2a2.57 2.57 0 0 1-.77-.56 2.732 2.732 0 0 1-.52-.83 2.8 2.8 0 0 1-.18-1.01c0-.36.06-.697.18-1.01.127-.313.3-.587.52-.82a2.36 2.36 0 0 1 1.75-.77c.38 0 .727.087 1.04.26.313.167.553.37.72.61v-3.27h.86v7.5h-.86v-.77c-.167.24-.407.447-.72.62a2.18 2.18 0 0 1-1.04.25Zm.13-.79a1.606 1.606 0 0 0 1.22-.52c.153-.167.27-.36.35-.58.087-.22.13-.457.13-.71 0-.253-.043-.49-.13-.71-.08-.22-.197-.41-.35-.57a1.542 1.542 0 0 0-.53-.39 1.657 1.657 0 0 0-.69-.14c-.253 0-.487.047-.7.14a1.65 1.65 0 0 0-.54.39c-.147.16-.263.35-.35.57-.08.22-.12.457-.12.71 0 .253.04.49.12.71.087.22.203.413.35.58.153.16.333.287.54.38.213.093.447.14.7.14ZM84.607 2.265a.599.599 0 0 1-.62-.61c0-.167.06-.31.18-.43s.266-.18.44-.18c.173 0 .317.06.43.18.113.12.17.263.17.43 0 .173-.057.32-.17.44a.583.583 0 0 1-.43.17Zm-.44 1.34h.86v5h-.86v-5ZM88.427 8.705c-.273 0-.523-.046-.75-.14-.227-.1-.42-.236-.58-.41a1.916 1.916 0 0 1-.38-.63 2.614 2.614 0 0 1-.13-.85v-3.07h.86v2.94c0 .42.1.753.3 1 .207.247.483.37.83.37.193 0 .373-.04.54-.12.173-.087.32-.207.44-.36.127-.16.227-.353.3-.58.073-.227.11-.483.11-.77v-2.48h.86v5h-.86v-.77a1.654 1.654 0 0 1-.66.66c-.267.14-.56.21-.88.21ZM98.888 5.665c0-.407-.083-.737-.25-.99-.166-.253-.413-.38-.74-.38-.4 0-.727.157-.98.47-.247.314-.377.74-.39 1.28v2.56h-.86v-2.94c0-.407-.083-.737-.25-.99-.16-.253-.403-.38-.73-.38-.407 0-.74.163-1 .49-.253.327-.38.774-.38 1.34v2.48h-.86v-5h.86v.77a1.63 1.63 0 0 1 .61-.63c.26-.16.56-.24.9-.24.374 0 .69.097.95.29.267.187.463.447.59.78.133-.327.343-.587.63-.78.293-.193.63-.29 1.01-.29.273 0 .517.05.73.15.22.094.404.23.55.41.153.173.27.387.35.64.08.247.12.524.12.83v3.07h-.86v-2.94Z" fill="#037DD6"/><path opacity=".3" d="M45.774 37.738c-10.764 7.42-19.417 8-19.417 8h110.251s-8.653-.58-19.417-8c-10.764-7.42-23.364-22-35.709-22-12.344 0-24.944 14.58-35.708 22Z" fill="#037DD6"/><mask id="a" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="26" y="15" width="111" height="31"><path d="M45.774 37.605c-10.764 7.42-19.417 8-19.417 8h110.251s-8.653-.58-19.417-8c-10.764-7.42-23.364-22-35.709-22-12.344 0-24.944 14.58-35.708 22Z" fill="#EAF6FF"/></mask><g mask="url(#a)"><path fill="#037DD6" stroke="#fff" stroke-width="2" d="M62.313 9.791h37.343v39.25H62.313z"/></g></svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 6.0 KiB After Width: | Height: | Size: 3.1 KiB |
@ -434,7 +434,6 @@ export default class TransactionController extends EventEmitter {
|
||||
gasLimit: defaultGasLimit,
|
||||
simulationFails,
|
||||
} = await this._getDefaultGasLimit(txMeta, getCodeResponse);
|
||||
const advancedGasFeeDefaultValues = this.getAdvancedGasFee();
|
||||
|
||||
// eslint-disable-next-line no-param-reassign
|
||||
txMeta = this.txStateManager.getTransaction(txMeta.id);
|
||||
@ -444,6 +443,7 @@ export default class TransactionController extends EventEmitter {
|
||||
|
||||
if (eip1559Compatibility) {
|
||||
const { eip1559V2Enabled } = this.preferencesStore.getState();
|
||||
const advancedGasFeeDefaultValues = this.getAdvancedGasFee();
|
||||
if (eip1559V2Enabled && Boolean(advancedGasFeeDefaultValues)) {
|
||||
txMeta.userFeeLevel = CUSTOM_GAS_ESTIMATE;
|
||||
txMeta.txParams.maxFeePerGas = decGWEIToHexWEI(
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { useSelector, useDispatch } from 'react-redux';
|
||||
|
||||
import { EDIT_GAS_MODES } from '../../../../../shared/constants/gas';
|
||||
import Box from '../../../ui/box';
|
||||
import Typography from '../../../ui/typography';
|
||||
import CheckBox from '../../../ui/check-box';
|
||||
@ -12,6 +13,7 @@ import {
|
||||
} from '../../../../helpers/constants/design-system';
|
||||
import { getAdvancedGasFeeValues } from '../../../../selectors';
|
||||
import { setAdvancedGasFee } from '../../../../store/actions';
|
||||
import { useGasFeeContext } from '../../../../contexts/gasFee';
|
||||
|
||||
import { useAdvancedGasFeePopoverContext } from '../context';
|
||||
import { useI18nContext } from '../../../../hooks/useI18nContext';
|
||||
@ -25,6 +27,7 @@ const AdvancedGasFeeDefaults = () => {
|
||||
maxPriorityFeePerGas,
|
||||
} = useAdvancedGasFeePopoverContext();
|
||||
const advancedGasFeeValues = useSelector(getAdvancedGasFeeValues);
|
||||
const { editGasMode } = useGasFeeContext();
|
||||
|
||||
const [isDefaultSettingsSelected, setDefaultSettingsSelected] = useState(
|
||||
Boolean(advancedGasFeeValues) &&
|
||||
@ -55,11 +58,15 @@ const AdvancedGasFeeDefaults = () => {
|
||||
}
|
||||
};
|
||||
|
||||
if (editGasMode === EDIT_GAS_MODES.SWAPS) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<Box
|
||||
display={DISPLAY.FLEX}
|
||||
flexDirection={FLEX_DIRECTION.ROW}
|
||||
marginRight={4}
|
||||
margin={[4, 2, 0, 2]}
|
||||
className="advanced-gas-fee-defaults"
|
||||
>
|
||||
<label className="advanced-gas-fee-defaults__label">
|
||||
@ -70,11 +77,11 @@ const AdvancedGasFeeDefaults = () => {
|
||||
disabled={hasErrors}
|
||||
/>
|
||||
<Typography variant={TYPOGRAPHY.H7} color={COLORS.UI4} margin={0}>
|
||||
{!isDefaultSettingsSelected && Boolean(advancedGasFeeValues)
|
||||
? t('advancedGasFeeDefaultOptIn', [
|
||||
{isDefaultSettingsSelected
|
||||
? t('advancedGasFeeDefaultOptOut')
|
||||
: t('advancedGasFeeDefaultOptIn', [
|
||||
<strong key="default-value-change">{t('newValues')}</strong>,
|
||||
])
|
||||
: t('advancedGasFeeDefaultOptOut')}
|
||||
])}
|
||||
</Typography>
|
||||
</label>
|
||||
</Box>
|
||||
|
||||
@ -1,7 +1,10 @@
|
||||
import React from 'react';
|
||||
import { fireEvent, screen } from '@testing-library/react';
|
||||
|
||||
import { GAS_ESTIMATE_TYPES } from '../../../../../shared/constants/gas';
|
||||
import {
|
||||
EDIT_GAS_MODES,
|
||||
GAS_ESTIMATE_TYPES,
|
||||
} from '../../../../../shared/constants/gas';
|
||||
import { renderWithProvider } from '../../../../../test/lib/render-helpers';
|
||||
import mockEstimates from '../../../../../test/data/mock-estimates.json';
|
||||
import mockState from '../../../../../test/data/mock-state.json';
|
||||
@ -24,7 +27,7 @@ jest.mock('../../../../store/actions', () => ({
|
||||
setAdvancedGasFee: jest.fn(),
|
||||
}));
|
||||
|
||||
const render = (defaultGasParams) => {
|
||||
const render = (defaultGasParams, contextParams) => {
|
||||
const store = configureStore({
|
||||
metamask: {
|
||||
...mockState.metamask,
|
||||
@ -45,6 +48,7 @@ const render = (defaultGasParams) => {
|
||||
transaction={{
|
||||
userFeeLevel: 'medium',
|
||||
}}
|
||||
{...contextParams}
|
||||
>
|
||||
<AdvancedGasFeePopoverContextProvider>
|
||||
<AdvancedGasFeeInputs />
|
||||
@ -57,11 +61,7 @@ const render = (defaultGasParams) => {
|
||||
describe('AdvancedGasFeeDefaults', () => {
|
||||
it('should renders correct message when the default is not set', () => {
|
||||
render({ advancedGasFee: null });
|
||||
expect(
|
||||
screen.queryByText(
|
||||
'Always use these values and advanced setting as default.',
|
||||
),
|
||||
).toBeInTheDocument();
|
||||
expect(screen.queryByText('new values')).toBeInTheDocument();
|
||||
});
|
||||
it('should renders correct message when the default values are set', () => {
|
||||
render({
|
||||
@ -73,22 +73,6 @@ describe('AdvancedGasFeeDefaults', () => {
|
||||
),
|
||||
).toBeInTheDocument();
|
||||
});
|
||||
it('should renders correct message when checkbox is selected and default values are saved', () => {
|
||||
render({
|
||||
advancedGasFee: null,
|
||||
});
|
||||
expect(
|
||||
screen.queryByText(
|
||||
'Always use these values and advanced setting as default.',
|
||||
),
|
||||
).toBeInTheDocument();
|
||||
fireEvent.change(document.getElementsByTagName('input')[0], {
|
||||
target: { value: 100 },
|
||||
});
|
||||
fireEvent.change(document.getElementsByTagName('input')[1], {
|
||||
target: { value: 4 },
|
||||
});
|
||||
});
|
||||
it('should renders correct message when the default values are set and the maxBaseFee values are updated', () => {
|
||||
render({
|
||||
advancedGasFee: { maxBaseFee: 50, priorityFee: 2 },
|
||||
@ -144,4 +128,11 @@ describe('AdvancedGasFeeDefaults', () => {
|
||||
fireEvent.click(checkbox);
|
||||
expect(mock).toHaveBeenCalledTimes(2);
|
||||
});
|
||||
|
||||
it('should not render option to set default gas options in a swaps transaction', () => {
|
||||
render({}, { editGasMode: EDIT_GAS_MODES.SWAPS });
|
||||
expect(
|
||||
document.querySelector('input[type=checkbox]'),
|
||||
).not.toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
||||
@ -1,7 +1,10 @@
|
||||
.advanced-gas-fee-defaults {
|
||||
border-top: 1px solid var(--ui-grey);
|
||||
padding-top: 16px;
|
||||
|
||||
& &__checkbox {
|
||||
font-size: $font-size-h4;
|
||||
margin: 0 8px 0 8px;
|
||||
margin: 0 8px;
|
||||
}
|
||||
|
||||
&__label {
|
||||
|
||||
@ -64,7 +64,7 @@ const AdvancedGasFeeGasLimit = () => {
|
||||
tag={TYPOGRAPHY.Paragraph}
|
||||
variant={TYPOGRAPHY.H7}
|
||||
className="advanced-gas-fee-gas-limit"
|
||||
margin={[0, 2]}
|
||||
margin={[4, 2, 0, 2]}
|
||||
>
|
||||
<strong>
|
||||
<I18nValue messageKey="gasLimitV2" />
|
||||
|
||||
@ -2,6 +2,8 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
white-space: nowrap;
|
||||
border-top: 1px solid var(--ui-grey);
|
||||
padding-top: 16px;
|
||||
|
||||
> * {
|
||||
margin-right: 4px;
|
||||
|
||||
@ -8,7 +8,6 @@ const AdvancedGasFeeInputs = () => {
|
||||
return (
|
||||
<Box className="advanced-gas-fee-inputs">
|
||||
<BaseFeeInput />
|
||||
<div className="advanced-gas-fee-inputs__separator" />
|
||||
<PriorityFeeInput />
|
||||
</Box>
|
||||
);
|
||||
|
||||
@ -6,9 +6,4 @@
|
||||
.form-field__heading-title > h6 {
|
||||
font-size: $font-size-h7;
|
||||
}
|
||||
|
||||
&__separator {
|
||||
border-top: 1px solid var(--ui-grey);
|
||||
margin: 16px 0;
|
||||
}
|
||||
}
|
||||
|
||||
@ -0,0 +1,4 @@
|
||||
.priority-fee-input {
|
||||
border-top: 1px solid var(--ui-grey);
|
||||
padding-top: 16px;
|
||||
}
|
||||
@ -98,7 +98,7 @@ const PriorityFeeInput = () => {
|
||||
]);
|
||||
|
||||
return (
|
||||
<Box margin={[0, 2]}>
|
||||
<Box margin={[4, 2, 0, 2]} className="priority-fee-input">
|
||||
<FormField
|
||||
dataTestId="priority-fee-input"
|
||||
error={priorityFeeError ? t(priorityFeeError) : ''}
|
||||
|
||||
@ -29,9 +29,7 @@ const AdvancedGasFeePopover = () => {
|
||||
>
|
||||
<Box margin={4}>
|
||||
<AdvancedGasFeeInputs />
|
||||
<div className="advanced-gas-fee-popover__separator" />
|
||||
<AdvancedGasFeeDefaults />
|
||||
<div className="advanced-gas-fee-popover__separator" />
|
||||
<AdvancedGasFeeGasLimit />
|
||||
</Box>
|
||||
</Popover>
|
||||
|
||||
@ -1,9 +1,4 @@
|
||||
.advanced-gas-fee-popover {
|
||||
&__separator {
|
||||
border-top: 1px solid var(--ui-grey);
|
||||
margin: 16px 0;
|
||||
}
|
||||
|
||||
.form-field__heading-title > h6 {
|
||||
font-size: $font-size-h7;
|
||||
}
|
||||
|
||||
@ -72,6 +72,7 @@
|
||||
@import 'advanced-gas-fee-popover/advanced-gas-fee-gas-limit/index';
|
||||
@import 'advanced-gas-fee-popover/advanced-gas-fee-inputs/index';
|
||||
@import 'advanced-gas-fee-popover/advanced-gas-fee-inputs/base-fee-input/index';
|
||||
@import 'advanced-gas-fee-popover/advanced-gas-fee-inputs/priority-fee-input/index';
|
||||
@import 'advanced-gas-fee-popover/advanced-gas-fee-input-subtext/index';
|
||||
@import 'advanced-gas-fee-popover/advanced-gas-fee-defaults/index';
|
||||
@import 'currency-input/index';
|
||||
|
||||
@ -6,6 +6,7 @@
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
z-index: 1;
|
||||
|
||||
&__inner {
|
||||
width: 50px;
|
||||
|
||||
@ -142,7 +142,7 @@ const CancelSpeedupPopover = () => {
|
||||
marginTop={4}
|
||||
>
|
||||
<Box className="cancel-speedup-popover__edit-gas-button">
|
||||
<EditGasFeeButton />
|
||||
{!appIsLoading && <EditGasFeeButton />}
|
||||
</Box>
|
||||
<Box className="cancel-speedup-popover__gas-details">
|
||||
<GasDetailsItem />
|
||||
|
||||
@ -54,7 +54,7 @@ export default function EditGasFeeButton({ userAcknowledgedGasMissing }) {
|
||||
>
|
||||
{icon && (
|
||||
<span className="edit-gas-fee-button__icon">
|
||||
{`${PRIORITY_LEVEL_ICON_MAP[icon]} `}
|
||||
{PRIORITY_LEVEL_ICON_MAP[icon]}
|
||||
</span>
|
||||
)}
|
||||
<span className="edit-gas-fee-button__label">{t(title)}</span>
|
||||
|
||||
@ -22,6 +22,7 @@
|
||||
|
||||
&__icon {
|
||||
font-size: 16px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
&__label {
|
||||
|
||||
@ -9,6 +9,7 @@ import {
|
||||
FONT_WEIGHT,
|
||||
TYPOGRAPHY,
|
||||
} from '../../../../helpers/constants/design-system';
|
||||
import { isMetamaskSuggestedGasEstimate } from '../../../../helpers/utils/gas';
|
||||
import { roundToDecimalPlacesRemovingExtraZeroes } from '../../../../helpers/utils/util';
|
||||
import Typography from '../../../ui/typography';
|
||||
|
||||
@ -88,15 +89,20 @@ const EditGasToolTip = ({
|
||||
imgAltText = t('curveHighGasEstimate');
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="edit-gas-tooltip__container">
|
||||
{priorityLevel !== PRIORITY_LEVELS.CUSTOM &&
|
||||
priorityLevel !== PRIORITY_LEVELS.DAPP_SUGGESTED &&
|
||||
// Gas estimate curve is visible for low/medium/high gas estimates
|
||||
// the curve is not visible for high estimates for swaps
|
||||
// also it is not visible in case of cancel/speedup if the medium/high option is disabled
|
||||
const showGasEstimateCurve =
|
||||
isMetamaskSuggestedGasEstimate(priorityLevel) &&
|
||||
!(
|
||||
priorityLevel === PRIORITY_LEVELS.HIGH &&
|
||||
editGasMode === EDIT_GAS_MODES.SWAPS
|
||||
) &&
|
||||
!estimateGreaterThanGasUse ? (
|
||||
!estimateGreaterThanGasUse;
|
||||
|
||||
return (
|
||||
<div className="edit-gas-tooltip__container">
|
||||
{showGasEstimateCurve ? (
|
||||
<img alt={imgAltText} src={`./images/curve-${priorityLevel}.svg`} />
|
||||
) : null}
|
||||
{toolTipMessage && (
|
||||
|
||||
@ -1,8 +1,4 @@
|
||||
.edit-gas-tooltip {
|
||||
display: inline-block;
|
||||
text-align: right;
|
||||
width: 10%;
|
||||
|
||||
&__container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
@ -10,6 +6,7 @@
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-width: 160px;
|
||||
|
||||
img {
|
||||
margin-bottom: 8px;
|
||||
@ -28,6 +25,7 @@
|
||||
}
|
||||
|
||||
&__label {
|
||||
white-space: nowrap;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
|
||||
@ -3,7 +3,7 @@ import classNames from 'classnames';
|
||||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
|
||||
import { isVolatileGasEstimate } from '../../../helpers/utils/gas';
|
||||
import { isMetamaskSuggestedGasEstimate } from '../../../helpers/utils/gas';
|
||||
import { getGasLoadingAnimationIsShowing } from '../../../ducks/app/app';
|
||||
import { useShouldAnimateGasEstimations } from '../../../hooks/useShouldAnimateGasEstimations';
|
||||
|
||||
@ -19,7 +19,7 @@ export default function LoadingHeartBeat({
|
||||
|
||||
if (
|
||||
process.env.IN_TEST ||
|
||||
(estimateUsed && !isVolatileGasEstimate(estimateUsed))
|
||||
(estimateUsed && !isMetamaskSuggestedGasEstimate(estimateUsed))
|
||||
) {
|
||||
return null;
|
||||
}
|
||||
|
||||
@ -55,7 +55,7 @@ export function addTenPercentAndRound(hexStringValue) {
|
||||
return addTenPercent(hexStringValue, { numberOfDecimals: 0 });
|
||||
}
|
||||
|
||||
export function isVolatileGasEstimate(estimate) {
|
||||
export function isMetamaskSuggestedGasEstimate(estimate) {
|
||||
return [
|
||||
GAS_RECOMMENDATIONS.HIGH,
|
||||
GAS_RECOMMENDATIONS.MEDIUM,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user