mirror of
https://github.com/Stremio/stremio-web.git
synced 2026-03-11 21:27:05 +00:00
refactor(Addons): styles
- removed use of px - creates less native variables -removed unnecessary vars
This commit is contained in:
parent
dd8791d589
commit
d7776f6d98
1 changed files with 13 additions and 16 deletions
|
|
@ -21,35 +21,34 @@
|
|||
filters-modal-content: modal-dialog-content;
|
||||
}
|
||||
|
||||
@selectable-inputs-assumed-height: 5.25rem;
|
||||
@top-overlay-size: @selectable-inputs-assumed-height;
|
||||
@bottom-overlay-size: calc(1.5rem + env(safe-area-inset-bottom, 0rem));
|
||||
@overlap-size: 3rem;
|
||||
@transparency-grandient-pad: 6rem;
|
||||
|
||||
.addons-container {
|
||||
height: 100%;
|
||||
background-color: transparent;
|
||||
|
||||
.addons-content {
|
||||
--selectable-inputs-assumed-height: 84px;
|
||||
--top-overlay-size: var(--selectable-inputs-assumed-height);
|
||||
--bottom-vertical-nav-bar-size: 0px;
|
||||
--bottom-overlay-size: calc(var(--bottom-vertical-nav-bar-size) + env(safe-area-inset-bottom, 0px));
|
||||
--overlap-size: 3rem;
|
||||
--transparency-grandient-pad: 6rem;
|
||||
|
||||
width: 100%;
|
||||
height: calc(100% + var(--bottom-overlay-size));
|
||||
margin-bottom: calc(var(--bottom-overlay-size) * -1);
|
||||
height: calc(100% + @bottom-overlay-size);
|
||||
margin-bottom: calc(@bottom-overlay-size * -1);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-self: stretch;
|
||||
|
||||
.addons-list-container {
|
||||
margin-top: calc(var(--selectable-inputs-assumed-height) * -1);
|
||||
margin-top: calc(@selectable-inputs-assumed-height * -1);
|
||||
padding: 0 1.5rem;
|
||||
padding-top: var(--selectable-inputs-assumed-height);
|
||||
padding-bottom: var(--bottom-overlay-size, 0px);
|
||||
padding-top: @selectable-inputs-assumed-height;
|
||||
padding-bottom: @bottom-overlay-size;
|
||||
|
||||
mask: linear-gradient(
|
||||
to bottom,
|
||||
transparent calc(var(--top-overlay-size) - var(--overlap-size)),
|
||||
black calc(var(--top-overlay-size) + var(--transparency-grandient-pad)),
|
||||
transparent calc(@top-overlay-size - @overlap-size),
|
||||
black calc(@top-overlay-size + @transparency-grandient-pad),
|
||||
black 100%
|
||||
);
|
||||
z-index: 1;
|
||||
|
|
@ -301,8 +300,6 @@
|
|||
@media only screen and (max-width: @minimum) {
|
||||
.addons-container {
|
||||
.addons-content {
|
||||
--bottom-vertical-nav-bar-size: var(--vertical-nav-bar-size);
|
||||
|
||||
.selectable-inputs-container {
|
||||
.add-button-container {
|
||||
z-index: 1;
|
||||
|
|
|
|||
Loading…
Reference in a new issue