I hate mobile phones, got the site responsive on them now

AFitzy17 · Aug 5, 2024 · e0c4d37 · e0c4d37
1 parent c0d9ddd
commit e0c4d37
Show file tree

Hide file tree

Showing 2 changed files with 58 additions and 16 deletions.
diff --git a/css/style.css b/css/style.css
@@ -3,28 +3,28 @@
 @import url('https://fonts.googleapis.com/css2?family=Gupter:wght@400;500;700&family=Lancelot&family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
 
 body {
-	background-color: #e4e1e5;
+	background-color: #2e2e2e;
 	font-family: "Merriweather", serif;
 	margin: auto;
-	color: #001123;
-	background-image: linear-gradient(#ddd,#fff);
+	color: white;
 }
 
 /* Nav */
 
 .navbar {
+	font-size: 1.5em;
 	width: 100%;
     box-shadow: 0 1px 5px #ccc;
 	font-weight: 900;
 	text-transform: uppercase;
 }
 
 .navbar-brand{
-	font-size: 2em;
+	font-size: 1.5em;
 }
 #navbarSupportedContent1{
 	font-family: "Gupter", serif;
-	font-size: 2em;
+	font-size: 1.2em;
 }
 
 .navbar-nav li{
@@ -80,11 +80,11 @@ main h1, main h2 {
 	font-weight: 900;
 	text-transform: uppercase;
 	letter-spacing: 0.15em;
-	font-size: 4em;
+	font-size: 5em;
 }
 
 .jumbotron p{
-	font-size: 2em;
+	font-size: 2.5em;
 }
 
 .jumbotron .btn{
@@ -100,9 +100,21 @@ main h1, main h2 {
 	letter-spacing: 0.12em;
 }
 
-#details, #transportation {
-	background-color: #2e2e2e;
+.fuckmobiles {
+	font-family: "Merriweather", sans-serif;
+	padding: 1em;
+	font-size: 2em;
+	text-align: center;
+	font-weight: 700;
+	text-transform: uppercase;
+	letter-spacing: 0.12em;
 	color: white;
+	display: none;
+}
+
+#locations {
+	background-color: white;
+	color: #001123;
 }
 
 .locations, .locations h3 {
@@ -121,17 +133,46 @@ main h1, main h2 {
 	}
 }
 
-@media (max-width: 800px) {
+@media (max-width: 710px) {
 	iframe {
-		width: 430px;
+		width: 320px;
+	}
+	.navbar {
+		font-size: 1em;
+	}
+	.jumbotron h1, .jumbotron h2 {
+		font-size: 2em;
+	}
+	.jumbotron p{
+	font-size: 1.5em;
+	}
+	.title{
+		padding: 1em;
+		font-size: 2em;
+		text-align: center;
+		font-weight: 700;
+		text-transform: uppercase;
+		letter-spacing: 0.12em;
+	}
+	.text {
+		font-size: 1em;
+		padding-bottom: 2em;
+	}
+	.jumbotron h1, .jumbotron p, .jumbotron a, .jumbotron hr {
+		display: none;
+	}
+
+	.fuckmobiles {
+		display: block;
 	}
 }
 
 /* Footer */
 
 footer {
-	margin-top: -1em;
 	padding-top: 3em;
+	background-color: white;
+	color: #001123;
 }
 
 .footer-content {
@@ -147,7 +188,7 @@ footer {
 }
 
 .footer-nav a {
-	color: black;
+	color: #001123;
 	text-decoration: underline;
 }
 

diff --git a/index.html b/index.html
@@ -28,6 +28,7 @@
       </div>
     </nav>
     </header>
+	  <h1 class="fuckmobiles">Susan &amp; Kevin</h1>
 	  <div id="wedding-carousel" class="carousel slide" data-ride="carousel">
 		  <ol class="carousel-indicators">
 			<li data-target="#wedding-carousel" data-slide-to="0" class="active"></li>
@@ -116,7 +117,7 @@ <h3>THE CHURCH</h3>
 						E45 YH29</p>
 					</div>
 					<div class="col">
-						<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2857.036460679373!2d-8.200528975358745!3d52.8664765161292!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x485c915cb4b5d425%3A0x3247524cd2298997!2sSt.%20Mary&#39;s%20of%20the%20Rosary%20Church!5e1!3m2!1sen!2sie!4v1722867386407!5m2!1sen!2sie" width="450" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
+						<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2857.036460679373!2d-8.200528975358745!3d52.8664765161292!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x485c915cb4b5d425%3A0x3247524cd2298997!2sSt.%20Mary&#39;s%20of%20the%20Rosary%20Church!5e1!3m2!1sen!2sie!4v1722867386407!5m2!1sen!2sie" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
 					</div>
 				</div>
 				<hr>
@@ -129,7 +130,7 @@ <h3>RECEPTION</h3>
 						E45 EH64</p>
 					</div>
 					<div class="col">
-						<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d11423.643106993926!2d-8.111366520991483!3d52.88330360300943!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x485c933dd0734b67%3A0xedea56cc62d68a32!2sKillowney%20Little%2C%20Co.%20Tipperary%2C%20E45%20EH64!5e1!3m2!1sen!2sie!4v1722868327816!5m2!1sen!2sie" width="450" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
+						<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d11423.643106993926!2d-8.111366520991483!3d52.88330360300943!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x485c933dd0734b67%3A0xedea56cc62d68a32!2sKillowney%20Little%2C%20Co.%20Tipperary%2C%20E45%20EH64!5e1!3m2!1sen!2sie!4v1722868327816!5m2!1sen!2sie" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
 					</div>
 				</div>
 				<hr>
@@ -141,7 +142,7 @@ <h3>DAY TWO</h3>
 						E41 C522</p>
 					</div>
 					<div class="col">
-						<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1665.4700461707343!2d-7.8383917115793365!3d52.79557667440565!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x485ce9415a911cb5%3A0x85282ecac524af7e!2sTom%20Maher&#39;s%20Inn!5e1!3m2!1sen!2sie!4v1722868472704!5m2!1sen!2sie" width="450" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
+						<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1665.4700461707343!2d-7.8383917115793365!3d52.79557667440565!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x485ce9415a911cb5%3A0x85282ecac524af7e!2sTom%20Maher&#39;s%20Inn!5e1!3m2!1sen!2sie!4v1722868472704!5m2!1sen!2sie" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
 					</div>
 				</div>
 			</div>