style(ribbon): responsiveness
This commit is contained in:
parent
c2e13cf4df
commit
336f9b5799
@ -699,6 +699,7 @@ section {
|
||||
.ribbon {
|
||||
position: fixed;
|
||||
top: calc(40px + var(--header-height));
|
||||
transition: all .2s cubic-bezier(0.03, 0.43, 0.58, 1);
|
||||
right: -63px;
|
||||
transform: rotate(45deg);
|
||||
width: 250px;
|
||||
@ -713,8 +714,10 @@ section {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
@media (max-height: 500px) {
|
||||
@media (max-width: 768px) {
|
||||
.ribbon {
|
||||
top: calc(25px + var(--header-height-collapsed));
|
||||
top: calc(20px + var(--header-height-collapsed));
|
||||
right: -83px;
|
||||
transform: rotate(45deg) scale(0.6);
|
||||
}
|
||||
}
|
||||
|
||||
@ -10,6 +10,7 @@
|
||||
width: 20px;
|
||||
z-index: 50;
|
||||
background-image: linear-gradient(to left, rgba(0, 0, 0, 0.4), transparent);
|
||||
transition: height .2s cubic-bezier(0.03, 0.43, 0.58, 1);
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user