cartaid/shopping-assistant-web-client
1
0
Fork 0
mirror of https://github.com/Shchoholiev/shopping-assistant-web-client.git synced 2025-04-04 16:49:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix bags and connect product search

Browse Source
This commit is contained in:
––AsTroLog 2023-11-17 07:30:23 +00:00
parent f1a06726ef
commit 8b544ca009
10 changed files with 511 additions and 127 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
ShoppingAssistantWebClient.Web/Models/Messages.cs
View File

@ -3,12 +3,21 @@
public class Messages
{
public required string Id { get; set; }
public string Id { get; set; }
public required string Text { get; set; }
public string Text { get; set; }
public required string Role { get; set; }
public string Role { get; set; }
public string CreatedById { get; set; }
public Messages()
{
public required string CreatedById { get; set; }
}
}
}

7
ShoppingAssistantWebClient.Web/Network/ApiClient.cs
View File

@ -99,7 +99,7 @@ public class ApiClient
public async IAsyncEnumerable<ServerSentEvent> GetServerSentEventStreamed(string url, Object obj, CancellationToken cancellationToken)
{
await SetAuthenticationAsync();
var count = 0; //
var requestUrl = $"{_httpClient.BaseAddress}{url}";
var response = await _httpClient.PostAsJsonAsync(requestUrl, obj);
using var responseStream = await response.Content.ReadAsStreamAsync();
@ -109,9 +109,14 @@ public class ApiClient
while (!cancellationToken.IsCancellationRequested)
{
var jsonChunk = await reader.ReadLineAsync(cancellationToken);
count += 1; //
if (count >=5 ){ //
break; //
}; //
if (jsonChunk == null) continue;
if (jsonChunk.StartsWith("event: "))
{
count = 0; //
var type = jsonChunk.Substring("event: ".Length);
switch(type)
{

89
ShoppingAssistantWebClient.Web/Pages/Chat.razor
View File

@ -1,8 +1,9 @@
@page "/chat/{chatId}"
@inject IHttpClientFactory ClientFactory
@inject IJSRuntime JSRuntime
<PageTitle>Gift for Jessica</PageTitle>
<PageTitle>@name</PageTitle>
<div class="right_frame" id="rightFrame">
@ -16,30 +17,35 @@
<div class="new_chat">
<div class="chat_message">
<div class="title_one_frame">@name</div>
<div class="title_one_frame">Gift for Jessica</div>
<div class="chat_message" @ref="chatMessageRef">
<ul class="chat_box">
@if(!isLoading && Messages!=null){
@if (!isLoading && Messages != null)
{
@foreach (var item in Messages){
@foreach (var item in Messages)
{
if(item.Role!="User"){
if (item.Role != "User")
{
<li class=" chat_incoming">
<p>@item.Text</p>
</li>
<li class=" chat_incoming">
<p>@item.Text</p>
</li>
}else{
}
else
{
<li class="chat_outgoing">
<p>@item.Text</p>
</li>
<li class="chat_outgoing">
<p>@item.Text</p>
</li>
}
}
}
}
@ -52,21 +58,27 @@
<div class="possible_options">
<div class="tite_options">Several possible options</div>
@if (Suggestion.Count != 0)
{
<div class="options">
<div class="tite_options">Several possible options</div>
<div class="topic_options">
HDMI
</div>
<div class="topic_options">
VGA
</div>
<div class="topic_options">
DisplayPort
</div>
<div class="options">
</div>
@foreach (var item in Suggestion)
{
<div @onclick="() => ClickOption(item)" class="topic_options">
@item
</div>
}
</div>
}
</div>
@ -84,8 +96,15 @@
<script>
window.scrollToBottom = function (element) {
if (element) {
element.scrollTop = 9999;
}
};
document.getElementById('button_open').addEventListener('click', changetyle);
</script>
@code {
@ -100,8 +119,22 @@
{
if (e.Code == "Enter" || e.Code == "NumpadEnter")
{
AddNewMessage();
AddNewMessage();
}
}
private ElementReference chatMessageRef;
protected override async Task OnAfterRenderAsync(bool firstRender)
{
await JSRuntime.InvokeVoidAsync("scrollToBottom", chatMessageRef);
await JSRuntime.InvokeVoidAsync("scrollToBottom", chatMessageRef);
await JSRuntime.InvokeVoidAsync("scrollToBottom", chatMessageRef);
}
private void ClickOption(string item) {
inputValue = item;
}
}

191
ShoppingAssistantWebClient.Web/Pages/Chat.razor.cs
View File

@ -3,7 +3,9 @@ using ShoppingAssistantWebClient.Web.Models;
using GraphQL;
using Newtonsoft.Json;
using ShoppingAssistantWebClient.Web.Network;
using ShoppingAssistantWebClient.Web.Models.Input;
using ShoppingAssistantWebClient.Web.Models.Enums;
using System.Text.RegularExpressions;
namespace ShoppingAssistantWebClient.Web.Pages;
public partial class Chat : ComponentBase
@ -11,10 +13,20 @@ public partial class Chat : ComponentBase
[Inject]
private ApiClient _apiClient { get; set; }
[Inject]
private NavigationManager Navigation { get; set; }
public List<Messages> Messages { get; set; }
public List<String> Suggestion { get; set; } = new List<String>();
public Messages Message { get; set; }
private CancellationTokenSource cancelTokenSource;
private MessageCreateDto messageCreateDto;
public bool isLoading = true;
private string inputValue = "";
private string name = "";
protected override async Task OnInitializedAsync()
{
await LoadMessages();
@ -23,12 +35,34 @@ public partial class Chat : ComponentBase
private async Task LoadMessages()
{
string wishlistId = chatId;
Suggestion.Add("123");
Suggestion.Add("456");
Suggestion.Add("145623");
var request = new GraphQLRequest
{
Query = @"query PersonalWishlist( $wishlistId: String!) {
personalWishlist(wishlistId: $wishlistId) {
name
}
}",
Variables = new
{
wishlistId,
}
};
var response = await _apiClient.QueryAsync(request);
var responseData = response.Data;
name = responseData.personalWishlist.name;
isLoading = true;
int pageNumber = 1;
string wishlistId = chatId;
var request = new GraphQLRequest
request = new GraphQLRequest
{
Query = @"query MessagesPageFromPersonalWishlist($wishlistId: String!, $pageNumber: Int!, $pageSize: Int!) {
messagesPageFromPersonalWishlist( wishlistId: $wishlistId, pageNumber: $pageNumber, pageSize: $pageSize)
@ -46,12 +80,12 @@ public partial class Chat : ComponentBase
{
wishlistId,
pageNumber,
pageSize = 20
pageSize = 200
}
};
try{
var response = await _apiClient.QueryAsync(request);
var responseData = response.Data;
response = await _apiClient.QueryAsync(request);
responseData = response.Data;
var jsonCategoriesResponse = JsonConvert.SerializeObject(responseData.messagesPageFromPersonalWishlist.items);
this.Messages = JsonConvert.DeserializeObject<List<Messages>>(jsonCategoriesResponse);
Messages.Reverse();
@ -60,42 +94,127 @@ public partial class Chat : ComponentBase
}catch{
}
}
private async Task AddNewMessage()
{
/*
try{
isLoading = true;
var pageNumber = 1;
var wishlistId = chatId;
var text = inputValue;
inputValue="";
var request = new GraphQLRequest
{
Query = @"mutation AddMessageToPersonalWishlist($wishlistId: String!, $text: String!) {
addMessageToPersonalWishlist(wishlistId: $wishlistId, dto: { text: $text }) {
id
text
role
createdById
}
}
",
Variables = new
{
wishlistId,
text
pageNumber = 0;
do{
pageNumber++;
request = new GraphQLRequest
{
Query = @"query MessagesPageFromPersonalWishlist($wishlistId: String!, $pageNumber: Int!, $pageSize: Int!) {
messagesPageFromPersonalWishlist( wishlistId: $wishlistId, pageNumber: $pageNumber, pageSize: $pageSize)
{
items {
id
text
role
createdById
}
totalPages
}
}",
Variables = new
{
wishlistId,
pageNumber,
pageSize = 1
}
};
response = await _apiClient.QueryAsync(request);
responseData = response.Data;
var jsonCategoriesResponse = JsonConvert.SerializeObject(responseData.messagesPageFromPersonalWishlist.items);
if(pageNumber == 1){
Messages = JsonConvert.DeserializeObject<List<Messages>>(jsonCategoriesResponse);
}else{
Message = JsonConvert.DeserializeObject<List<Messages>>(jsonCategoriesResponse);
Messages.InsertRange(0, Message);
}
};
// Messages.Reverse();
totalPages = responseData.messagesPageFromPersonalWishlist.totalPages;
isLoading = false;
StateHasChanged();
}while(pageNumber<totalPages);
}catch (Exception ex)
{
// Log the exception
Console.WriteLine($"An error occurred: {ex.Message}");
}
*/
}
private async Task AddNewMessage()
{
messageCreateDto = new MessageCreateDto { Text = inputValue };;
Message = new Messages();
Message.Text = inputValue;
Message.Role = "User";
Message.Id = "";
Message.CreatedById = "";
inputValue = "";
Messages.Add(Message);
StateHasChanged();
cancelTokenSource = new CancellationTokenSource();
var cancellationToken = cancelTokenSource.Token;
var serverSentEvent = _apiClient.GetServerSentEventStreamed($"ProductsSearch/search/{chatId}", messageCreateDto, cancellationToken);
bool first = true;
await foreach (var sseEvent in serverSentEvent.WithCancellation(cancellationToken))
{
Console.WriteLine($"Received SSE Event: {sseEvent.Event}, Data: {sseEvent.Data}");
if(sseEvent.Event == SearchEventType.Message){
string input = sseEvent.Data;
Regex regex = new Regex("\"(.*?)\"");
Match match = regex.Match(input);
string result = match.Groups[1].Value;
Message = new Messages();
Message.Text = result;
Message.Role = "bot";
Message.Id = "";
Message.CreatedById = "";
if (first)
{
Messages.Add(Message);
first = false;
}
else
{
var lengt = Messages.Count();
Messages[lengt-1].Text += Message.Text;
}
await InvokeAsync(StateHasChanged);
}else if(sseEvent.Event == SearchEventType.Product){
var url = $"/chat/{chatId}/product";
Navigation.NavigateTo(url);
}else if(sseEvent.Event == SearchEventType.Suggestion){
Suggestion.Add(sseEvent.Data);
}
var response = await _apiClient.QueryAsync(request);
await LoadMessages();
}
}
}

4
ShoppingAssistantWebClient.Web/Pages/Chat.razor.css
View File

@ -56,7 +56,6 @@
}
.possible_options {
visibility: hidden;
position: absolute;
bottom: 5.5em;
margin-left: 25%;
@ -84,6 +83,7 @@
margin: 0em 0.6em;
flex: 1;
text-align: center;
cursor: pointer;
}
.input_messages {
@ -117,7 +117,7 @@
.chat_message {
position: relative;
overflow-y: auto;
height: calc(100% - 5.5em);
height: calc(100% - 8em);
width: 100%;
}
.chat_message::-webkit-scrollbar {

21
ShoppingAssistantWebClient.Web/Pages/Index.razor
View File

@ -1,5 +1,4 @@
@page "/"
<PageTitle>New Chat</PageTitle>
<div class="right_frame" id="rightFrame">
@ -87,6 +86,18 @@
choose = "Product";
}
function myJavaScriptFunction(wishlistId) {
UpdateMenu(wishlistId);
}
document.getElementById('choose_gift').addEventListener('click', switchGift);
document.getElementById('choose_product').addEventListener('click', switchProduct);
@ -102,4 +113,12 @@
private void Сhoose_gift() {
selectedChoice = "Gift";
}
private async Task UpdateSideMenu(string wishlistId)
{
await JSRuntime.InvokeVoidAsync("myJavaScriptFunction", wishlistId);
}
}

65
ShoppingAssistantWebClient.Web/Pages/Index.razor.cs
View File

@ -1,11 +1,12 @@
using Microsoft.AspNetCore.Components;
using ShoppingAssistantWebClient.Web.Models;
using ShoppingAssistantWebClient.Web.Models.ProductSearch;
using ShoppingAssistantWebClient.Web.Models.Input;
using GraphQL;
using Newtonsoft.Json;
using ShoppingAssistantWebClient.Web.Network;
using System;
using Microsoft.JSInterop;
namespace ShoppingAssistantWebClient.Web.Pages
{
@ -15,7 +16,11 @@ namespace ShoppingAssistantWebClient.Web.Pages
[Inject]
private ApiClient _apiClient { get; set; }
[Inject]
private NavigationManager Navigation { get; set; }
[Inject]
protected IJSRuntime JSRuntime { get; set; }
private MessageCreateDto messageCreateDto;
private CancellationTokenSource cancelTokenSource;
@ -26,7 +31,7 @@ namespace ShoppingAssistantWebClient.Web.Pages
private async Task CreateNewChat() {
try
try
{
if (string.IsNullOrWhiteSpace(inputValue))
{
@ -36,7 +41,7 @@ namespace ShoppingAssistantWebClient.Web.Pages
isLoading = true;
messageCreateDto = new MessageCreateDto { Text = inputValue };
var type = selectedChoice;
var firstMessageText = $"[Question] What are you looking for? [Suggestions] " + inputValue;
var firstMessageText = $"What are you looking for?";
var request = new GraphQLRequest
{
@ -56,20 +61,68 @@ namespace ShoppingAssistantWebClient.Web.Pages
var response = await _apiClient.QueryAsync(request);
var responseData = response.Data;
var chatId = responseData?.startPersonalWishlist?.id;
isLoading = false;
var url = $"/chat/{chatId}";
string wishlistId1 = chatId;
await UpdateSideMenu(wishlistId1);
var text = inputValue;
/*
inputValue="";
request = new GraphQLRequest
{
Query = @"mutation AddMessageToPersonalWishlist($wishlistId: String!, $text: String!) {
addMessageToPersonalWishlist(wishlistId: $wishlistId, dto: { text: $text }) {
id
text
role
createdById
}
}
",
Variables = new
{
wishlistId =chatId,
text
}
};
await _apiClient.QueryAsync(request);
*/
cancelTokenSource = new CancellationTokenSource();
var cancellationToken = cancelTokenSource.Token;
var serverSentEvent = _apiClient.GetServerSentEventStreamed($"ProductsSearch/search/{chatId}", messageCreateDto, cancellationToken);
Navigation.NavigateTo(url);
await foreach (var sseEvent in serverSentEvent.WithCancellation(cancellationToken))
{
// Handle each ServerSentEvent as needed
Console.WriteLine($"Received SSE Event: {sseEvent.Event}, Data: {sseEvent.Data}");
}
string wishlistId = chatId;
request = new GraphQLRequest
{
Query = @"mutation GenerateNameForPersonalWishlist($wishlistId: String!) {
generateNameForPersonalWishlist(wishlistId: $wishlistId) {
id
name
}
}",
Variables = new
{
wishlistId
}
};
response = await _apiClient.QueryAsync(request);
var url = $"/chat/{chatId}";
Navigation.NavigateTo(url);
}
catch (Exception ex)
{

115
ShoppingAssistantWebClient.Web/Shared/NavMenu.razor
View File

@ -1,5 +1,9 @@
@using Models.GlobalInstances
@using System.Linq
@using Microsoft.AspNetCore.Components
@using Microsoft.JSInterop
@inject NavigationManager Navigation
@inject IJSRuntime JSRuntime;
<div id="leftframe" class="left_frame">
@ -16,7 +20,8 @@
<span></span>
</a>
<div class="elements_wishlisht">
<div class="elements_wishlisht" id="elements_wishlisht" >
<div class="add_chat" @onclick="RedirectToNewChat" >
<div>
@ -29,15 +34,15 @@
@if(!isLoading){
@foreach (var item in Wishlists)
@foreach (var item in Wishlists)
{
<section class="cont_wishlist">
<div @onclick="() => RedirectToPage(item.Id)" class="wishlist_name" >@item.Name</div>
<img @onclick="() => DeleteWishlist(item.Id)" class="button_delete_chat" src="/images/icon_delete.svg" alt="Delete wishlist">
<img @onclick="() => RedirectToCard(item.Id)" class="button_open_card" src="/images/icon_open_card.svg" alt="Card open">
<section class="cont_wishlist @(selectedWishlistId == item.Id ? "selected_wishlist" : "")">
<div class="wishlist_name" @onclick="() => RedirectToPage(item.Id)">@item.Name</div>
<img class="button_delete_chat" @onclick="() => DeleteWishlist(item.Id)" src="/images/icon_delete.svg" alt="Delete wishlist">
<img class="button_open_card" @onclick="() => RedirectToCard(item.Id)" src="/images/icon_open_card.svg" alt="Card open">
</section>
}
}
</div>
@ -81,31 +86,99 @@
}
document.getElementById('button_close').addEventListener('click', changetyle);
/*
window.getScrollTop = function (element) {
return element.scrollTop;
};
window.getOffsetHeight = function (element) {
return element.offsetHeight;
};
window.getScrollHeight = function (element) {
return element.scrollHeight;
};
window.setScrollTop = function (element, scrollTop) {
element.scrollTop = scrollTop;
};
*/
</script>
<script>
function UpdateMenu(wishlistId)
{
DotNet.invokeMethodAsync('ShoppingAssistantWebClient.Web', 'Update', wishlistId);
}
</script>
@code {
[Parameter] public string chatId { get; set; }
private string selectedWishlistId;
private static NavMenu _app;
public NavMenu ()
{
_app = this;
}
[JSInvokable]
public static void Update(string wishlistId)
{
_app.LoadMenus(1,200);
_app.selectedWishlistId=wishlistId;
}
private void RedirectToPage(string itemId) {
var url = $"/chat/{itemId}";
Navigation.NavigateTo(url);
}
_app.selectedWishlistId = itemId;
var url = $"/chat/{itemId}";
Navigation.NavigateTo(url);
}
private void RedirectToNewChat() {
var url = $"/";
Navigation.NavigateTo(url);
}
var url = $"/";
Navigation.NavigateTo(url);
}
private void RedirectToCard(string itemId) {
var url = $"/chat/{itemId}/cart";
Navigation.NavigateTo(url);
}
var url = $"/chat/{itemId}/cart";
Navigation.NavigateTo(url);
}
private async void DeleteWishlist(string itemId) {
await DeleteWish(itemId);
}
public void UpdateSideMenu()
{
StateHasChanged();
}
/*
private int savedScrollTop = 0;
private ElementReference wishlishtRef;
private async Task OnScroll()
{
var scrollTop = await JSRuntime.InvokeAsync<int>("getScrollTop", wishlishtRef);
var offsetHeight = await JSRuntime.InvokeAsync<int>("getOffsetHeight", wishlishtRef);
var scrollHeight = await JSRuntime.InvokeAsync<int>("getScrollHeight", wishlishtRef);
if (scrollTop + offsetHeight > scrollHeight - 100)
{
savedScrollTop = scrollTop;
currentPage++;
await LoadMenus(currentPage, pageSize);
await InvokeAsync(() => JSRuntime.InvokeVoidAsync("setScrollTop", wishlishtRef, savedScrollTop));
}
}
*/
}

30
ShoppingAssistantWebClient.Web/Shared/NavMenu.razor.cs
View File

@ -14,14 +14,20 @@ namespace ShoppingAssistantWebClient.Web.Shared
public List<Wishlist> Wishlists { get; set; }
public bool isLoading = true;
public int pageSize { get; set; }
public int currentPage { get; set; }
protected override async Task OnInitializedAsync()
{
await LoadMenus();
pageSize = 200;
currentPage = 1;
Wishlists = new List<Wishlist>();
await LoadMenus(currentPage, pageSize);
}
private async Task LoadMenus()
public async Task LoadMenus(int pageNumber, int pageSize )
{
isLoading = true;
var pageNumber = 1;
var request = new GraphQLRequest
{
Query = @"query PersonalWishlistsPage( $pageNumber: Int!, $pageSize: Int!) {
@ -36,17 +42,19 @@ namespace ShoppingAssistantWebClient.Web.Shared
Variables = new
{
pageNumber,
pageSize = 40,
pageSize,
}
};
var response = await _apiClient.QueryAsync(request);
var responseData = response.Data;
var jsonCategoriesResponse = JsonConvert.SerializeObject(responseData.personalWishlistsPage.items);
this.Wishlists = JsonConvert.DeserializeObject<List<Wishlist>>(jsonCategoriesResponse);
isLoading = false;
var response = await _apiClient.QueryAsync(request);
var responseData = response.Data;
var jsonCategoriesResponse = JsonConvert.SerializeObject(responseData.personalWishlistsPage.items);
this.Wishlists.AddRange(JsonConvert.DeserializeObject<List<Wishlist>>(jsonCategoriesResponse));
Wishlists.Reverse();
isLoading = false;
StateHasChanged();
}
protected async Task DeleteWish(string wishlistId)
{
var request = new GraphQLRequest
@ -65,7 +73,7 @@ namespace ShoppingAssistantWebClient.Web.Shared
};
var response = await _apiClient.QueryAsync(request);
await LoadMenus();
await LoadMenus(currentPage, pageSize);
}
}

99
ShoppingAssistantWebClient.Web/Shared/NavMenu.razor.css
View File

@ -1,10 +1,10 @@
.left_frame {
position: relative;
height: 100%;
width: 100%;
transition: 1s;
}
.logo {
height: 5em;
position: relative;
@ -12,26 +12,35 @@
align-items: center;
padding-bottom: 1.5%;
}
.menu {
position: absolute;
width: 100%;
top: 5em;
top: 5em;
bottom: 0;
border: 1.5px solid;
border-color: #0052CC;
border-radius: 0.6em;
padding-top: 1.5%;
}
.elements_wishlisht {
position: absolute;
overflow-y: auto;
top: 2.43em;
width: 100%;
bottom: 4em;
bottom: 3.8em;
padding-left: 1.25em;
padding-right: 1.25em;
padding-bottom: 3.8em;
}
.wishlist_names {
overflow-y: auto;
position: relative;
width: 100%;
height:100%;
}
.info_user {
position: absolute;
display: flex;
@ -46,6 +55,7 @@
padding-right: 1.25em;
border-top: 1px solid #0165FF;
}
.logo_name {
padding-top: 0.5em;
padding-left: 0.3em;
@ -56,11 +66,13 @@
font-weight: 600;
overflow: hidden;
}
.logo img {
float: left;
height: 3.25em;
width: 3.25em;
}
.wishlist_name {
padding-left: 0.7em;
padding-right: 5em;
@ -68,10 +80,11 @@
white-space: nowrap;
overflow: hidden;
position: absolute;
height: 2.5em;
height: 2.5em;
line-height: 2.5em;
cursor: pointer;
}
.cont_wishlist {
margin-top: 0.4375em;
margin-bottom: 0.4375em;
@ -79,23 +92,64 @@
border-radius: 0.6em;
font-size: 1.1em;
width: 100%;
height:2.5em;
height: 2.5em;
}
.cont_wishlist:hover {
background-color: #e6e6e6;
transition: 0.2s;
}
.cont_wishlist:hover .button_delete_chat{
.cont_wishlist:hover .button_delete_chat {
visibility: visible;
}
.cont_wishlist:hover .button_open_card{
.cont_wishlist:hover .button_open_card {
visibility: visible;
}
.selected_wishlist {
margin-top: 0.4375em;
margin-bottom: 0.4375em;
color: black;
border-radius: 0.6em;
font-size: 1.1em;
width: 100%;
height: 2.5em;
background-color: #e6e6e6;
transition: 0.2s;
}
.sel_del {
visibility: visible;
cursor: pointer;
margin-top: 0.55em;
margin-right: 1em;
float: right;
position: relative;
}
.selected_card{
cursor: pointer;
position: relative;
z-index: 999;
margin-top: 0.55em;
margin-right: 1em;
float: right;
visibility: visible;
height: 1.4em;
width: 1.5em;
}
.button_delete_chat {
cursor: pointer;
margin-top: 0.55em;
margin-top: 0.55em;
margin-right: 1em;
float: right;
position: relative;
@ -103,6 +157,7 @@
height: 1.4em;
width: 1.4em;
}
.button_open_card {
cursor: pointer;
position: relative;
@ -114,14 +169,17 @@
height: 1.4em;
width: 1.5em;
}
.elements_wishlisht::-webkit-scrollbar {
.wishlist_names::-webkit-scrollbar {
border-radius: 20px;
width: 0.2em;
}
.elements_wishlisht::-webkit-scrollbar-thumb {
background-color: #0052CC; /* Колір позиції покажчика */
border-radius: 10px; /* Закруглення країв позиції покажчика */
.wishlist_names::-webkit-scrollbar-thumb {
background-color: #0052CC;
/* Колір позиції покажчика */
border-radius: 10px;
/* Закруглення країв позиції покажчика */
width: 0.2em;
}
@ -131,10 +189,11 @@
border-radius: 0.6em;
font-size: 1.2em;
width: 100%;
height:2.5em;
height: 2.5em;
cursor: pointer;
line-height: 2.5em;
}
.add_chat div {
justify-content: center;
align-items: center;
@ -143,11 +202,12 @@
text-decoration: none;
color: #FFFFFF;
}
.plus {
position: absolute;
right: 1em;
top: -0.1em;
font-size: 1.9em;
font-size: 1.9em;
}
.user_name {
@ -156,12 +216,14 @@
justify-content: center;
align-items: center;
}
.info_user img {
float: left;
border-radius: 50%;
width: 2.3em;
height: 2.3em;
}
.button_close_menu {
position: relative;
width: 1.43em;
@ -171,6 +233,7 @@
margin-top: 0.5em;
margin-right: 1.30em;
}
.button_close_menu span {
width: 20px;
height: 1.5px;
@ -180,9 +243,11 @@
transform: translate(-50%, -50%);
background-color: #4E4E4E;
}
.button_close_menu span:nth-of-type(2) {
top: calc(50% - 5px);
}
.button_close_menu span:nth-of-type(3) {
top: calc(50% + 5px);
}