Added the ability to hide sidebar in ViewMedia

1 files changed, 16 insertions, 1 deletions

diff --git a/Pages/ViewMedia.razor.css b/Pages/ViewMedia.razor.css
index 89ab2a7..16f86ec 100644
--- a/Pages/ViewMedia.razor.css
+++ b/Pages/ViewMedia.razor.css
@@ -6,9 +6,10 @@
 
 div#image-container {
     box-sizing: border-box;
+    flex:       1 0 0;
     height:     100%;
     padding:    var(--size-default-gap);
-    width:      calc(100% - 700px);
+    width:      100%;
 }
 
 div#image-container > img {
@@ -28,13 +29,27 @@ div#metadata {
     box-sizing:     border-box;
     display:        flex;
     flex-direction: column;
+    flex:           0 0 auto;
     height:         100%;
     margin-left:    auto;
     padding:        30px;
+    transition:     margin-right 0.1s linear;
     width:          700px;
     z-index:        90;
 }
 
+div#metadata.hidden {
+    box-shadow:   none;
+    margin-right: -700px;
+}
+
+@media (max-aspect-ratio: 4/3) {
+    div#metadata {
+        box-shadow:   none;
+        margin-right: -700px;
+    }
+}
+
 div#button-container {
     margin-top: auto;
 }