Fixing bugs

app.py

@@ -90,6 +90,13 @@ def createDeck(username):
     if (not current_user.is_authenticated or current_user.id != username):
         return redirect(url_for('login'))
     title = request.form["title"]
+
+    # Check if the title already exists in personalDecks
+    existingDeck = db.users.find_one({"user_id": username, "personalDecks.title": title})
+    # if title already exists, don't create new deck
+    if existingDeck:
+        return redirect(url_for('allDecks', username=username))
+
     newDeck = {"title": title, "cards": []}
     db.users.update_one({"user_id": username}, {"$push": {"personalDecks": newDeck}})
     # would rendirect to decks

static/css/style.css

@@ -55,7 +55,15 @@ p a{
 }
 
 .delete-deck {
+  position: relative;
   font-size: 40px;
+  top: 50;
+  left: 0;
+  color: #5e4d47;
+  background-color: transparent;
+  border: none;
+  cursor: pointer;
+  font-weight: bold;
 }
 
 .add-deck h3 {
@@ -124,34 +132,6 @@ p a{
 
 }
 
-/* #add-deck-form {
-  position: fixed;
-  top: 50%;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%); 
-  display: flex;
-  flex-direction: column;
-  justify-content: space-evenly;
-  margin: auto;
-  width: 90%;
-  aspect-ratio: 8 / 5;
-  padding: 10px;
-  margin-bottom: 10%; 
-  border-radius: .5rem;
-  background: #7F5F59;
-  text-align: center;
-} */
-
-/* #add-deck-form input[type=submit] {
-  color: #63514F;
-  background: #D9D9D9;
-  text-align: center;
-  font-size: 55px; 
-  border-radius: .5rem;
-  padding: 40px;
-} */
-
 #add-deck-form input[type=text] {
   color: #fafafa;
   background-color: transparent;
@@ -162,32 +142,10 @@ p a{
 
 }
 
-/* #add-deck-form label {
-  color: #D9D9D9;
-  text-align: center;
-  font-size: 55px; 
-  border-radius: .5rem;
-} */
-
 #add-deck-form p {
-  /* position: absolute; */
-  /* top: .1rem; */
-  /* left: 1rem; */
   color: #fafafa;
-  /* margin: 0; */
 } 
 
-/* .add-deck-input {
-  display: flex;
-  justify-content: space-between;
-  flex-direction: column;
-  align-items: center;
-  margin: auto;
-  width: 90%;
-  aspect-ratio: 9 / 5;
-
-} */
-
 .vertical-align {
   display: flex;
   justify-content: space-between;
@@ -264,7 +222,7 @@ p a{
 }
 
 .signup-error, .login-error {
-  font-size: 25px;
+  font-size: 30px;
 }
 
 .search-container {

templates/decks.html

@@ -15,13 +15,13 @@ <h3>{{ deck.title }}</h3>
     {% endfor %}
 
     {% for deck in personalDecks %}
-        <form action="{{ url_for('deleteDeck', username=username, deckTitle=deck.title) }}" method="post">
-            <input type="hidden" name="username" value="{{ username }}">
-            <input type="hidden" name="deckTitle" value="{{ deck.title }}">
-            <button type="submit" class="delete-deck">Delete Deck</button>
-        </form>
         <a href="{{ url_for('displayDeck', username=username, deckTitle=deck.title) }}" style="text-decoration:none" class="deck-link">>
             <div class="personal-deck" >
+                <form action="{{ url_for('deleteDeck', username=username, deckTitle=deck.title) }}" method="post">
+                    <input type="hidden" name="username" value="{{ username }}">
+                    <input type="hidden" name="deckTitle" value="{{ deck.title }}">
+                    <button type="submit" class="delete-deck">X</button>
+                </form>
                 <h3>{{ deck.title }}</h3>
             </div>
         </a>
@@ -34,7 +34,7 @@ <h3>{{ deck.title }}</h3>
         searchBar.addEventListener("input", function() {
             const searchTerm = searchBar.value.toLowerCase();
             deckLinks.forEach(function(link) {
-                const deckTitle = link.querySelector(".deck-title").textContent.toLowerCase();
+                const deckTitle = link.querySelector("h3").textContent.toLowerCase();
                 if (deckTitle.includes(searchTerm)) {
                     link.style.display = "block";
                 } else {

templates/login.html

@@ -6,11 +6,11 @@
     <form class="vertical-align" action="{{url_for('login')}}" method="post">
         <input class="user-input" type="username" name="username" placeholder="Username" required>
         <input class="user-input" type="password" name="password" placeholder="Password" required>
-        {% if invalid_login %}
-            <p class="login-error"> Password or username is invalid </p> 
-        {% endif %}
         <input class="button" type="submit" value="Login">
     </form>
 </div>
+{% if invalid_login %}
+    <p class="login-error"> Password or username is invalid </p> 
+{% endif %}
 
 {% endblock %}

templates/signup.html

@@ -10,11 +10,11 @@
         {% endif %}
         <input class="user-input" type="password" name="password" placeholder="Password" required>
         <input class="user-input" type="password" name="confirm-password" placeholder="Confirm Password" required>
-        {% if passwords_dont_match %}
-            <p class="signup-error"> The passwords don't match. </p> 
-        {% endif %}
         <input class="button" type="submit" value="Sign Up">
     </form>
 </div>
+{% if passwords_dont_match %}
+    <p class="signup-error"> The passwords don't match. </p> 
+{% endif %}
 
 {% endblock %}