Codex
55 lines
1.2 KiB
CSS
55 lines
1.2 KiB
CSS
.wrapper {
|
|
position: relative;
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
width: 100%;
|
|
min-height: var(--app-viewport-height, 100dvh);
|
|
overflow: hidden;
|
|
}
|
|
|
|
.imageScrim {
|
|
position: absolute;
|
|
inset: 0;
|
|
background: rgba(25, 17, 23, 0.08);
|
|
box-shadow:
|
|
inset 0 -290px 150px -145px rgba(20, 12, 18, 0.78),
|
|
inset 0 110px 90px -90px rgba(11, 8, 10, 0.42);
|
|
z-index: 1;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.favoriteAction {
|
|
position: absolute;
|
|
top: calc(var(--page-padding-y, 20px) + var(--app-safe-top, 0px));
|
|
right: calc(var(--page-padding-x, 20px) + var(--app-safe-right, 0px));
|
|
z-index: 4;
|
|
}
|
|
|
|
.content {
|
|
position: relative;
|
|
z-index: 2;
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex: 1;
|
|
padding:
|
|
calc(var(--page-padding-y, 20px) + var(--app-safe-top, 0px))
|
|
calc(var(--page-padding-x, 26px) + var(--app-safe-right, 0px))
|
|
calc(
|
|
var(--spacing-md, 12px) + var(--app-safe-bottom, 0px) +
|
|
var(--app-bottom-nav-height, 64px)
|
|
)
|
|
calc(var(--page-padding-x, 26px) + var(--app-safe-left, 0px));
|
|
}
|
|
|
|
.spacer {
|
|
flex: 1 1 auto;
|
|
}
|
|
|
|
.bottomStack {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: clamp(12px, 3.6vw, 18px);
|
|
padding-bottom: clamp(12px, 3.6vw, 18px);
|
|
}
|