added bit of styling

README.md

@@ -5,6 +5,32 @@ Clean Architecture - Architekturstil am praktischen Beispiel z.B. in Python.
 
 run python script as a module e.g.: python -m framework_driver.db.db_cart
 
+
+## TODOS:
+- db_controller not in framerwork_driver ?
+
+- add cart_controller product name not only product id
+
+- add product_controller
+- connect product with ui
+
+- add feature: add product to cart
+
+- merge to main branch
+- delete old branches
+
+- add comments
+- extend readme
+
+- should the api be in ui_controllers ?
+
+- if finished: split into exercise (layer) branches
+- add exercises in new branch: user registration 
+- exercise for after workshop?
+
+- maybe: (other features: delete from cart, change quantity in cart, delete user acc, change user name, pw, mail, ...)
+- maybe: make change user id in cart_controller possible? (default is 1)
+
 ## Fast API: 
 - 0: open Terminal
 - 1: navigate to src: cd .\src\
@@ -12,23 +38,3 @@ run python script as a module e.g.: python -m framework_driver.db.db_cart
 - 3 go to url: [http://127.0.0.1:8000/docs](http://127.0.0.1:8000/docs)
 - 4: close with: strg + c
 
-## Layers
-- entities
-    - cart_item.py
-    - cart.py
-    - product.py
-- use_cases
-    - cart_reporsitory_interface.py
-    - view_cart.py
-- interfaces_adapters
-    - cart_database_interface.py
-    - cart_repository.py
-- framework_driver
-    - db
-        - db_cart.py
-        - db_product.py
-        - db_setup.py
-        - db_user.py
-        - shop.db
-    - ui
-        - coming soon ...

src/framework_driver/db/db_cart.py

@@ -71,8 +71,8 @@ def main():
     cart_db.clear_cart(ex_user_id)
 
     # user id, product id, name, quantity, price
-    cart_db.add_to_cart(ex_user_id, 1, "Product 1", 2, 10.0)
-    cart_db.add_to_cart(ex_user_id, 2, "Product 2", 5, 20.0)
+    cart_db.add_to_cart(ex_user_id, 1, "Unsichtbare Tinte", 2, 3.0)
+    cart_db.add_to_cart(ex_user_id, 3, "Geräuschloser Wecker", 5, 15.0)
     print(f"Cart items for user {ex_user_id}:", cart_db.fetch_cart_items(ex_user_id))
 
     # user id, product id, quantity

src/framework_driver/db/db_product.py

@@ -68,9 +68,9 @@ def main():
         product_db.delete_product(product[0])
 
     # name, price, quantity
-    products = [("Apel", 2.5, 5),
-                ("Banana", 1.5, 10),
-                ("Orange", 3.2, 7)]
+    products = [("Unsichtbare Tinte", 2.5, 5),
+                ("Luftdichter Sieb", 7.5, 10),
+                ("Geräuschloser Wecker", 15.0, 7)]
 
     for product in products:
         product_db.add_product(product)
@@ -80,22 +80,6 @@ def main():
     for product in products:
         print(product)
 
-    # name, price, quantity
-    product_data = ("Orange", 3.0, 5)
-    product_db.update_product(3, product_data)
-
-    product = product_db.get_product_by_id(1)
-    print("Updated product:")
-    print(product)
-
-    product_db.delete_product(2)
-    print("Product deleted")
-
-    products = product_db.get_all_products()
-    print("All products:")
-    for product in products:
-        print(product)
-
 
 if __name__ == "__main__":
     main()

src/framework_driver/db/db_user.py

@@ -68,17 +68,14 @@ def main():
     for user in user_db.get_all_users():
         user_db.delete_user(user[0])
 
-    users = [("Michael", "michael@mail.com"),
-             ("Klöara", "klara@mail.com"),
-             ("Arman", "arman@mail.com")]
-
+    users = [("Reiner", "Reiner.Zufall@mail.com"),
+             ("Frank N.", "Frank.N.Stein@mail.com"),
+             ("Rainer", "Rainer.Wahnsinn@mail.com"),
+             ("Clara ", "Clara.Fall@mail.com")]
+    
+    # add users
     for user in users:
-        user_id = user_db.add_user(user)
-
-    user = user_db.get_user_by_id(1)
-    print(f"Retrieved user: {user}")
-
-    user_db.update_user(2, ("Klara", "klara@mail.com"))
+        user_db.add_user(user)
 
     users = user_db.get_all_users()
     for user in users:

src/framework_driver/ui/static/css/style.css

@@ -12,8 +12,54 @@ main {
     padding: 1rem;
 }
 
-button {
-    padding: 0.5rem 1rem;
-    margin-top: 1rem;
+.btn-primary {
+    display: inline-block;
+    padding: 10px 20px;
+    font-size: 16px;
+    color: #fff;
+    background-color: #007bff;
+    border: none;
+    border-radius: 4px;
+    text-align: center;
+    text-decoration: none;
     cursor: pointer;
+}
+
+.btn-primary:hover {
+    background-color: #0056b3;
+}
+
+
+.product-list {
+    list-style-type: none;
+    padding: 0;
+    margin: 0;
+}
+
+.product-item {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 10px;
+    border-bottom: 1px solid #ddd;
+}
+
+/* Styling der Produktnamen, -mengen und -preise */
+.product-name {
+    font-weight: bold;
+}
+
+.product-quantity {
+    color: #555;
+}
+
+.product-price {
+    color: #555;
+}
+
+/* Styling für den Gesamtpreis */
+.total-price {
+    font-size: 18px;
+    font-weight: bold;
+    margin-top: 20px;
 }

src/framework_driver/ui/templates/base.html

@@ -8,7 +8,7 @@
 </head>
 <body>
     <header>
-        <h1>My Shop</h1>
+        <h1>Shop</h1>
     </header>
     <main>
         {% block content %}{% endblock %}

src/framework_driver/ui/templates/cart.html

@@ -4,12 +4,18 @@
 
 {% block content %}
 <h2>Cart Items</h2>
-<ul>
+
+<ul class="product-list">
     {% for item in cart_items['items'] %}
-    <li>Product ID: {{ item.product_id }} - Quantity: {{ item.quantity }} - Price: ${{ item.price }}</li>
+    <li class="product-item">
+        <div class="product-name">Product ID: {{ item.product_id }}</div>
+        <div class="product-quantity">Quantity: {{ item.quantity }}</div>
+        <div class="product-price">Price: {{ item.price }} €</div>
+    </li>
     {% endfor %}
 </ul>
-<p>Total Price: ${{ cart_items.total_price }}</p>
+
+<p class="total-price">Total Price: {{ cart_items.total_price }} €</p>
 
 <a href="{{ url_for('ui') }}" class="btn btn-primary">Back to the prodcuts</a>
 

src/framework_driver/ui/templates/products.html

@@ -4,9 +4,12 @@
 
 {% block content %}
 <h2>Product Items</h2>
-<ul>
+<ul class="product-list">
     {% for product in products %}
-    <li>{{ product.name }} - ${{ product.price }}</li>
+    <li class="product-item">
+        <div class="product-name">{{ product.name }}</div>
+        <div class="product-price">${{ product.price }}</div>
+    </li>
     {% endfor %}
 </ul>