update to all files

yuki-konn · Sep 17, 2024 · 035eab4 · 035eab4
1 parent 67d6bb3
commit 035eab4
Show file tree

Hide file tree

Showing 7 changed files with 294 additions and 109 deletions.
diff --git a/README.md b/README.md
@@ -1,3 +1,13 @@
+Note to self: pull to glitch then delete unused glitch assets then push back to github.
+
+WIP 9/16
+index.html: finishing touches
+about.html: make cards and add words.
+gallery.html: make bootstrap grid with functions
+
+DONE
+contact.html: review after everything is done.
+
 // COMMANDS TO USE AT THE START OF PROJECT:
 echo "# yuki-capstone-project-qd4jy1hdc35uw4f11caqhpnnzktada1hei4khe55r" >> README.md
 git init

diff --git a/about.html b/about.html
@@ -11,7 +11,7 @@
     <link rel="stylesheet" href="style.css" />
     <script src="utility-functions.js"></script>
   </head>
-  <body class="bg-secondary">
+  <body>
     <header>
       <nav class="nav nav-tabs nav-fill bg-dark">
         <a class="nav-link fw-bold" href="index.html">HOME</a>
@@ -21,6 +21,7 @@
         >
         <a class="nav-link fw-bold" href="contact.html">CONTACT</a>
         <img
+          id="banner-img"
           class="border-bottom border-top border-black border-5"
           width="100%"
           src="https://cdn.glitch.global/4422a7bc-d03c-4883-a000-b382559a1cbe/Yuki Tea Shop cropped.png?v=1725974868533"
@@ -30,9 +31,39 @@
     </header>
     <hr />
     <main class="container">
-      <div><h1>About</h1></div>
+      <div>
+        <h2>ABOUT</h2>
+        <p>This page is to better explain the features of my project.</p>
+        <article>
+          <h3>Coding difference between Original And this Project</h3>
+          <p></p>
+        </article>
+        <article>
+          <h3>Boilerplate and Semantic Tags Used</h3>
+          <h4>Boilerplate Used</h4>
+          <img src="" alt="" />
+          <h4>Semantic Tags Used</h4>
+          <img src="" alt="" />
+        </article>
+        <article>
+          <h3>How I used a CSS Selector</h3>
+          <p></p>
+        </article>
+        <article>
+          <h3>How I used Inline CSS</h3>
+          <p></p>
+        </article>
+        <article>
+          <h3>How I used Internal CSS</h3>
+          <p></p>
+        </article>
+        <article>
+          <h3>How I used External CSS</h3>
+          <p></p>
+        </article>
+      </div>
     </main>
-    <footer class="bg-dark text-light text-center">
+    <footer>
       <div class="text-center">
         <span class="fw-bold">Copyright 2024</span><br />
         Website created by <span class="fst-italic">Yuki Konishi</span>

diff --git a/contact.html b/contact.html
@@ -11,7 +11,7 @@
     <link rel="stylesheet" href="style.css" />
     <script src="utility-functions.js"></script>
   </head>
-  <body class="bg-secondary">
+  <body>
     <header>
       <nav class="nav nav-tabs nav-fill bg-dark">
         <a class="nav-link fw-bold" href="index.html">HOME</a>
@@ -21,6 +21,7 @@
           >CONTACT</a
         >
         <img
+          id="banner-img"
           class="border-bottom border-top border-black border-5"
           width="100%"
           src="https://cdn.glitch.global/4422a7bc-d03c-4883-a000-b382559a1cbe/Yuki Tea Shop cropped.png?v=1725974868533"
@@ -32,14 +33,30 @@
       <h1>Contact Us</h1>
       <form>
         <label for="contact-email">Email:</label><br />
-        <input id="contact-email" type="text" name="contact-email" /><br />
+        <input
+          id="contact-email"
+          class="width-max"
+          type="text"
+          name="contact-email"
+        /><br />
         <label for="contact-comment">Comment:</label><br />
