From b0cc777bb314ecab05024b68ac5d0c9876551a89 Mon Sep 17 00:00:00 2001
From: amphineko <sukareki@gmail.com>
Date: Sat, 21 Mar 2020 20:20:04 +0800
Subject: [PATCH] reduce visual elements on mobile devices

---
 src/index.css | 23 +++++++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/src/index.css b/src/index.css
index 6529e6e..e9e5888 100644
--- a/src/index.css
+++ b/src/index.css
@@ -35,6 +35,7 @@ html {
 
 #container {
     background: url(./assets/images/container-background.svg) grey;
+    background-size: cover;
     box-shadow: 0 0 0.15em 0.15em rgba(0, 0, 0, 0.125);
     padding: 1em 0;
     margin: 0 auto;
@@ -60,3 +61,25 @@ html {
 .identities .small-labels .group::before, .identities .small-labels .label::before {
     color: #333;
 }
+
+@media (max-width: 768px) {
+    body {
+        padding: 0;
+    }
+
+    #container {
+        padding: 0;
+    }
+
+    #container, #container>*:first-child {
+        border-top-left-radius: 0;
+    }
+
+    #container, #container>*:last-child, #container>*:last-child>*:last-child {
+        border-bottom-right-radius: 0;
+    }
+
+    .section.header {
+        background: rgba(0, 0, 0, 0.75);
+    }
+}