1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-05 23:44:56 +01:00
metamask-extension/ui/pages/settings/flask/view-snap/index.scss

132 lines
2.4 KiB
SCSS
Raw Normal View History

.view-snap {
padding: 12px 18px;
@media screen and (min-width: $break-large) {
padding: 12px;
}
&__subheader {
padding: 16px 4px;
border-bottom: 1px solid var(--color-border-muted);
margin-inline-end: 24px;
height: 72px;
align-items: center;
display: flex;
flex-flow: row nowrap;
@media screen and (max-width: $break-small) {
margin-inline-end: 0;
padding: 0 0 16px;
flex-direction: column;
align-items: center;
gap: 8px;
height: max-content;
}
}
&__install-details {
border-bottom: 1px solid var(--color-border-muted);
margin-inline-end: 24px;
@media screen and (max-width: $break-small) {
margin-inline-end: 0;
}
}
&__version {
font-family: monospace;
}
&__title {
@media screen and (max-width: $break-small) {
padding-bottom: 16px;
}
}
&__pill-toggle-container {
align-items: center;
display: flex;
flex-grow: 1;
@media screen and (max-width: $break-small) {
width: 100%;
justify-content: space-between;
}
}
&__pill-container {
@media screen and (max-width: $break-small) {
padding-left: 0;
display: inline-block;
}
}
&__toggle-container {
margin-left: auto;
@media screen and (max-width: $break-small) {
padding-left: 0;
display: inline-block;
}
}
&__toggle-button {
margin-right: -12px;
}
&__content-container {
@media screen and (max-width: $break-small) {
width: 100%;
}
}
&__section {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
border-bottom: 1px solid var(--color-border-muted);
padding-bottom: 16px;
margin-bottom: 16px;
@media screen and (max-width: $break-small) {
height: initial;
padding: 5px 0 16px;
}
.connected-sites-list__content-row {
border-top: none;
2022-03-25 16:07:47 +01:00
border-bottom: 1px solid var(--color-border-muted);
&:last-child {
border-bottom: none;
}
}
&:last-child {
margin-bottom: 0;
border-bottom: none;
}
}
&__permission-list {
padding-bottom: 0;
.permission {
padding-top: 16px;
&:last-child {
border-bottom: none;
}
}
}
&__remove-button {
max-width: 175px;
@media screen and (max-width: $break-small) {
align-self: center;
}
}
}