Update templates/dashboard.html

templates/dashboard.html

@@ -65,7 +65,16 @@
       transition: all 0.2s ease-in-out;
       box-shadow: 0 0 5px #00ff00;
     }
+ .blinking-cursor::after {
+    content: '_';
+    animation: blink 1s step-start infinite;
+  }
 
+  @keyframes blink {
+    50% {
+      opacity: 0;
+    }
+  }
     .button-link:hover {
       background-color: #00ff00;
       color: #000;
@@ -82,10 +91,10 @@
     <h1>hello, {{ user.display_name }}!</h1>
     <form action="{{ url_for('generate') }}" method="POST">
       <label for="prompt">put topic and number of songs you wanna use to make playlist like:<br> <em>40 songs Best of Rock</em></label>
-      <input type="text" id="prompt" name="prompt" required>
+      <input type="text" id="prompt" name="prompt" placeholder="40 songs best Rock Mix" required>
       <br>
       <label for="prompt">Name of Playlist:</label>
-      <input type="text" id="playlist_name" name="playlist_name" placeholder="My Awesome Rock Mix" required style="background-color:black; color:green;">
+      <input type="text" id="playlist_name" name="playlist_name" placeholder="My Awesome Rock Mix" required style="background-color:black; color:green;" class="blinking-cursor">
       <br>
       <button type="submit" class="button-link">Generate</button>
     </form>