35 lines
1.1 KiB
SCSS
35 lines
1.1 KiB
SCSS
|
@import 'src/_variables.scss';
|
||
|
|
.UpdateNotificationModal {
|
||
|
|
/* Explanation:
|
||
|
|
* Modal is positioned vertically centered.
|
||
|
|
* 100vh - 100% = Distance between modal's top+bottom boundaries and screen
|
||
|
|
* (100vh - 100%) / 2 = Distance between bottom (or top) boundary and screen
|
||
|
|
* + 10% - we move modal completely off-screen, it's top boundary touches
|
||
|
|
* bottom of the screen
|
||
|
|
* - 50px - leaving tiny amount of space so that titlebar + tiny amount of modal is visible
|
||
|
|
*/
|
||
|
|
transform: translateY(calc(((100vh - 100%) / 2 + 5%)));
|
||
|
|
max-width: 90vh;
|
||
|
|
width: 30em;
|
||
|
|
position: relative;
|
||
|
|
|
||
|
|
@media all and (max-width: 800px) {
|
||
|
|
/* For mobile, the modal takes 100% of the available screen.
|
||
|
|
This ensures the minimized modal is always 50px above the browser bottom bar regardless of whether or not it is visible.
|
||
|
|
*/
|
||
|
|
transform: translateY(calc(100% - 50px));
|
||
|
|
}
|
||
|
|
.panel-body > p {
|
||
|
|
width: calc(100% - 10em)
|
||
|
|
}
|
||
|
|
|
||
|
|
.pleroma-tan {
|
||
|
|
max-width: 20em;
|
||
|
|
max-height: 40em;
|
||
|
|
position: absolute;
|
||
|
|
right: -5em;
|
||
|
|
top: -10em;
|
||
|
|
z-index: 10;
|
||
|
|
}
|
||
|
|
}
|