Adrien Maston
b815fdc49b
* mobile-app/scoped-styles: Replace android and ios css layers with platform layer Change how show-on-native works Use the correct css layers for Android and iOS
37 lines
1.1 KiB
CSS
37 lines
1.1 KiB
CSS
@layer native {
|
|
[data-platform~=native] {
|
|
/* The mobile apps may inject their own custom insets based on native elements on screen, like a floating navigation */
|
|
--custom-safe-inset-top: var(--injected-safe-inset-top, env(safe-area-inset-top, 0px));
|
|
--custom-safe-inset-right: var(--injected-safe-inset-right, env(safe-area-inset-right, 0px));
|
|
--custom-safe-inset-bottom: var(--injected-safe-inset-bottom, env(safe-area-inset-bottom, 0px));
|
|
--custom-safe-inset-left: var(--injected-safe-inset-left, env(safe-area-inset-left, 0px));
|
|
|
|
.hide-on-native {
|
|
display: none;
|
|
}
|
|
|
|
/* Header
|
|
/* ------------------------------------------------------------------------ */
|
|
|
|
.header:is(
|
|
:not(:has(.header__actions)),
|
|
:not(:has(.header__actions--end)):has(.header__actions--start .btn--back:only-child)
|
|
) {
|
|
display: none;
|
|
}
|
|
|
|
.header__actions {
|
|
.btn--back {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
/* Card perma
|
|
/* ------------------------------------------------------------------------ */
|
|
|
|
.card-perma {
|
|
margin-block-start: 0;
|
|
}
|
|
}
|
|
}
|