Made a bit more mobile friendly

feltocraig · Jul 9, 2024 · 12659cf · 12659cf
1 parent b1d499a
commit 12659cf
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 4 deletions.
diff --git a/index.html b/index.html
@@ -3,14 +3,15 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Craig And Jess</title>
+    <title>CraigAndJess.com</title>
     <link rel="stylesheet" href="styles.css">
 </head>
 <body>
     <div class="center">
         <div class="content">
             <img src="jax.png" alt="Jax" class="spin">
-            <p class="coming-soon">Coming Soon...</p>
+            <p class="coming-soon">Coming Soon</p>
         </div>
+    </div>
 </body>
-</html>
+</html>
diff --git a/styles.css b/styles.css
@@ -11,14 +11,18 @@ body, html {
     display: flex;
     justify-content: center;
     align-items: center;
+    padding: 10px;
 }
 
 .content {
     text-align: center;
+    max-width: 100%;
 }
 
 .spin {
     animation: spin 4s linear infinite;
+    width: 100%;
+    max-width: 300px; /* Limit the max width for larger screens */
 }
 
 .coming-soon {
@@ -29,8 +33,14 @@ body, html {
     margin-top: 20px;
     text-align: center;
 }
-
 @keyframes spin {
     0% { transform: rotate(0deg); }
     100% { transform: rotate(360deg); }
 }
+
+/* Responsive Design */
+@media (max-width: 600px) {
+    .coming-soon {
+        font-size: 30pt;
+    }
+}