components/UpgradeBrowserOverlay/UpgradeBrowserOverlay.module.css
.UpgradeBrowserOverlay {
background: #f0f2f2;
border-radius: 4px;
border: 6px solid grey;
font-size: 2em;
left: 50%;
outline: none;
overflow: auto;
padding: 20px;
position: absolute;
text-align: center;
top: 50%;
transform: translate(-50%, -50%);
width: var(--typicalMaxWidth);
}
.overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: white;
}
.warningLogo {
fill: #d1665a;
width: 100px;
}
.message {
font-size: 1rem;
padding: 0.5rem 0;
}
.browsersList {
display: flex;
justify-content: space-around;
padding: 1rem 0;
}
.browser {
align-items: center;
display: flex;
flex-direction: column;
font-size: 1rem;
font-weight: bold;
justify-content: center;
padding: 0.5rem;
}
.browserName {
padding-bottom: 0.5rem;
}
.browser:hover .browserName {
text-decoration: underline;
}
.browserImage {
width: 100px;
height: 100px;
}