-        <textarea id="contact-comment"></textarea><br />
-        <button>Submit</button>
+        <textarea id="contact-comment" class="width-max"></textarea><br />
+        <span>Rating (Optional)</span><br />
+        <label for="rating-five">5&#9733;</label>
+        <input id="rating-five" name="ratings" type="radio" /><br />
+        <label for="rating-four">4&#9733;</label>
+        <input id="rating-four" name="ratings" type="radio" /><br />
+        <label for="rating-three">3&#9733;</label>
+        <input id="rating-three" name="ratings" type="radio" /><br />
+        <label for="rating-two">2&#9733;</label>
+        <input id="rating-two" name="ratings" type="radio" /><br />
+        <label for="rating-one">1&#9733;</label>
+        <input id="rating-one" name="ratings" type="radio" /><br />
+        <button class="m-1">Submit</button>
       </form>
+      <br />
     </main>
-    <hr />
-    <footer class="bg-dark text-light text-center">
+    <footer>
       <div class="text-center">
         <span class="fw-bold">Copyright 2024</span><br />
         Website created by <span class="fst-italic">Yuki Konishi</span>

diff --git a/gallery.html b/gallery.html
@@ -13,21 +13,45 @@
   </head>
   <body>
     <header>
-      <nav>
+      <nav class="nav nav-tabs nav-fill bg-dark">
+        <a class="nav-link fw-bold" href="index.html">HOME</a>
+        <a class="nav-link active bg-success fw-bold" href="gallery.html"
+          >GALLERY</a
+        >
+        <a class="nav-link fw-bold" href="about.html">ABOUT</a>
+        <a class="nav-link fw-bold" href="contact.html">CONTACT</a>
         <img
+          id="banner-img"
+          class="border-bottom border-top border-black border-5"
           width="100%"
-          src="https://cdn.glitch.global/5e3a6cbb-dab7-49d4-8667-e4e07d897be6/08202b19-170a-45d5-89af-14087614d791.image.png?v=1722131051679"
-          alt="Domino's header picture"
+          src="https://cdn.glitch.global/4422a7bc-d03c-4883-a000-b382559a1cbe/Yuki Tea Shop cropped.png?v=1725974868533"
+          alt="Yuki's Tea Shop Banner Image"
         />
-        <a href="index.html"><b>HOME</b></a>
-        <a href="gallery.html"><b>GALLERY</b></a>
-        <a href="contact.html"><b>CONTACT</b></a>
       </nav>
     </header>
-    <hr />
     <main>
-      <h1>Domino's</h1>
       <h2>Gallery</h2>
+      <div class="container">
+        <div class="row">
+          <div class="col"></div>
+          <div class="col"></div>
+        </div>
+      </div>
+      <!-- <div class="row gap-1">
+        <div class="col border border-success border-3"></div>
+        <div class="col border border-success border-3"></div>
+        <div class="col border border-success border-3"></div>
+      </div>
+      <div class="row gap-1">
+        <div class="col border border-success border-3"></div>
+        <div class="col border border-success border-3"></div>
+        <div class="col border border-success border-3"></div>
+      </div>
+      <div class="row gap-1">
+        <div class="col border border-success border-3"></div>
+        <div class="col border border-success border-3"></div>
+        <div class="col border border-success border-3"></div>
+      </div> -->
       <table>
         <tr>
           <td>
@@ -95,12 +119,14 @@ <h2>Gallery</h2>
         </tr>
       </table>
     </main>
-    <hr />
     <footer>
-      <p>
-        <u>Copyright 2024</u><br />
-        Website created by <i>Yuki Konishi</i>
-      </p>
+      <div class="text-center">
+        <span class="fw-bold">Copyright 2024</span><br />
+        Website created by <span class="fst-italic">Yuki Konishi</span>
+      </div>
     </footer>
+    <script>
+      const card1 = {};
+    </script>
   </body>
 </html>