LaunchCodeAllhubs · github-classroom · Jul 17, 2023 · Jul 21, 2023 · Jul 22, 2023 · Jul 22, 2023
diff --git a/.vscode/extensions.json b/.vscode/extensions.json
@@ -0,0 +1,5 @@
+{
+    "recommendations": [
+        "monokai.theme-monokai-pro-vscode"
+    ]
+}
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,6 @@
+{
+    "livePreview.defaultPreviewPath": "/index.html",
+    "githubPullRequests.ignoredPullRequestBranches": [
+        "main"
+    ]
+}
diff --git a/CNAME b/CNAME
@@ -0,0 +1 @@
+www.ripebananas.com
diff --git a/images/Journey-To-The.jpg b/images/Journey-To-The.jpg
diff --git a/images/banana bg2.png b/images/banana bg2.png
diff --git a/images/banana bg3 - green.jpg b/images/banana bg3 - green.jpg
diff --git a/images/bananas-7282890_1920.jpg b/images/bananas-7282890_1920.jpg
diff --git a/images/hand-drawn-banana-pattern-vector.jpg b/images/hand-drawn-banana-pattern-vector.jpg
diff --git a/images/shadow.jpg b/images/shadow.jpg
diff --git a/images/tubi-images/cobbler.png b/images/tubi-images/cobbler.png
diff --git a/images/tubi-images/cousin-vinny.png b/images/tubi-images/cousin-vinny.png
diff --git a/images/tubi-images/first-love.png b/images/tubi-images/first-love.png
diff --git a/images/tubi-images/ichi.png b/images/tubi-images/ichi.png
diff --git a/images/tubi-images/selena.png b/images/tubi-images/selena.png
diff --git a/images/tubi-images/shadow.png b/images/tubi-images/shadow.png
diff --git a/images/tubi-images/unstoppable.png b/images/tubi-images/unstoppable.png
diff --git a/images/unstoppable.png b/images/unstoppable.png
diff --git a/index.html b/index.html
@@ -1,8 +1,182 @@
 <!DOCTYPE html>
 <html>
