From 336f9b57999cf425ddda9ddf234831ffccad7bab Mon Sep 17 00:00:00 2001
From: Gregor Kleen <kleen@cip.ifi.lmu.de>
Date: Tue, 27 Aug 2019 09:45:30 +0200
Subject: [PATCH] style(ribbon): responsiveness

---
 templates/default-layout.lucius        | 7 +++++--
 templates/widgets/navbar/navbar.lucius | 1 +
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/templates/default-layout.lucius b/templates/default-layout.lucius
index 99dd61366..44baa25d9 100644
--- a/templates/default-layout.lucius
+++ b/templates/default-layout.lucius
@@ -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);
   }
 }
diff --git a/templates/widgets/navbar/navbar.lucius b/templates/widgets/navbar/navbar.lucius
index ce25a3588..c3885f975 100644
--- a/templates/widgets/navbar/navbar.lucius
+++ b/templates/widgets/navbar/navbar.lucius
@@ -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) {