Merge pull request #32 from agiledev-students-spring2024/master

update ella branch

back-end/app.js

@@ -0,0 +1,8 @@
+// import and instantiate express
+const express = require("express") // CommonJS import style!
+const app = express() // instantiate an Express object
+
+// we will put some server logic here later...
+
+// export the express app we created to make it available to other modules
+module.exports = app

back-end/package.json

@@ -0,0 +1,5 @@
+{
+  "dependencies": {
+    "express": "^4.19.2"
+  }
+}

back-end/server.js

@@ -0,0 +1,19 @@
+#!/usr/bin/env node
+
+const server = require("./app") // load up the web server
+
+const port = 3000 // the port to listen to for incoming requests
+
+// call express's listen function to start listening to the port
+const listener = server.listen(port, function () {
+  console.log(`Server running on port: ${port}`)
+})
+
+// a function to stop listening to the port
+const close = () => {
+  listener.close()
+}
+
+module.exports = {
+  close: close,
+}

front-end/src/App.js

@@ -14,6 +14,9 @@ import Closet from './screens/Closet';
 import AddItem from './screens/AddItem';
 import Generator from './screens/Generator';
 import RandomOutfitGenerator from './screens/RandomOutfitGenerator';
+import ItemDetail from './screens/ItemDetail';
+import OutfitDetail from './screens/OutfitDetail';
+import Archive from './screens/Archive';
 
 
 function App() {
@@ -31,6 +34,9 @@ function App() {
         <Route path="/pants" element={<Pants/>} />
         <Route path="/shirt" element={<Shirt/>} />
         <Route path="/shoes" element={<Shoes/>} />
+        <Route path="/ItemDetail" element={<ItemDetail/>} />
+        <Route path="/OutfitDetail" element={<OutfitDetail/>} />
+        <Route path="/Archive" element={<Archive/>} />
         <Route path="/skirts-dresses" element={<SkirtsDresses/>} />
         <Route path="/generator" element={<Generator/>} />
         <Route path="/random" element={<RandomOutfitGenerator/>} />

front-end/src/screens/Archive.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import '../styles/Archive.css'
 
 function Archive() {
     return (

front-end/src/screens/ItemDetail.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import '../styles/ItemDetail.css'
 
 function ItemDetail() {
     return (
@@ -14,7 +15,7 @@ function ItemDetail() {
                 <p>Notes</p>
             </div>
         </div>
-    )
+    );
 }
 
 export default ItemDetail;

front-end/src/screens/OutfitDetail.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import '../styles/OutfitDetail.css'
 
 function OutfitDetail() {
     return (
@@ -38,5 +39,5 @@ function OutfitDetail() {
     );
 }
 
-export default ItemDetail;
+export default OutfitDetail;
 <p> <strong style={{textDecoration: 'underline'}}> Item Detail</strong></p>

front-end/src/styles/ItemDetail.css

@@ -0,0 +1,24 @@
+@import url('https://fonts.googleapis.com/css2?family=Cormorant+Infant:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&family=IM+Fell+French+Canon+SC&family=Inria+Serif:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&family=Inter:[email protected]&display=swap');
+
+/* Consistent banner styling */
+.ItemDetail-banner {
+    background: linear-gradient(to right, #f1e5ff, #fff0e7);
+    padding: 1.5rem;
+    text-align: center;
+}
+
+.ItemDetail-banner h1 {
+    font-family: "IM Fell French Canon SC", serif;
+    font-weight: 400;
+    margin: 0;
+    margin-left: 2em;
+    text-align: left;
+    font-size: 27px;
+
+}
+
+.ItemDetail-banner h3 {
+    font-family: 'Cormorant Infant', serif;
+    font-weight: 300;
+
+}

front-end/src/styles/OutfitDetail.css

@@ -0,0 +1,25 @@
+@import url('https://fonts.googleapis.com/css2?family=Cormorant+Infant:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&family=IM+Fell+French+Canon+SC&family=Inria+Serif:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&family=Inter:[email protected]&display=swap');
+
+
+/* Consistent banner styling */
+.OutfitDetail-banner {
+    background: linear-gradient(to right, #f1e5ff, #fff0e7);
+    padding: 1.5rem;
+    text-align: center;
+}
+
+.OutfitDetail-banner h1 {
+    font-family: "IM Fell French Canon SC", serif;
+    font-weight: 400;
+    margin: 0;
+    margin-left: 2em;
+    text-align: left;
+    font-size: 27px;
+
+}
+
+.OutfitDetail-banner h3 {
+    font-family: 'Cormorant Infant', serif;
+    font-weight: 300;
+
+}