-   <head>
-   </head>
-   <body>
-      <!-- Write your HTML in this file! -->
-   </body>
+
+<head>
+   <!-- <meta charset="UTF-8" -->
+   <title>Ripe Bananas</title>
+   <link href="styles.css" type="text/css" rel="stylesheet" />
+</head>
+
+<body>
+   <header>
+      <div class="container-logo">
+         <nav>
+            <div>
+               <a class="container-logo" href="index.html"><img id="ripe-logo" src="/images/hand-drawn-banana-pattern-vector.jpg"
+                     style="color: aliceblue;">Ripe Bananas</a>
+            </div>
+            <a class="container-logo-i">
+               <a class="stream-a" href="#tubi">Tubi</a>
+               <a class="stream-a" href="#max">Max</a>
+               <a class="stream-a" href="#disney">Disney&plus;</a>
+               <a class="stream-a" href="#netflix">Netflix</a>
+               <a class="stream-a" href="#hulu">Hulu</a>
+               <a>
+         </nav>
+      </div>
+   </header>
+
+
+   <main>
+      <div>
+         <h5 id="quote" style="color: aliceblue;">&quot;Peel back the stress of trying to find what to watch next!&quot;
+         </h5>
+      </div>
+      <section>
+         <div class="homepage-t">
+            <h2>Don't Go Bananas Finding Something To Watch!</h2>
+         </div>
+         <div class="homepage-p">
+            <p>
+               How long would you say that it takes you to find something to watch? Ever have everything you needed for
+               the night --- food, drinks, snacks, your bestest friend, and the best seat in the house --- only to not
+               know what to watch?
+            </p>
+            <p>
+               Have you ever caught yourself going bananas over what you were going to watch next? Well here at
+               Ripe Bananas, we find you what to watch next. <br><br> &quot;So before you go <span id="homepage-p-italics">bananas</span>, check out Ripe
+               Bananas!&quot;
+            </p>
+         </div>
+      </section>
+
+
+      <section>
+         <div class="homepage-t">
+            <h2>Ready To Watch?</h2>
+         </div>
+         <div class="homepage-p">
+            <p>
+               Ready to watch your next favorite movie? Well we got you covered! Ripe Bananas has just what you need.
+               Just select your preferred streaming service, and we will provide you with the top trending movies and tv
+               shows. Let us lead you to your next favorite thing to watch!
+            </p>
+         </div>
+      </section>
+      <div>
+         <article>
+         <img id="movie-of-the-month" src="/images/Journey-To-The.jpg" href="https://tubitv.com/movies/453663/journey-to-the-west" target="_blank" />
+            <p style="color: aliceblue;">This month's Movie of the Month is: <span id="movie-month-title">Journey To The West</span>. Check it out <a
+               href="https://tubitv.com/movies/453663/journey-to-the-west" target="_blank">here</a>!</p>
+            </article>
+      </div>
+
+      <div>
+         <div class="platforms">
+
+            <div class="container-plats">
+               <div class="box">
+                  <div id="tubi">
+                     <h2>Tubi</h2>
+                     <p>Tubi has gems that you wouldn't expect them to have! From some of your all-time favorites to some of the best hidden gems. Tubi will not disappoint. Here we have dug out some hidden gems to eliminate the hassel of finding them yourself. Go ahead and look through our list of pure entertainment.</p>
+                     <div>
+                        <a href="https://tubitv.com/movies/684095/the-cobbler"><img class="film-covers" src="/images/tubi-images/cobbler.png" alt=""></a>
+                        <a href="https://tubitv.com/movies/589692/first-love"><img class="film-covers" src="/images/tubi-images/first-love.png" alt=""></a>
+                        <a href="https://tubitv.com/movies/100004955/my-cousin-vinny"><img class="film-covers" src="/images/tubi-images/cousin-vinny.png" alt=""></a>
+                        <a href="https://tubitv.com/movies/702699/ichi-the-killer"><img class="film-covers" src="/images/tubi-images/ichi.png" alt=""></a>
+                        <a href="https://tubitv.com/movies/595485/selena"><img class="film-covers" src="/images/tubi-images/selena.png" alt=""></a>
+                        <a href="https://tubitv.com/movies/649980/shadow"><img class="film-covers" src="/images/tubi-images/shadow.png" alt=""></a>
+                     </div>
+                     <a class="plat-links" target="_blank" href="https://tubitv.com">View More On Tubi</a>
+                  </div>
+               </div>
+            </div>
+         </div>
+
+      <div>
+         <div class="platforms">
+
+            <div class="container-plats">
+               <div class="box">
+                  <div id="max">
+                     <h2>Max</h2>
+                     <p>Max is everything that you loved about HBO Max with an even more impressive library of all of your favorite geners like, <span id="max-genres">true crime, reality, comedy, action, and more</span>. Max brings you nostalgic classics to fresh new originals and more! Take a look at what we find to be great finds that are sure to provide great entertainment.</p>
+                     <div>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/300" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/300" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/300" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/300" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/300" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/300" alt=""></a>
+                     </div>
+                     <a class="plat-links" target="_blank" href="https://www.max.com/sign-in">View More On Max</a>
+                  </div>
+               </div>
+            </div>
+         </div>
+
+            <div class="container-plats">
+               <div class="box">
+                  <div id="disney">
+                     <h2>Disney&plus;</h2>
+                     <p>Disney&plus; is home of Disney, Pixar, Marvel, National Geo, and muh more. There's something for everyone on Disney&plus;. Checkout our list of what we find to be epic, adventureous, funny, heart-warming and simply just, classic.</p>
+                     <div>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/500/300" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/500/300" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/500/300" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/500/300" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/500/300" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/500/300" alt=""></a>
+                     </div>
+                     <a class="plat-links" target="_blank" href="https://www.disneyplus.com">View More On Disney&plus;</a>
+                  </div>
+               </div>
+            </div>
+         </div>
+
+            <div class="container-plats">
+               <div class="box">
+                  <div id="netflix">
+                     <h2>Netflix</h2>
+                     <p>Netflix has a massive library of content, including their own original movies and shows! With such an vast amount of things to possibly watch, instead of filling up your <span id="netflix-my-list">My List</span>, just come here and choose one of our top picks from Netflix! Enjoy the binge!</p>
+                     <div>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/600" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/600" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/600" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/600" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/600" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/600" alt=""></a>
+                     </div>
+                     <a class="plat-links" target="_blank" href="https://www.netflix.com">View More On Netflix</a>
+                  </div>
+               </div>
+            </div>
+         </div>
+
+            <div class="container-plats">
+               <div class="box">
+                  <div id="hulu">
+                     <h2>Hulu</h2>
+                     <p>Hulu shows up with the shows! Watch full seasons of exclusive and trending streaming series and hit movies, all on Hulu! With a variety of shows, you'll never miss out on what's new or find your new favorite show to binge. Hulu's versatility has something for everyone, of all ages! See our curated list of some of our favorites from Hulu, and see if anything peaks your interest.</p>
+                     <div>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/130" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/130" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/130" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/130" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/130" alt=""></a>
+                        <a href=""> <img class="film-covers" src="https://picsum.photos/200/130" alt=""></a>
+                     </div>
+                     <a class="plat-links" target="_blank" href="https://www.hulu.com/welcome">View More On Hulu</a>
+                  </div>
+               </div>
+            </div>
+         </div>
+
+   </main>
+
+   <footer id="foot">
+      <p style="color: aliceblue;">Created By <a href="#">x2 Tech</a></p>
+   </footer>
+</body>
+
 </html>