Hugging Face's logo

akhilpmohan
/
image-description

Model card Files
xet
Community
image-description
File size: 2,896 Bytes 
a975db9
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
 
<!DOCTYPE html>
<html>
  <head>
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@700&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@600&display=swap" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="../static/css/styles.css">
    <title>imagechatbot.ai</title>
  </head>
  <body>
    <header>
      <h1>IMAGE CHATBOT</h1>
      <div class="side-header">
        <a href="index.html"><button class="side-header1">new chat</button></a>
        <a href="imagedescription.html"><button class="side-header1">image description</button></a>
        <a href="texttoimage.html"><button class="side-header1">text to image</button></a>
      </div>
    </header>
     
    <main>
      
      <div class="chat-container"> 
        <div class="chat-output-container">
          <div class="chat-output">
            <div class="question">
              {% if image_url %}
                <img src="{{ image_url }}" alt="Uploaded image" class="question-image">
              {% endif %}
              
              <h3>{{ question }}</h3>
            </div>
            <div class="answer">
              <h3>Something went wrong !</h3>
              <h4>Try again with another input...</h4>
            </div>
                       
          </div>
        </div>           
        <div class="chat-input-container">
          <div class="chat-input">
            <form id="myForm" action="/ask" method="post" enctype="multipart/form-data">
              <input type="file" id="image-upload" name="image" style="display: none;"  accept="image/*">
              <input type="text" name="question" class="chat-input"  autofocus  placeholder="Type a message..." >
              
            </form>
          </div>
          <div class="chat-actions">
            <label for="image-upload" form="myForm" class="image-upload-button tooltip image-upload-tooltip">
              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-paperclip size-4">
                <path d="m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l8.57-8.57A4 4 0 1 1 18 8.84l-8.59 8.57a2 2 0 0 1-2.83-2.83l8.49-8.48"></path>
              </svg>
              <span class="tooltiptext">Upload an image</span>
            </label>
            <button form="myForm" class="chat-button tooltip chat-button-tooltip" type="submit">
              <span aria-hidden="true">➤</span>
              <span class="tooltiptext">Send message</span>
            </button>
          </div>
        </div>  
        <h6>akhilpmohan &copy; </h6> 
      </div>
    </main>
    <script src="../static/js/script.js"></script>

  </body>
</html>