mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-11-22 09:57:02 +01:00
c25d9c968e
* Updating ModalContent styles and padding to allow for dynamic resizing of content that allows scrolling within the modal. This commit also updates the AccountListMenu so the account list can resize dynamically to take up all screen space available * Updating the scroll bar styles from default for the ModalContent component so the scrollbar is thinner and more sleek
41 lines
1019 B
SCSS
41 lines
1019 B
SCSS
.mm-modal-content {
|
|
position: fixed;
|
|
left: 0;
|
|
top: 0;
|
|
z-index: $modal-z-index;
|
|
overflow: auto;
|
|
overscroll-behavior-y: none;
|
|
|
|
// Scroll bar styles
|
|
// Firefox
|
|
scrollbar-width: thin;
|
|
scrollbar-color: var(--color-icon-muted) transparent;
|
|
|
|
// Webkit: Chrome, Brave
|
|
::-webkit-scrollbar {
|
|
width: 8px;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
-webkit-border-radius: 8px;
|
|
border-radius: 8px;
|
|
background: var(--color-icon-muted);
|
|
}
|
|
|
|
&__dialog {
|
|
--modal-content-size: var(--size, 360px);
|
|
|
|
// Currently there is only use case size of ModalContent dialog in the extension
|
|
// See audit https://www.figma.com/file/hxYqloYgmVcgsoiVqmGZ8K/Modal-Audit?node-id=481%3A244&t=XITeuRB1pRc09hiG-1
|
|
// Not to say there won't be more in the future, but to prevent redundant code there is only one for now
|
|
&--size-sm {
|
|
--size: 360px;
|
|
|
|
max-width: var(--modal-content-size);
|
|
}
|
|
|
|
position: relative;
|
|
box-shadow: var(--shadow-size-lg) var(--color-shadow-default);
|
|
}
|
|
}
|