shopping-assistant-web-client/ShoppingAssistantWebClient.Web/Pages/Index.razor
2023-11-02 19:00:24 +00:00

89 lines
3.3 KiB
Plaintext

@page "/"
<PageTitle>New Chat</PageTitle>
<div class="right_frame" id="rightFrame">
<div id="button_open" class="open_menu">
<a class="button_open_menu" >
<span></span>
<span></span>
<span></span>
</a>
</div>
<div class="new_chat">
<div class="chat_message">
<div class="title_one_frame">New chat</div>
<div class="title_two_frame">What you're looking for</div>
<div class="switch">
<div class="switch_product" id="choose_product" >
Product
</div>
<div class="switch_gift" id="choose_gift">
Gift
</div>
</div>
<div class="title_three_frame">What you're looking for, we will help you solve your problem and find it</div>
<div class="topic" >
<div class="topic_one">
<a class="button_topic_one" >
Date
</a>
</div>
<div class="topic_two">
<a class="button_topic_two" >
🎃 Halloween gift
</a>
</div>
<div class="topic_three">
<a class="button_topic_three" >
🎁 Birthday gift
</a>
</div>
</div>
</div>
<div class="chat_input">
<input class="input_messages" type="text" id="chatInput" placeholder="Describe what you are looking for....">
<img class="button_sende" src="/images/send.svg" alt="Send message">
</div>
</div>
</div>
<script>
var choose_gift = document.getElementById("choose_gift");
var choose_product = document.getElementById("choose_product");
var switchGi = document.querySelector(".switch_gift");
var switchProd = document.querySelector(".switch_product");
function switchGift() {
choose_gift.style.backgroundColor = "#0052CC";
choose_product.style.backgroundColor = "transparent";
switchGi.style.color = "white";
switchProd.style.color = "#202124";
}
function switchProduct() {
choose_product.style.backgroundColor = "#0052CC";
choose_gift.style.backgroundColor = "transparent";
switchProd.style.color = "white";
switchGi.style.color = "#202124";
}
document.getElementById('choose_gift').addEventListener('click', switchGift);
document.getElementById('choose_product').addEventListener('click', switchProduct);
document.getElementById('button_open').addEventListener('click', changetyle);
</script>