resume: center vertically + add shadow on grey background

matt-meeks · Sep 28, 2023 · 5a4cf7d · 5a4cf7d
1 parent 4ec70c9
commit 5a4cf7d
Showing 1 changed file with 17 additions and 8 deletions.
diff --git a/resume/index.html b/resume/index.html
@@ -4,26 +4,39 @@
 <head>
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <style>
+        html {
+            height: 100%;
+            background: #222;
+        }
+
         body {
+            display: grid;
+            grid-template-rows: 1fr;
+            align-items: center;
+
             width: 8.5in;
-            height: 11in;
-            max-height: 11in;
             margin: auto;
-            padding: 0.25in;
             box-sizing: border-box;
             font-size: 11pt;
             overflow: auto;
-            background: white;
+            vertical-align: middle;
+            height: 100%;
         }
 
         body>div {
+            padding: 0.25in;
+            background: white;
+            height: 11in;
+            max-height: 11in;
             display: grid;
             grid-template-areas:
                 "header header"
                 "blurb blurb"
                 "sidebar content";
             grid-template-columns: 300px auto;
             grid-template-rows: auto auto 1fr;
+
+            box-shadow: 0.125in 0.125in 0.5in black;
         }
 
         ul {
@@ -91,10 +104,6 @@
             margin-top: 0;
         }
 
-        html {
-            background: black;
-        }
-
         .item-grid {
             display: grid;
             grid-template-columns: 1fr auto;