From 58f7b1be7c1ce366eabae3b172de732f0122776b Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Mon, 25 Oct 2021 16:22:49 +0200
Subject: chore: print the project preview & details on click

On small viewport, hide the project details and display it when the
user clicks on toolbar button. So I adjust the toolbar z-index and the
preview height.
---
 htdocs/src/scss/layout/_main.scss    | 2 +-
 htdocs/src/scss/layout/_toolbar.scss | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

(limited to 'htdocs/src/scss/layout')

diff --git a/htdocs/src/scss/layout/_main.scss b/htdocs/src/scss/layout/_main.scss
index 9adb18d..8118d9b 100644
--- a/htdocs/src/scss/layout/_main.scss
+++ b/htdocs/src/scss/layout/_main.scss
@@ -35,7 +35,7 @@
 
 .project-preview {
   background: fun.get-var(color-bg);
-  flex: 1;
+  flex: 0 1 calc(100% - #{fun.get-var(toolbar-height)});
   width: 100%;
 
   @include mix.media("screen") {
diff --git a/htdocs/src/scss/layout/_toolbar.scss b/htdocs/src/scss/layout/_toolbar.scss
index 585b3e6..c96bd1d 100644
--- a/htdocs/src/scss/layout/_toolbar.scss
+++ b/htdocs/src/scss/layout/_toolbar.scss
@@ -13,6 +13,7 @@
   left: 0;
   position: absolute;
   right: 0;
+  z-index: 2;
 
   & > &__options {
     background: fun.get-var(color-primary);
-- 
cgit v1.2.3