SamiKoen commited on
Commit
420b2ee
·
verified ·
1 Parent(s): dbcd8a8

Upload app.py

Browse files
Files changed (1) hide show
  1. app.py +44 -24
app.py CHANGED
@@ -612,21 +612,50 @@ h3 {
612
  background: white;
613
  }
614
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
615
  /* JavaScript ile placeholder eklemek için */
616
  </style>
617
  <script>
618
  document.addEventListener('DOMContentLoaded', function() {
619
- // Textbox'u bul
620
  setTimeout(function() {
621
- const textareas = document.querySelectorAll('textarea');
622
- textareas.forEach(textarea => {
623
- textarea.placeholder = "Sorunuzu buraya yazın... (örn: Kadromun boyu ne olmalı?)";
 
 
 
624
 
625
- // Placeholder stillemesi
626
- textarea.style.fontStyle = "italic";
627
- textarea.style.color = "#999";
628
- });
629
- }, 1000); // Sayfa yüklendiğinde biraz bekleyerek elementlerin oluşmasını sağla
 
 
 
 
 
 
630
  });
631
  </script>
632
  <style>
@@ -642,21 +671,13 @@ with gr.Blocks(css=custom_css, theme="soft", title="Trek Asistanı") as demo:
642
  gr.Markdown("# 🚲 Trek Asistanı AI")
643
  gr.Markdown("**Akıllı özellikler:** Ürün karşılaştırması, kişisel öneriler ve detaylı ürün bilgileri sunuyorum.")
644
 
645
- with gr.Row():
646
- with gr.Column(scale=4):
647
- chatbot = gr.Chatbot(height=500, elem_id="chatbot", show_label=False)
648
-
649
- with gr.Column(scale=1):
650
- gr.Markdown("### ℹ️ Bilgi")
651
- gr.Markdown("Trek bisiklet uzmanı AI asistanınız. Ürün bilgileri, fiyatlar ve öneriler için sorularınızı yazın.")
652
 
653
- with gr.Row():
654
- msg = gr.Textbox(
655
- placeholder="Trek bisikletleri hakkında soru sorun...",
656
- show_label=False,
657
- scale=4
658
- )
659
- submit_btn = gr.Button("Gönder", scale=1)
660
 
661
  def respond(message, chat_history):
662
  if not message.strip():
@@ -692,7 +713,6 @@ with gr.Blocks(css=custom_css, theme="soft", title="Trek Asistanı") as demo:
692
  chat_history.append((message, error_msg))
693
  return "", chat_history
694
 
695
- submit_btn.click(respond, [msg, chatbot], [msg, chatbot])
696
  msg.submit(respond, [msg, chatbot], [msg, chatbot])
697
 
698
  if __name__ == "__main__":
 
612
  background: white;
613
  }
614
 
615
+ /* Input alanına uçan kağıt ikonu ekle */
616
+ #msg-input {
617
+ position: relative;
618
+ }
619
+
620
+ #msg-input textarea {
621
+ padding-right: 40px !important;
622
+ }
623
+
624
+ .input-icon {
625
+ position: absolute;
626
+ right: 12px;
627
+ top: 50%;
628
+ transform: translateY(-50%);
629
+ font-size: 16px;
630
+ pointer-events: none;
631
+ z-index: 10;
632
+ color: #666;
633
+ }
634
+
635
  /* JavaScript ile placeholder eklemek için */
636
  </style>
637
  <script>
638
  document.addEventListener('DOMContentLoaded', function() {
639
+ // Input alanına uçan kağıt ikonu ekle
640
  setTimeout(function() {
641
+ const msgInput = document.querySelector('#msg-input');
642
+ if (msgInput) {
643
+ // Icon elementi oluştur
644
+ const icon = document.createElement('div');
645
+ icon.innerHTML = '✈️';
646
+ icon.className = 'input-icon';
647
 
648
+ // Input container'ına ekle
649
+ msgInput.style.position = 'relative';
650
+ msgInput.appendChild(icon);
651
+
652
+ // Textarea'ya padding ekle
653
+ const textarea = msgInput.querySelector('textarea');
654
+ if (textarea) {
655
+ textarea.style.paddingRight = '40px';
656
+ }
657
+ }
658
+ }, 1000);
659
  });
660
  </script>
661
  <style>
 
671
  gr.Markdown("# 🚲 Trek Asistanı AI")
672
  gr.Markdown("**Akıllı özellikler:** Ürün karşılaştırması, kişisel öneriler ve detaylı ürün bilgileri sunuyorum.")
673
 
674
+ chatbot = gr.Chatbot(height=500, elem_id="chatbot", show_label=False)
 
 
 
 
 
 
675
 
676
+ msg = gr.Textbox(
677
+ placeholder="Trek bisikletleri hakkında soru sorun...",
678
+ show_label=False,
679
+ elem_id="msg-input"
680
+ )
 
 
681
 
682
  def respond(message, chat_history):
683
  if not message.strip():
 
713
  chat_history.append((message, error_msg))
714
  return "", chat_history
715
 
 
716
  msg.submit(respond, [msg, chatbot], [msg, chatbot])
717
 
718
  if __name__ == "__main__":