fe-poprawki #3
@ -47,6 +47,7 @@ const App = () => {
|
||||
)}
|
||||
<div className="w-3/4">
|
||||
<Routes>
|
||||
<Route path="/*" element={token ? <Navigate to="/transakcje" /> : <Navigate to="/login" />} />
|
||||
<Route path="/" element={token ? <Navigate to="/transakcje" /> : <Navigate to="/login" />} />
|
||||
<Route path="/login" element={token ? <Navigate to="/transakcje" /> : <Login setToken={setToken} />} />
|
||||
<Route path="/transakcje" element={token ? <ZarzadzanieTransakcjami /> : <Navigate to="/login" />} />
|
||||
|
32
firm/src/components/DatePicker.js
Normal file
32
firm/src/components/DatePicker.js
Normal file
@ -0,0 +1,32 @@
|
||||
const DatePicker = ({ value, onChange, name, className, minDate, maxDate }) => {
|
||||
const handleChange = (e) => {
|
||||
const newValue = e.target.value;
|
||||
const newDate = new Date(newValue);
|
||||
|
||||
if (isNaN(newDate.getTime())) {
|
||||
//alert('Podano niepoprawną datę');
|
||||
return;
|
||||
}
|
||||
|
||||
onChange(e);
|
||||
};
|
||||
|
||||
const getCurrentDate = () => {
|
||||
const now = new Date();
|
||||
const offset = now.getTimezoneOffset() * 60000;
|
||||
const localISOTime = new Date(now.getTime() - offset).toISOString().slice(0, 16);
|
||||
return localISOTime;
|
||||
};
|
||||
|
||||
return (
|
||||
<input
|
||||
type="datetime-local"
|
||||
name={name}
|
||||
value={value || getCurrentDate()}
|
||||
onChange={handleChange}
|
||||
className={className}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default DatePicker;
|
@ -2,6 +2,8 @@ import React, { useState, useEffect } from 'react';
|
||||
import axios from 'axios';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import Select from 'react-select';
|
||||
import {ReactComponent as MinusIcon} from "../icons/minus-icon.svg"
|
||||
import DatePicker from './DatePicker';
|
||||
|
||||
const DodawanieTransakcji = () => {
|
||||
const [error, setError] = useState(null);
|
||||
@ -10,7 +12,7 @@ const DodawanieTransakcji = () => {
|
||||
date: '',
|
||||
employeeId: '',
|
||||
paymentType: '',
|
||||
discount: '',
|
||||
discount: 0,
|
||||
description: '',
|
||||
transactionProducts: [
|
||||
{
|
||||
@ -62,6 +64,7 @@ const DodawanieTransakcji = () => {
|
||||
const handleInputChange = (event) => {
|
||||
const { name, value } = event.target;
|
||||
setNewTransaction({ ...newTransaction, [name]: value });
|
||||
console.log(`po: ${name}, ${value}`)
|
||||
};
|
||||
const handleCancel = () => {
|
||||
navigate('/transakcje');
|
||||
@ -158,90 +161,157 @@ const DodawanieTransakcji = () => {
|
||||
return (
|
||||
<div className="bg-white p-8 rounded-lg shadow-lg max-w-4xl mx-auto mt-6">
|
||||
<h2 className="text-2xl font-bold mb-6 text-gray-800">Dodaj nową transakcję</h2>
|
||||
|
||||
|
||||
{error && <p className="text-red-500 mb-4">{error}</p>}
|
||||
|
||||
<input
|
||||
<div className="mb-4 flex items-center space-x-4">
|
||||
<div>
|
||||
<label className="block mb-2 text-gray-700 font-medium">Data transakcji</label>
|
||||
<DatePicker
|
||||
value={newTransaction.date}
|
||||
onChange={handleInputChange}
|
||||
name="date"
|
||||
className="flex-1 mb-4 px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
maxDate="2099-12-31T23:59"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block mb-2 text-gray-700 font-medium">Nr pracownika</label>
|
||||
<input
|
||||
type="number"
|
||||
name="employeeId"
|
||||
value={newTransaction.employeeId}
|
||||
onChange={handleInputChange}
|
||||
placeholder="Nr pracownika"
|
||||
className="flex mb-4 px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
{/*<input
|
||||
type="datetime-local"
|
||||
name="date"
|
||||
value={newTransaction.date}
|
||||
onChange={handleInputChange}
|
||||
placeholder="Data"
|
||||
className="block w-full mb-4 px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
/>
|
||||
|
||||
<input
|
||||
type="number"
|
||||
name="employeeId"
|
||||
value={newTransaction.employeeId}
|
||||
onChange={handleInputChange}
|
||||
placeholder="Nr. Pracownika"
|
||||
className="block w-full mb-4 px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
/>
|
||||
|
||||
{isLoading ? (
|
||||
<div className="text-center">Ładowanie produktów...</div>
|
||||
) : (
|
||||
<>
|
||||
{newTransaction.transactionProducts.map((product, index) => (
|
||||
<div key={index} className="mb-4">
|
||||
<Select
|
||||
name={`productName-${index}`}
|
||||
value={products.find(option => option.value === product.productID)}
|
||||
onChange={(selectedOption) => handleProductChange(index, selectedOption)}
|
||||
options={products}
|
||||
className="block w-full mb-2"
|
||||
placeholder="Wybierz produkt..."
|
||||
/>
|
||||
<input
|
||||
type="number"
|
||||
name={`quantity-${index}`}
|
||||
value={product.quantity}
|
||||
onChange={(e) => {
|
||||
const updatedTransactionProducts = [...newTransaction.transactionProducts];
|
||||
updatedTransactionProducts[index].quantity = e.target.value;
|
||||
setNewTransaction({ ...newTransaction, transactionProducts: updatedTransactionProducts });
|
||||
}}
|
||||
placeholder="Ilość"
|
||||
className="block w-full mb-2 px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
/>
|
||||
<button
|
||||
/>*/}
|
||||
<label className="block mb-2 text-gray-700 font-medium">Produkty transakcji</label>
|
||||
<div className="border border-gray-300 rounded-lg shadow-sm p-4 h-80 overflow-y-scroll">
|
||||
{isLoading ? (
|
||||
<div className="text-center">Ładowanie produktów...</div>
|
||||
) : (
|
||||
<>
|
||||
{newTransaction.transactionProducts.map((product, index) => (
|
||||
<div key={index} className="mb-4 flex items-center space-x-4">
|
||||
<Select
|
||||
name={`productName-${index}`}
|
||||
value={products.find(option => option.value === product.productID)}
|
||||
onChange={(selectedOption) => handleProductChange(index, selectedOption)}
|
||||
options={products}
|
||||
className="flex-1"
|
||||
placeholder="Wybierz produkt..."
|
||||
/>
|
||||
<input
|
||||
type="number"
|
||||
name={`quantity-${index}`}
|
||||
value={product.quantity}
|
||||
onChange={(e) => {
|
||||
const updatedTransactionProducts = [...newTransaction.transactionProducts];
|
||||
updatedTransactionProducts[index].quantity = e.target.value;
|
||||
setNewTransaction({ ...newTransaction, transactionProducts: updatedTransactionProducts });
|
||||
}}
|
||||
placeholder="Ilość"
|
||||
className="w-24 px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
/>
|
||||
{/*<button
|
||||
onClick={() => handleRemoveProduct(index)}
|
||||
className="bg-gradient-to-r from-red-500 to-red-700 text-white py-2 px-4 rounded-lg hover:from-red-600 hover:to-red-800 transition"
|
||||
>
|
||||
Usuń
|
||||
</button>
|
||||
</div>
|
||||
))}
|
||||
</>
|
||||
)}
|
||||
|
||||
<button
|
||||
onClick={handleAddProduct}
|
||||
className="bg-gradient-to-r from-blue-500 to-blue-700 text-white py-2 px-4 rounded-lg hover:from-blue-600 hover:to-blue-800 transition mb-3"
|
||||
>
|
||||
Dodaj produkt
|
||||
</button>
|
||||
|
||||
<input
|
||||
</button>*/}
|
||||
<button
|
||||
onClick={handleRemoveProduct}
|
||||
className="relative flex items-center justify-center w-10 h-10 rounded-full text-gray-500 hover:text-red-600 hover:bg-red-100 active:bg-red-200 transition focus:outline-none"
|
||||
>
|
||||
<MinusIcon className="w-5 h-5" />
|
||||
</button>
|
||||
</div>
|
||||
))}
|
||||
</>
|
||||
)}
|
||||
|
||||
<button
|
||||
onClick={handleAddProduct}
|
||||
className="bg-gradient-to-r from-blue-500 to-blue-700 text-white py-2 px-4 rounded-lg hover:from-blue-600 hover:to-blue-800 transition mb-3"
|
||||
>
|
||||
Dodaj produkt
|
||||
</button>
|
||||
</div>
|
||||
{/*<input
|
||||
type="text"
|
||||
name="paymentType"
|
||||
value={newTransaction.paymentType}
|
||||
onChange={handleInputChange}
|
||||
placeholder="Sposób płatności"
|
||||
className="block w-full mb-4 px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
/>
|
||||
|
||||
<input
|
||||
type="number"
|
||||
name="discount"
|
||||
value={newTransaction.discount}
|
||||
onChange={handleInputChange}
|
||||
placeholder="Rabat"
|
||||
className="block w-full mb-4 px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
/>
|
||||
|
||||
<input
|
||||
/>*/}
|
||||
<div className="mt-6 flex justify-between">
|
||||
<div className="mb-4">
|
||||
<label className="block mb-2 text-gray-700 font-medium">Metoda płatności</label>
|
||||
<div className="flex space-x-4">
|
||||
<label className="flex items-center">
|
||||
<input
|
||||
type="radio"
|
||||
name="paymentType"
|
||||
value="BLIK"
|
||||
checked={newTransaction.paymentType === "BLIK"}
|
||||
onChange={handleInputChange}
|
||||
className="form-radio h-5 w-5 text-blue-500 focus:ring-blue-500"
|
||||
/>
|
||||
<span className="ml-2">BLIK</span>
|
||||
</label>
|
||||
<label className="flex items-center">
|
||||
<input
|
||||
type="radio"
|
||||
name="paymentType"
|
||||
value="Gotówka"
|
||||
checked={newTransaction.paymentType === "Gotówka"}
|
||||
onChange={handleInputChange}
|
||||
className="form-radio h-5 w-5 text-blue-500 focus:ring-blue-500"
|
||||
/>
|
||||
<span className="ml-2">Gotówka</span>
|
||||
</label>
|
||||
<label className="flex items-center">
|
||||
<input
|
||||
type="radio"
|
||||
name="paymentType"
|
||||
value="Karta płatnicza"
|
||||
checked={newTransaction.paymentType === "Karta płatnicza"}
|
||||
onChange={handleInputChange}
|
||||
className="form-radio h-5 w-5 text-blue-500 focus:ring-blue-500"
|
||||
/>
|
||||
<span className="ml-2">Karta płatnicza</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="">
|
||||
<label className="block mb-2 text-gray-700 font-medium">Rabat</label>
|
||||
<input
|
||||
type="number"
|
||||
name="discount"
|
||||
value={newTransaction.discount}
|
||||
onChange={handleInputChange}
|
||||
placeholder="Rabat"
|
||||
className="block w-full mb-4 px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
/></div>
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<label className="block mb-2 text-gray-700 font-medium">Opis</label>
|
||||
<input
|
||||
type="text"
|
||||
name="description"
|
||||
value={newTransaction.description}
|
||||
@ -249,6 +319,8 @@ const DodawanieTransakcji = () => {
|
||||
placeholder="Opis"
|
||||
className="block w-full mb-4 px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="mt-6 flex justify-between">
|
||||
<button
|
||||
|
@ -91,7 +91,7 @@ const EdycjaTransakcji = () => {
|
||||
};
|
||||
|
||||
const handleCancel = () => {
|
||||
navigate('/transkacje');
|
||||
navigate('/transakcje');
|
||||
}
|
||||
|
||||
const handleInputChange = (event) => {
|
||||
|
@ -1,9 +1,12 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import axios from 'axios';
|
||||
import editIcon from '../icons/edit.png';
|
||||
import koszIcon from '../icons/kosz.png';
|
||||
//import editIcon from '../icons/edit.png';
|
||||
//import koszIcon from '../icons/kosz.png';
|
||||
import {ReactComponent as EditIcon} from '../icons/edit.svg';
|
||||
import {ReactComponent as KoszIcon} from '../icons/delete.svg';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
|
||||
|
||||
const ListaTransakcji = ({ onAdd}) => {
|
||||
const [transactions, setTransactions] = useState([]);
|
||||
const [deleteTransactionId, setDeleteTransactionId] = useState(null);
|
||||
@ -88,7 +91,7 @@ const ListaTransakcji = ({ onAdd}) => {
|
||||
return (
|
||||
<div>
|
||||
<div className="flex items-center justify-between py-6 px-8 bg-gradient-to-r from-blue-500 to-teal-500 rounded-xl shadow-md mb-6">
|
||||
<h1 className="text-white text-4xl font-semibold">Lista Transakcji</h1>
|
||||
<h1 className="text-white text-4xl font-semibold">Lista transakcji</h1>
|
||||
<button onClick={onAdd} className="bg-gradient-to-r from-green-500 to-green-700 text-white py-2 px-4 rounded-lg hover:from-green-600 hover:to-green-800 transition">
|
||||
Dodaj Transakcję
|
||||
</button>
|
||||
@ -103,14 +106,14 @@ const ListaTransakcji = ({ onAdd}) => {
|
||||
<th className="p-3 text-left">Produkt</th>
|
||||
<th className="p-3 text-left">Ilość</th>
|
||||
<th className="p-3 text-left">Kwota</th>
|
||||
<th className="p-3 text-left">Sposób płatności</th>
|
||||
<th className="p-3 text-center">Nr. Pracownika</th>
|
||||
<th className="p-3 text-left">Metoda płatności</th>
|
||||
<th className="p-3 text-center">Nr pracownika</th>
|
||||
<th className="p-3 text-center">Akcje</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="text-gray-600">
|
||||
{transactions.map(transaction => (
|
||||
<tr key={transaction.id} className="hover:bg-gray-50 transition-colors">
|
||||
<tr key={transaction.id} className="group hover:bg-gray-100 transition-colors">
|
||||
<td className="p-3">{transaction.id}</td>
|
||||
<td className="p-3">{formatDate(transaction.date)}</td>
|
||||
<td className="p-3">
|
||||
@ -127,20 +130,22 @@ const ListaTransakcji = ({ onAdd}) => {
|
||||
<td className="p-3">{transaction.paymentType}</td>
|
||||
<td className="p-3 text-center">{transaction.employeeId}</td>
|
||||
<td className="p-3 flex justify-center space-x-2">
|
||||
<div className="flex space-x-2 opacity-0 group-hover:opacity-100 transition-opacity duration-200">
|
||||
<button
|
||||
onClick={() => handleEditTransaction(transaction.id)}
|
||||
className="bg-gradient-to-r from-blue-500 to-blue-700 text-white py-2 px-4 rounded-lg hover:from-blue-600 hover:to-blue-800 transition"
|
||||
//className="bg-gradient-to-r from-blue-500 to-blue-700 text-white py-2 px-4 rounded-lg hover:from-blue-600 hover:to-blue-800 transition"
|
||||
className="text-blue-500 hover:bg-blue-200 active:bg-blue-300 focus:outline-none p-2 rounded-full transition-colors"
|
||||
>
|
||||
<img src={editIcon} alt="Edytuj" className="inline w-5 mr-2" />
|
||||
Edytuj
|
||||
<EditIcon className = "w-5 h-5"/>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => openDeleteConfirmation(transaction.id)}
|
||||
className="bg-gradient-to-r from-red-500 to-red-700 text-white py-2 px-4 rounded-lg hover:from-red-600 hover:to-red-800 transition"
|
||||
//className="bg-gradient-to-r from-red-500 to-red-700 text-white py-2 px-4 rounded-lg hover:from-red-600 hover:to-red-800 transition"
|
||||
className="text-red-500 hover:bg-red-200 active:bg-red-300 focus:outline-none p-2 rounded-full transition-colors"
|
||||
>
|
||||
<img src={koszIcon} alt="Usuń" className="inline w-5 mr-2" />
|
||||
Usuń
|
||||
<KoszIcon className = "w-5 h-5"/>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
|
@ -1,6 +1,5 @@
|
||||
import React, { useState, useEffect, useRef } from 'react';
|
||||
import { Link, useNavigate } from 'react-router-dom';
|
||||
import lupaIcon from "../icons/lupa.jpg";
|
||||
import profilIcon from "../icons/profil.png";
|
||||
import axios from 'axios';
|
||||
|
||||
@ -62,15 +61,6 @@ const Navbar = ({ setToken }) => {
|
||||
<div className="flex items-center flex-shrink-0 text-black mr-6">
|
||||
<Link to="/" className="text-2xl font-customFont font-bold tracking-wide">FIRMTRACKER</Link>
|
||||
</div>
|
||||
<div className="relative flex justify-center w-1/3">
|
||||
<input
|
||||
type="text"
|
||||
className="px-4 py-2 rounded-full border border-black focus:outline-none focus:border-indigo-500 w-full"
|
||||
/>
|
||||
<div className="absolute right-0 top-1/2 transform -translate-y-1/2">
|
||||
<img src={lupaIcon} alt="Lupa" className="w-8 h-8 mr-2" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="relative flex items-center">
|
||||
<img
|
||||
src={profilIcon}
|
||||
|
1
firm/src/icons/account.svg
Normal file
1
firm/src/icons/account.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368"><path d="M234-276q51-39 114-61.5T480-360q69 0 132 22.5T726-276q35-41 54.5-93T800-480q0-133-93.5-226.5T480-800q-133 0-226.5 93.5T160-480q0 59 19.5 111t54.5 93Zm246-164q-59 0-99.5-40.5T340-580q0-59 40.5-99.5T480-720q59 0 99.5 40.5T620-580q0 59-40.5 99.5T480-440Zm0 360q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q53 0 100-15.5t86-44.5q-39-29-86-44.5T480-280q-53 0-100 15.5T294-220q39 29 86 44.5T480-160Zm0-360q26 0 43-17t17-43q0-26-17-43t-43-17q-26 0-43 17t-17 43q0 26 17 43t43 17Zm0-60Zm0 360Z"/></svg>
|
After Width: | Height: | Size: 751 B |
1
firm/src/icons/calendar.svg
Normal file
1
firm/src/icons/calendar.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368"><path d="M200-80q-33 0-56.5-23.5T120-160v-560q0-33 23.5-56.5T200-800h40v-80h80v80h320v-80h80v80h40q33 0 56.5 23.5T840-720v560q0 33-23.5 56.5T760-80H200Zm0-80h560v-400H200v400Zm0-480h560v-80H200v80Zm0 0v-80 80Zm280 240q-17 0-28.5-11.5T440-440q0-17 11.5-28.5T480-480q17 0 28.5 11.5T520-440q0 17-11.5 28.5T480-400Zm-160 0q-17 0-28.5-11.5T280-440q0-17 11.5-28.5T320-480q17 0 28.5 11.5T360-440q0 17-11.5 28.5T320-400Zm320 0q-17 0-28.5-11.5T600-440q0-17 11.5-28.5T640-480q17 0 28.5 11.5T680-440q0 17-11.5 28.5T640-400ZM480-240q-17 0-28.5-11.5T440-280q0-17 11.5-28.5T480-320q17 0 28.5 11.5T520-280q0 17-11.5 28.5T480-240Zm-160 0q-17 0-28.5-11.5T280-280q0-17 11.5-28.5T320-320q17 0 28.5 11.5T360-280q0 17-11.5 28.5T320-240Zm320 0q-17 0-28.5-11.5T600-280q0-17 11.5-28.5T640-320q17 0 28.5 11.5T680-280q0 17-11.5 28.5T640-240Z"/></svg>
|
After Width: | Height: | Size: 931 B |
1
firm/src/icons/delete.svg
Normal file
1
firm/src/icons/delete.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368"><path d="M280-120q-33 0-56.5-23.5T200-200v-520h-40v-80h200v-40h240v40h200v80h-40v520q0 33-23.5 56.5T680-120H280Zm400-600H280v520h400v-520ZM360-280h80v-360h-80v360Zm160 0h80v-360h-80v360ZM280-720v520-520Z"/></svg>
|
After Width: | Height: | Size: 319 B |
1
firm/src/icons/edit.svg
Normal file
1
firm/src/icons/edit.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368"><path d="M200-200h57l391-391-57-57-391 391v57Zm-80 80v-170l528-527q12-11 26.5-17t30.5-6q16 0 31 6t26 18l55 56q12 11 17.5 26t5.5 30q0 16-5.5 30.5T817-647L290-120H120Zm640-584-56-56 56 56Zm-141 85-28-29 57 57-29-28Z"/></svg>
|
After Width: | Height: | Size: 329 B |
1
firm/src/icons/minus-icon.svg
Normal file
1
firm/src/icons/minus-icon.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368"><path d="M200-440v-80h560v80H200Z"/></svg>
|
After Width: | Height: | Size: 149 B |
1
firm/src/icons/transaction.svg
Normal file
1
firm/src/icons/transaction.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368"><path d="M444-200h70v-50q50-9 86-39t36-89q0-42-24-77t-96-61q-60-20-83-35t-23-41q0-26 18.5-41t53.5-15q32 0 50 15.5t26 38.5l64-26q-11-35-40.5-61T516-710v-50h-70v50q-50 11-78 44t-28 74q0 47 27.5 76t86.5 50q63 23 87.5 41t24.5 47q0 33-23.5 48.5T486-314q-33 0-58.5-20.5T390-396l-66 26q14 48 43.5 77.5T444-252v52Zm36 120q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z"/></svg>
|
After Width: | Height: | Size: 707 B |
Loading…
Reference in New Issue
Block a user