added Key icon to NotConnected popup

This commit is contained in:
Nikita 2023-08-04 13:39:28 +03:00
parent 742c0a0bf1
commit 19a405ce21
3 changed files with 18 additions and 1 deletions

5
src/icons/key.svg Normal file
View file

@ -0,0 +1,5 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M7.63589 9.92035C7.31951 9.60396 7.16132 9.22322 7.16132 8.77812C7.16132 8.33302 7.31951 7.95228 7.63589 7.6359C7.95228 7.31951 8.33302 7.16132 8.77812 7.16132C9.22322 7.16132 9.60396 7.31951 9.92034 7.6359C10.2367 7.95228 10.3949 8.33302 10.3949 8.77812C10.3949 9.22322 10.2367 9.60396 9.92034 9.92035C9.60396 10.2367 9.22322 10.3949 8.77812 10.3949C8.33302 10.3949 7.95228 10.2367 7.63589 9.92035ZM4.88905 12.6672C3.81026 11.5884 3.27088 10.292 3.27089 8.77812C3.27089 7.26421 3.81028 5.96786 4.88907 4.88907C5.96785 3.81028 7.2642 3.27089 8.77812 3.27089C10.292 3.27088 11.5884 3.81027 12.6672 4.88905C13.4251 5.64692 13.9148 6.52785 14.1365 7.53186C14.3581 8.53586 14.3144 9.51515 14.0052 10.4697L20.3706 16.8351L20.3706 20.3706L14.9449 20.357L14.6186 18.0589L12.2729 17.7121L11.8446 15.3801L10.4697 14.0052C9.51969 14.3098 8.54153 14.3524 7.53525 14.1331C6.52898 13.9137 5.64691 13.4251 4.88905 12.6672ZM5.94969 11.6065C6.6278 12.2847 7.41989 12.667 8.32598 12.7536C9.23208 12.8401 10.0582 12.6618 10.8042 12.2185L13.2384 14.6526L13.5525 16.3755L15.9444 16.7467L16.2272 18.8653L18.8653 18.8653L18.8653 17.4511L12.2185 10.8042C12.6618 10.0582 12.8401 9.23208 12.7536 8.32598C12.667 7.41989 12.2846 6.6278 11.6065 5.94969C10.8287 5.17188 9.88592 4.78297 8.77812 4.78297C7.67032 4.78297 6.72751 5.17188 5.94969 5.94969C5.17187 6.72751 4.78297 7.67032 4.78297 8.77812C4.78297 9.88592 5.17187 10.8287 5.94969 11.6065Z"
fill="currentColor" />
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

View file

@ -9,6 +9,11 @@ import './style.scss';
import { __ } from '@wordpress/i18n';
import { useSelect } from '@wordpress/data';
/**
* Internal dependencies
*/
import { ReactComponent as KeyIcon } from '../../../icons/key.svg';
export default function NotConnectedScreen() {
const { settingsPageURL } = useSelect((select) => {
const { getSettingsPageURL } = select('mind');
@ -20,7 +25,10 @@ export default function NotConnectedScreen() {
return (
<div className="mind-popup-connected-screen">
<h2>{__('OpenAI Key', 'mind')}</h2>
<h2>
<KeyIcon />
{__('OpenAI Key', 'mind')}
</h2>
<div>
<p>
{__(

View file

@ -10,6 +10,10 @@
text-align: center;
h2 {
display: flex;
gap: 7px;
align-items: center;
justify-content: center;
font-size: 16px;
font-weight: 500;
margin: 0;