diff --git a/src/assets/icons/ico/cog.svg b/src/assets/icons/ico/cog.svg new file mode 100644 index 0000000000000000000000000000000000000000..5cf7aa0e5820eda6ad714f8ef8f6994d8703807e --- /dev/null +++ b/src/assets/icons/ico/cog.svg @@ -0,0 +1,5 @@ +<svg width="25" height="25" viewBox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path + d="M19.9301 13.23C19.9701 12.91 20.0001 12.59 20.0001 12.25C20.0001 11.91 19.9701 11.59 19.9301 11.27L22.0401 9.62C22.2301 9.47 22.2801 9.2 22.1601 8.98L20.1601 5.52C20.0401 5.3 19.7701 5.22 19.5501 5.3L17.0601 6.3C16.5401 5.9 15.9801 5.57 15.3701 5.32L14.9901 2.67C14.9601 2.43 14.7501 2.25 14.5001 2.25H10.5001C10.2501 2.25 10.0401 2.43 10.0101 2.67L9.63008 5.32C9.02008 5.57 8.46008 5.91 7.94008 6.3L5.45008 5.3C5.22008 5.21 4.96008 5.3 4.84008 5.52L2.84008 8.98C2.71008 9.2 2.77008 9.47 2.96008 9.62L5.07008 11.27C5.03008 11.59 5.00008 11.92 5.00008 12.25C5.00008 12.58 5.03008 12.91 5.07008 13.23L2.96008 14.88C2.77008 15.03 2.72008 15.3 2.84008 15.52L4.84008 18.98C4.96008 19.2 5.23008 19.28 5.45008 19.2L7.94008 18.2C8.46008 18.6 9.02008 18.93 9.63008 19.18L10.0101 21.83C10.0401 22.07 10.2501 22.25 10.5001 22.25H14.5001C14.7501 22.25 14.9601 22.07 14.9901 21.83L15.3701 19.18C15.9801 18.93 16.5401 18.59 17.0601 18.2L19.5501 19.2C19.7801 19.29 20.0401 19.2 20.1601 18.98L22.1601 15.52C22.2801 15.3 22.2301 15.03 22.0401 14.88L19.9301 13.23ZM12.5001 15.75C10.5701 15.75 9.00008 14.18 9.00008 12.25C9.00008 10.32 10.5701 8.75 12.5001 8.75C14.4301 8.75 16.0001 10.32 16.0001 12.25C16.0001 14.18 14.4301 15.75 12.5001 15.75Z" + fill="white" /> +</svg> \ No newline at end of file diff --git a/src/assets/icons/ico/coin-elec.svg b/src/assets/icons/ico/coin-elec.svg new file mode 100644 index 0000000000000000000000000000000000000000..e349d68d7ecc8853d9340efe813ca8a05ac5156f --- /dev/null +++ b/src/assets/icons/ico/coin-elec.svg @@ -0,0 +1,6 @@ +<svg width="32" height="33" viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg"> + <rect y="0.25" width="32" height="32" rx="8" fill="#544232" /> + <path + d="M9.786 15.042H11.249C11.4177 14.1473 11.6853 13.3407 12.052 12.622C12.4187 11.896 12.866 11.28 13.394 10.774C13.922 10.268 14.5197 9.87933 15.187 9.608C15.8543 9.32933 16.5803 9.19 17.365 9.19C18.3843 9.19 19.257 9.388 19.983 9.784C20.709 10.1727 21.3177 10.7007 21.809 11.368L20.852 12.402C20.7787 12.4827 20.7017 12.556 20.621 12.622C20.5403 12.6807 20.4267 12.71 20.28 12.71C20.1773 12.71 20.082 12.6807 19.994 12.622C19.9133 12.5633 19.8217 12.49 19.719 12.402C19.6163 12.314 19.5027 12.2187 19.378 12.116C19.2533 12.0133 19.103 11.918 18.927 11.83C18.7583 11.742 18.5567 11.6687 18.322 11.61C18.0873 11.5513 17.8087 11.522 17.486 11.522C16.6207 11.522 15.891 11.819 15.297 12.413C14.703 13.007 14.2887 13.8833 14.054 15.042H19.576V15.878C19.576 16.0467 19.5063 16.2043 19.367 16.351C19.235 16.4903 19.0517 16.56 18.817 16.56H13.867C13.8597 16.6847 13.856 16.8093 13.856 16.934C13.856 17.0513 13.856 17.1723 13.856 17.297C13.856 17.385 13.856 17.473 13.856 17.561C13.856 17.649 13.8597 17.7333 13.867 17.814H18.531V18.639C18.531 18.8077 18.4613 18.9653 18.322 19.112C18.1827 19.2513 17.9993 19.321 17.772 19.321H13.999C14.2043 20.5823 14.5967 21.5247 15.176 22.148C15.7627 22.764 16.4887 23.072 17.354 23.072C17.882 23.072 18.3037 23.0023 18.619 22.863C18.9417 22.7163 19.202 22.555 19.4 22.379C19.6053 22.203 19.774 22.0453 19.906 21.906C20.0453 21.7593 20.1957 21.686 20.357 21.686C20.4377 21.686 20.5073 21.7007 20.566 21.73C20.6247 21.752 20.687 21.7997 20.753 21.873L21.93 22.951C21.4167 23.743 20.764 24.3517 19.972 24.777C19.18 25.195 18.2597 25.404 17.211 25.404C16.3457 25.404 15.5683 25.261 14.879 24.975C14.197 24.6817 13.603 24.271 13.097 23.743C12.591 23.215 12.1767 22.577 11.854 21.829C11.5387 21.081 11.315 20.245 11.183 19.321H9.786V17.814H11.062C11.0547 17.7333 11.051 17.649 11.051 17.561C11.051 17.473 11.051 17.385 11.051 17.297C11.051 17.1723 11.051 17.0513 11.051 16.934C11.051 16.8093 11.0547 16.6847 11.062 16.56H9.786V15.042Z" + fill="#D87B39" /> +</svg> \ No newline at end of file diff --git a/src/assets/icons/ico/coin-gas.svg b/src/assets/icons/ico/coin-gas.svg new file mode 100644 index 0000000000000000000000000000000000000000..d73d473869c2ff10e9b5f8a48c0d1c67148b6e63 --- /dev/null +++ b/src/assets/icons/ico/coin-gas.svg @@ -0,0 +1,6 @@ +<svg width="32" height="33" viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg"> + <rect y="0.25" width="32" height="32" rx="8" fill="#2F4F43" /> + <path + d="M9.786 15.042H11.249C11.4177 14.1473 11.6853 13.3407 12.052 12.622C12.4187 11.896 12.866 11.28 13.394 10.774C13.922 10.268 14.5197 9.87933 15.187 9.608C15.8543 9.32933 16.5803 9.19 17.365 9.19C18.3843 9.19 19.257 9.388 19.983 9.784C20.709 10.1727 21.3177 10.7007 21.809 11.368L20.852 12.402C20.7787 12.4827 20.7017 12.556 20.621 12.622C20.5403 12.6807 20.4267 12.71 20.28 12.71C20.1773 12.71 20.082 12.6807 19.994 12.622C19.9133 12.5633 19.8217 12.49 19.719 12.402C19.6163 12.314 19.5027 12.2187 19.378 12.116C19.2533 12.0133 19.103 11.918 18.927 11.83C18.7583 11.742 18.5567 11.6687 18.322 11.61C18.0873 11.5513 17.8087 11.522 17.486 11.522C16.6207 11.522 15.891 11.819 15.297 12.413C14.703 13.007 14.2887 13.8833 14.054 15.042H19.576V15.878C19.576 16.0467 19.5063 16.2043 19.367 16.351C19.235 16.4903 19.0517 16.56 18.817 16.56H13.867C13.8597 16.6847 13.856 16.8093 13.856 16.934C13.856 17.0513 13.856 17.1723 13.856 17.297C13.856 17.385 13.856 17.473 13.856 17.561C13.856 17.649 13.8597 17.7333 13.867 17.814H18.531V18.639C18.531 18.8077 18.4613 18.9653 18.322 19.112C18.1827 19.2513 17.9993 19.321 17.772 19.321H13.999C14.2043 20.5823 14.5967 21.5247 15.176 22.148C15.7627 22.764 16.4887 23.072 17.354 23.072C17.882 23.072 18.3037 23.0023 18.619 22.863C18.9417 22.7163 19.202 22.555 19.4 22.379C19.6053 22.203 19.774 22.0453 19.906 21.906C20.0453 21.7593 20.1957 21.686 20.357 21.686C20.4377 21.686 20.5073 21.7007 20.566 21.73C20.6247 21.752 20.687 21.7997 20.753 21.873L21.93 22.951C21.4167 23.743 20.764 24.3517 19.972 24.777C19.18 25.195 18.2597 25.404 17.211 25.404C16.3457 25.404 15.5683 25.261 14.879 24.975C14.197 24.6817 13.603 24.271 13.097 23.743C12.591 23.215 12.1767 22.577 11.854 21.829C11.5387 21.081 11.315 20.245 11.183 19.321H9.786V17.814H11.062C11.0547 17.7333 11.051 17.649 11.051 17.561C11.051 17.473 11.051 17.385 11.051 17.297C11.051 17.1723 11.051 17.0513 11.051 16.934C11.051 16.8093 11.0547 16.6847 11.062 16.56H9.786V15.042Z" + fill="#45D1B8" /> +</svg> \ No newline at end of file diff --git a/src/assets/icons/ico/coin-water.svg b/src/assets/icons/ico/coin-water.svg new file mode 100644 index 0000000000000000000000000000000000000000..8ac0a688e879a99e01eb8d782d44305f10754053 --- /dev/null +++ b/src/assets/icons/ico/coin-water.svg @@ -0,0 +1,6 @@ +<svg width="32" height="33" viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg"> + <rect y="0.25" width="32" height="32" rx="8" fill="#3D516D" /> + <path + d="M9.786 15.042H11.249C11.4177 14.1473 11.6853 13.3407 12.052 12.622C12.4187 11.896 12.866 11.28 13.394 10.774C13.922 10.268 14.5197 9.87933 15.187 9.608C15.8543 9.32933 16.5803 9.19 17.365 9.19C18.3843 9.19 19.257 9.388 19.983 9.784C20.709 10.1727 21.3177 10.7007 21.809 11.368L20.852 12.402C20.7787 12.4827 20.7017 12.556 20.621 12.622C20.5403 12.6807 20.4267 12.71 20.28 12.71C20.1773 12.71 20.082 12.6807 19.994 12.622C19.9133 12.5633 19.8217 12.49 19.719 12.402C19.6163 12.314 19.5027 12.2187 19.378 12.116C19.2533 12.0133 19.103 11.918 18.927 11.83C18.7583 11.742 18.5567 11.6687 18.322 11.61C18.0873 11.5513 17.8087 11.522 17.486 11.522C16.6207 11.522 15.891 11.819 15.297 12.413C14.703 13.007 14.2887 13.8833 14.054 15.042H19.576V15.878C19.576 16.0467 19.5063 16.2043 19.367 16.351C19.235 16.4903 19.0517 16.56 18.817 16.56H13.867C13.8597 16.6847 13.856 16.8093 13.856 16.934C13.856 17.0513 13.856 17.1723 13.856 17.297C13.856 17.385 13.856 17.473 13.856 17.561C13.856 17.649 13.8597 17.7333 13.867 17.814H18.531V18.639C18.531 18.8077 18.4613 18.9653 18.322 19.112C18.1827 19.2513 17.9993 19.321 17.772 19.321H13.999C14.2043 20.5823 14.5967 21.5247 15.176 22.148C15.7627 22.764 16.4887 23.072 17.354 23.072C17.882 23.072 18.3037 23.0023 18.619 22.863C18.9417 22.7163 19.202 22.555 19.4 22.379C19.6053 22.203 19.774 22.0453 19.906 21.906C20.0453 21.7593 20.1957 21.686 20.357 21.686C20.4377 21.686 20.5073 21.7007 20.566 21.73C20.6247 21.752 20.687 21.7997 20.753 21.873L21.93 22.951C21.4167 23.743 20.764 24.3517 19.972 24.777C19.18 25.195 18.2597 25.404 17.211 25.404C16.3457 25.404 15.5683 25.261 14.879 24.975C14.197 24.6817 13.603 24.271 13.097 23.743C12.591 23.215 12.1767 22.577 11.854 21.829C11.5387 21.081 11.315 20.245 11.183 19.321H9.786V17.814H11.062C11.0547 17.7333 11.051 17.649 11.051 17.561C11.051 17.473 11.051 17.385 11.051 17.297C11.051 17.1723 11.051 17.0513 11.051 16.934C11.051 16.8093 11.0547 16.6847 11.062 16.56H9.786V15.042Z" + fill="#61B4FF" /> +</svg> \ No newline at end of file diff --git a/src/assets/icons/ico/compare-elec.svg b/src/assets/icons/ico/compare-elec.svg new file mode 100644 index 0000000000000000000000000000000000000000..397f894bf71d6cc5ea4d8e513d9d875c006fe07d --- /dev/null +++ b/src/assets/icons/ico/compare-elec.svg @@ -0,0 +1,6 @@ +<svg width="32" height="33" viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg"> + <rect y="0.25" width="32" height="32" rx="8" fill="#544232" /> + <path fill-rule="evenodd" clip-rule="evenodd" + d="M16.9375 9.375C16.9375 9.12636 16.8387 8.8879 16.6629 8.71209C16.4871 8.53627 16.2487 8.4375 16 8.4375C15.7514 8.4375 15.5129 8.53627 15.3371 8.71209C15.1613 8.8879 15.0625 9.12636 15.0625 9.375V10.01C13.1255 10.0549 11.194 10.2361 9.28251 10.5525C9.03719 10.5933 8.81811 10.7298 8.67347 10.9321C8.52883 11.1344 8.47049 11.3859 8.51126 11.6312C8.55204 11.8766 8.6886 12.0957 8.89091 12.2403C9.09321 12.3849 9.34469 12.4433 9.59001 12.4025L9.75251 12.3763L8.26751 18.3138C8.21972 18.5057 8.23389 18.7079 8.30798 18.8913C8.38207 19.0748 8.5123 19.2301 8.68001 19.335C9.3757 19.7698 10.1796 20.0002 11 20C11.8204 20.0002 12.6243 19.7698 13.32 19.335C13.488 19.23 13.6184 19.0745 13.6925 18.8908C13.7666 18.7071 13.7806 18.5047 13.7325 18.3125L12.17 12.0625C13.1316 11.9677 14.0965 11.9089 15.0625 11.8862V21.265C13.9592 21.3 12.8729 21.3942 11.8038 21.5475C11.5576 21.5828 11.3356 21.7145 11.1865 21.9135C11.0374 22.1125 10.9735 22.3626 11.0088 22.6087C11.0441 22.8549 11.1757 23.077 11.3747 23.226C11.5738 23.3751 11.8239 23.4391 12.07 23.4037C14.6767 23.0308 17.3233 23.0308 19.93 23.4037C20.0519 23.4212 20.176 23.4145 20.2953 23.384C20.4146 23.3536 20.5267 23.2999 20.6253 23.226C20.7238 23.1522 20.8069 23.0597 20.8697 22.9538C20.9325 22.8479 20.9738 22.7306 20.9913 22.6087C21.0087 22.4869 21.0021 22.3627 20.9716 22.2434C20.9411 22.1241 20.8874 22.012 20.8136 21.9135C20.7397 21.8149 20.6472 21.7319 20.5413 21.6691C20.4354 21.6063 20.3181 21.565 20.1963 21.5475C19.116 21.3941 18.0281 21.2998 16.9375 21.265V11.8862C17.9108 11.9096 18.875 11.9679 19.83 12.0613L18.2675 18.3125C18.2193 18.5045 18.2331 18.7069 18.307 18.8906C18.3809 19.0742 18.511 19.2298 18.6788 19.335C19.3745 19.7698 20.1784 20.0002 20.9988 20C21.8191 20.0002 22.6231 19.7698 23.3188 19.335C23.4867 19.23 23.6171 19.0745 23.6912 18.8908C23.7653 18.7071 23.7793 18.5047 23.7313 18.3125L22.2463 12.375L22.4088 12.4025C22.6541 12.4434 22.9056 12.3853 23.1081 12.2407C23.3105 12.0962 23.4472 11.8772 23.4881 11.6319C23.5291 11.3865 23.4709 11.135 23.3264 10.9326C23.1819 10.7302 22.9628 10.5934 22.7175 10.5525C20.806 10.2361 18.8745 10.0549 16.9375 10.01V9.375ZM10.275 18.0188C10.7477 18.162 11.2523 18.162 11.725 18.0188L11 15.115L10.275 18.0188ZM21 18.125C20.7536 18.1256 20.5085 18.0898 20.2725 18.0188L21 15.115L21.725 18.0188C21.4899 18.0896 21.2456 18.1254 21 18.125Z" + fill="#E0B495" /> +</svg> \ No newline at end of file diff --git a/src/assets/icons/ico/compare-gas.svg b/src/assets/icons/ico/compare-gas.svg new file mode 100644 index 0000000000000000000000000000000000000000..2783c829249cd3d4ef23b7326ae88b487be49191 --- /dev/null +++ b/src/assets/icons/ico/compare-gas.svg @@ -0,0 +1,6 @@ +<svg width="32" height="33" viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg"> + <rect y="0.25" width="32" height="32" rx="8" fill="#2F4F43" /> + <path fill-rule="evenodd" clip-rule="evenodd" + d="M16.9375 9.375C16.9375 9.12636 16.8387 8.8879 16.6629 8.71209C16.4871 8.53627 16.2487 8.4375 16 8.4375C15.7514 8.4375 15.5129 8.53627 15.3371 8.71209C15.1613 8.8879 15.0625 9.12636 15.0625 9.375V10.01C13.1255 10.0549 11.194 10.2361 9.28251 10.5525C9.03719 10.5933 8.81811 10.7298 8.67347 10.9321C8.52883 11.1344 8.47049 11.3859 8.51126 11.6312C8.55204 11.8766 8.6886 12.0957 8.89091 12.2403C9.09321 12.3849 9.34469 12.4433 9.59001 12.4025L9.75251 12.3763L8.26751 18.3138C8.21972 18.5057 8.23389 18.7079 8.30798 18.8913C8.38207 19.0748 8.5123 19.2301 8.68001 19.335C9.3757 19.7698 10.1796 20.0002 11 20C11.8204 20.0002 12.6243 19.7698 13.32 19.335C13.488 19.23 13.6184 19.0745 13.6925 18.8908C13.7666 18.7071 13.7806 18.5047 13.7325 18.3125L12.17 12.0625C13.1316 11.9677 14.0965 11.9089 15.0625 11.8862V21.265C13.9592 21.3 12.8729 21.3942 11.8038 21.5475C11.5576 21.5828 11.3356 21.7145 11.1865 21.9135C11.0374 22.1125 10.9735 22.3626 11.0088 22.6087C11.0441 22.8549 11.1757 23.077 11.3747 23.226C11.5738 23.3751 11.8239 23.4391 12.07 23.4037C14.6767 23.0308 17.3233 23.0308 19.93 23.4037C20.0519 23.4212 20.176 23.4145 20.2953 23.384C20.4146 23.3536 20.5267 23.2999 20.6253 23.226C20.7238 23.1522 20.8069 23.0597 20.8697 22.9538C20.9325 22.8479 20.9738 22.7306 20.9913 22.6087C21.0087 22.4869 21.0021 22.3627 20.9716 22.2434C20.9411 22.1241 20.8874 22.012 20.8136 21.9135C20.7397 21.8149 20.6472 21.7319 20.5413 21.6691C20.4354 21.6063 20.3181 21.565 20.1963 21.5475C19.116 21.3941 18.0281 21.2998 16.9375 21.265V11.8862C17.9108 11.9096 18.875 11.9679 19.83 12.0613L18.2675 18.3125C18.2193 18.5045 18.2331 18.7069 18.307 18.8906C18.3809 19.0742 18.511 19.2298 18.6788 19.335C19.3745 19.7698 20.1784 20.0002 20.9988 20C21.8191 20.0002 22.6231 19.7698 23.3188 19.335C23.4867 19.23 23.6171 19.0745 23.6912 18.8908C23.7653 18.7071 23.7793 18.5047 23.7313 18.3125L22.2463 12.375L22.4088 12.4025C22.6541 12.4434 22.9056 12.3853 23.1081 12.2407C23.3105 12.0962 23.4472 11.8772 23.4881 11.6319C23.5291 11.3865 23.4709 11.135 23.3264 10.9326C23.1819 10.7302 22.9628 10.5934 22.7175 10.5525C20.806 10.2361 18.8745 10.0549 16.9375 10.01V9.375ZM10.275 18.0188C10.7477 18.162 11.2523 18.162 11.725 18.0188L11 15.115L10.275 18.0188ZM21 18.125C20.7536 18.1256 20.5085 18.0898 20.2725 18.0188L21 15.115L21.725 18.0188C21.4899 18.0896 21.2456 18.1254 21 18.125Z" + fill="#B3F2E7" /> +</svg> \ No newline at end of file diff --git a/src/assets/icons/ico/compare-water.svg b/src/assets/icons/ico/compare-water.svg new file mode 100644 index 0000000000000000000000000000000000000000..17ad51cf59d9f1f1ce2ba61912e5c174aaabf646 --- /dev/null +++ b/src/assets/icons/ico/compare-water.svg @@ -0,0 +1,6 @@ +<svg width="32" height="33" viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg"> + <rect y="0.25" width="32" height="32" rx="8" fill="#3D516D" /> + <path fill-rule="evenodd" clip-rule="evenodd" + d="M16.9375 9.375C16.9375 9.12636 16.8387 8.8879 16.6629 8.71209C16.4871 8.53627 16.2487 8.4375 16 8.4375C15.7514 8.4375 15.5129 8.53627 15.3371 8.71209C15.1613 8.8879 15.0625 9.12636 15.0625 9.375V10.01C13.1255 10.0549 11.194 10.2361 9.28251 10.5525C9.03719 10.5933 8.81811 10.7298 8.67347 10.9321C8.52883 11.1344 8.47049 11.3859 8.51126 11.6312C8.55204 11.8766 8.6886 12.0957 8.89091 12.2403C9.09321 12.3849 9.34469 12.4433 9.59001 12.4025L9.75251 12.3763L8.26751 18.3138C8.21972 18.5057 8.23389 18.7079 8.30798 18.8913C8.38207 19.0748 8.5123 19.2301 8.68001 19.335C9.3757 19.7698 10.1796 20.0002 11 20C11.8204 20.0002 12.6243 19.7698 13.32 19.335C13.488 19.23 13.6184 19.0745 13.6925 18.8908C13.7666 18.7071 13.7806 18.5047 13.7325 18.3125L12.17 12.0625C13.1316 11.9677 14.0965 11.9089 15.0625 11.8862V21.265C13.9592 21.3 12.8729 21.3942 11.8038 21.5475C11.5576 21.5828 11.3356 21.7145 11.1865 21.9135C11.0374 22.1125 10.9735 22.3626 11.0088 22.6087C11.0441 22.8549 11.1757 23.077 11.3747 23.226C11.5738 23.3751 11.8239 23.4391 12.07 23.4037C14.6767 23.0308 17.3233 23.0308 19.93 23.4037C20.0519 23.4212 20.176 23.4145 20.2953 23.384C20.4146 23.3536 20.5267 23.2999 20.6253 23.226C20.7238 23.1522 20.8069 23.0597 20.8697 22.9538C20.9325 22.8479 20.9738 22.7306 20.9913 22.6087C21.0087 22.4869 21.0021 22.3627 20.9716 22.2434C20.9411 22.1241 20.8874 22.012 20.8136 21.9135C20.7397 21.8149 20.6472 21.7319 20.5413 21.6691C20.4354 21.6063 20.3181 21.565 20.1963 21.5475C19.116 21.3941 18.0281 21.2998 16.9375 21.265V11.8862C17.9108 11.9096 18.875 11.9679 19.83 12.0613L18.2675 18.3125C18.2193 18.5045 18.2331 18.7069 18.307 18.8906C18.3809 19.0742 18.511 19.2298 18.6788 19.335C19.3745 19.7698 20.1784 20.0002 20.9988 20C21.8191 20.0002 22.6231 19.7698 23.3188 19.335C23.4867 19.23 23.6171 19.0745 23.6912 18.8908C23.7653 18.7071 23.7793 18.5047 23.7313 18.3125L22.2463 12.375L22.4088 12.4025C22.6541 12.4434 22.9056 12.3853 23.1081 12.2407C23.3105 12.0962 23.4472 11.8772 23.4881 11.6319C23.5291 11.3865 23.4709 11.135 23.3264 10.9326C23.1819 10.7302 22.9628 10.5934 22.7175 10.5525C20.806 10.2361 18.8745 10.0549 16.9375 10.01V9.375ZM10.275 18.0188C10.7477 18.162 11.2523 18.162 11.725 18.0188L11 15.115L10.275 18.0188ZM21 18.125C20.7536 18.1256 20.5085 18.0898 20.2725 18.0188L21 15.115L21.725 18.0188C21.4899 18.0896 21.2456 18.1254 21 18.125Z" + fill="#9EC4E6" /> +</svg> \ No newline at end of file diff --git a/src/assets/icons/ico/legendComparisoPrevious.svg b/src/assets/icons/ico/legendComparisoPrevious.svg deleted file mode 100644 index 8523b05083cd712bca5edd07711ac90236b7500b..0000000000000000000000000000000000000000 --- a/src/assets/icons/ico/legendComparisoPrevious.svg +++ /dev/null @@ -1,5 +0,0 @@ -<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg"> - <path fill-rule="evenodd" clip-rule="evenodd" - d="M0 -0.75C0.552285 -0.75 1 -1.19772 1 -1.75C1 -2.30228 0.552285 -2.75 0 -2.75C-0.552285 -2.75 -1 -2.30228 -1 -1.75C-1 -1.19772 -0.552285 -0.75 0 -0.75ZM4 -0.75C4.55228 -0.75 5 -1.19772 5 -1.75C5 -2.30228 4.55228 -2.75 4 -2.75C3.44772 -2.75 3 -2.30228 3 -1.75C3 -1.19772 3.44772 -0.75 4 -0.75ZM9 -1.75C9 -1.19772 8.55229 -0.75 8 -0.75C7.44771 -0.75 7 -1.19772 7 -1.75C7 -2.30228 7.44771 -2.75 8 -2.75C8.55229 -2.75 9 -2.30228 9 -1.75ZM12 -0.75C12.5523 -0.75 13 -1.19772 13 -1.75C13 -2.30228 12.5523 -2.75 12 -2.75C11.4477 -2.75 11 -2.30228 11 -1.75C11 -1.19772 11.4477 -0.75 12 -0.75ZM17 -1.75C17 -1.19772 16.5523 -0.75 16 -0.75C15.4477 -0.75 15 -1.19772 15 -1.75C15 -2.30228 15.4477 -2.75 16 -2.75C16.5523 -2.75 17 -2.30228 17 -1.75ZM0 3.25C0.552285 3.25 1 2.80228 1 2.25C1 1.69772 0.552285 1.25 0 1.25C-0.552285 1.25 -1 1.69772 -1 2.25C-1 2.80228 -0.552285 3.25 0 3.25ZM5 2.25C5 2.80228 4.55228 3.25 4 3.25C3.44772 3.25 3 2.80228 3 2.25C3 1.69772 3.44772 1.25 4 1.25C4.55228 1.25 5 1.69772 5 2.25ZM8 3.25C8.55229 3.25 9 2.80228 9 2.25C9 1.69772 8.55229 1.25 8 1.25C7.44771 1.25 7 1.69772 7 2.25C7 2.80228 7.44771 3.25 8 3.25ZM13 2.25C13 2.80228 12.5523 3.25 12 3.25C11.4477 3.25 11 2.80228 11 2.25C11 1.69772 11.4477 1.25 12 1.25C12.5523 1.25 13 1.69772 13 2.25ZM16 3.25C16.5523 3.25 17 2.80228 17 2.25C17 1.69772 16.5523 1.25 16 1.25C15.4477 1.25 15 1.69772 15 2.25C15 2.80228 15.4477 3.25 16 3.25ZM1 6.25C1 6.80229 0.552285 7.25 0 7.25C-0.552285 7.25 -1 6.80229 -1 6.25C-1 5.69771 -0.552285 5.25 0 5.25C0.552285 5.25 1 5.69771 1 6.25ZM4 7.25C4.55228 7.25 5 6.80229 5 6.25C5 5.69771 4.55228 5.25 4 5.25C3.44772 5.25 3 5.69771 3 6.25C3 6.80229 3.44772 7.25 4 7.25ZM9 6.25C9 6.80229 8.55229 7.25 8 7.25C7.44771 7.25 7 6.80229 7 6.25C7 5.69771 7.44771 5.25 8 5.25C8.55229 5.25 9 5.69771 9 6.25ZM12 7.25C12.5523 7.25 13 6.80229 13 6.25C13 5.69771 12.5523 5.25 12 5.25C11.4477 5.25 11 5.69771 11 6.25C11 6.80229 11.4477 7.25 12 7.25ZM17 6.25C17 6.80229 16.5523 7.25 16 7.25C15.4477 7.25 15 6.80229 15 6.25C15 5.69771 15.4477 5.25 16 5.25C16.5523 5.25 17 5.69771 17 6.25ZM0 11.25C0.552285 11.25 1 10.8023 1 10.25C1 9.69771 0.552285 9.25 0 9.25C-0.552285 9.25 -1 9.69771 -1 10.25C-1 10.8023 -0.552285 11.25 0 11.25ZM5 10.25C5 10.8023 4.55228 11.25 4 11.25C3.44772 11.25 3 10.8023 3 10.25C3 9.69771 3.44772 9.25 4 9.25C4.55228 9.25 5 9.69771 5 10.25ZM8 11.25C8.55229 11.25 9 10.8023 9 10.25C9 9.69771 8.55229 9.25 8 9.25C7.44771 9.25 7 9.69771 7 10.25C7 10.8023 7.44771 11.25 8 11.25ZM13 10.25C13 10.8023 12.5523 11.25 12 11.25C11.4477 11.25 11 10.8023 11 10.25C11 9.69771 11.4477 9.25 12 9.25C12.5523 9.25 13 9.69771 13 10.25ZM16 11.25C16.5523 11.25 17 10.8023 17 10.25C17 9.69771 16.5523 9.25 16 9.25C15.4477 9.25 15 9.69771 15 10.25C15 10.8023 15.4477 11.25 16 11.25ZM1 14.25C1 14.8023 0.552285 15.25 0 15.25C-0.552285 15.25 -1 14.8023 -1 14.25C-1 13.6977 -0.552285 13.25 0 13.25C0.552285 13.25 1 13.6977 1 14.25ZM4 15.25C4.55228 15.25 5 14.8023 5 14.25C5 13.6977 4.55228 13.25 4 13.25C3.44772 13.25 3 13.6977 3 14.25C3 14.8023 3.44772 15.25 4 15.25ZM9 14.25C9 14.8023 8.55229 15.25 8 15.25C7.44771 15.25 7 14.8023 7 14.25C7 13.6977 7.44771 13.25 8 13.25C8.55229 13.25 9 13.6977 9 14.25ZM12 15.25C12.5523 15.25 13 14.8023 13 14.25C13 13.6977 12.5523 13.25 12 13.25C11.4477 13.25 11 13.6977 11 14.25C11 14.8023 11.4477 15.25 12 15.25ZM17 14.25C17 14.8023 16.5523 15.25 16 15.25C15.4477 15.25 15 14.8023 15 14.25C15 13.6977 15.4477 13.25 16 13.25C16.5523 13.25 17 13.6977 17 14.25ZM0 19.25C0.552285 19.25 1 18.8023 1 18.25C1 17.6977 0.552285 17.25 0 17.25C-0.552285 17.25 -1 17.6977 -1 18.25C-1 18.8023 -0.552285 19.25 0 19.25ZM5 18.25C5 18.8023 4.55228 19.25 4 19.25C3.44772 19.25 3 18.8023 3 18.25C3 17.6977 3.44772 17.25 4 17.25C4.55228 17.25 5 17.6977 5 18.25ZM8 19.25C8.55229 19.25 9 18.8023 9 18.25C9 17.6977 8.55229 17.25 8 17.25C7.44771 17.25 7 17.6977 7 18.25C7 18.8023 7.44771 19.25 8 19.25ZM13 18.25C13 18.8023 12.5523 19.25 12 19.25C11.4477 19.25 11 18.8023 11 18.25C11 17.6977 11.4477 17.25 12 17.25C12.5523 17.25 13 17.6977 13 18.25ZM16 19.25C16.5523 19.25 17 18.8023 17 18.25C17 17.6977 16.5523 17.25 16 17.25C15.4477 17.25 15 17.6977 15 18.25C15 18.8023 15.4477 19.25 16 19.25Z" - fill="currentColor" /> -</svg> \ No newline at end of file diff --git a/src/assets/icons/visu/analysis/temperature-cold.svg b/src/assets/icons/visu/analysis/temperature-cold.svg index b344da5e9b9482dd811abf012136124e0a5510b5..62280b5e853af532e854a698806cf664572612cf 100644 --- a/src/assets/icons/visu/analysis/temperature-cold.svg +++ b/src/assets/icons/visu/analysis/temperature-cold.svg @@ -1,12 +1,12 @@ <svg width="40" height="41" viewBox="0 0 40 41" fill="none" xmlns="http://www.w3.org/2000/svg"> - <rect y="0.5" width="40" height="40" rx="4" fill="white" fill-opacity="0.1" /> - <g clip-path="url(#clip0_7384_9152)"> + <rect y="0.5" width="40" height="40" rx="8" fill="white" fill-opacity="0.1" /> + <g clip-path="url(#clip0_7485_37794)"> <path - d="M29.8266 17.8866C28.9066 13.2866 24.8666 9.83325 20.0133 9.83325C16.16 9.83325 12.8133 12.0199 11.1466 15.2199C7.13331 15.6466 4.01331 19.0466 4.01331 23.1666C4.01331 27.5799 7.59997 31.1666 12.0133 31.1666H29.3466C33.0266 31.1666 36.0133 28.1799 36.0133 24.4999C36.0133 20.9799 33.28 18.1266 29.8266 17.8866Z" + d="M29.8268 17.8866C28.9068 13.2866 24.8668 9.83331 20.0134 9.83331C16.1601 9.83331 12.8134 12.02 11.1468 15.22C7.13343 15.6466 4.01343 19.0466 4.01343 23.1666C4.01343 27.58 7.60009 31.1666 12.0134 31.1666H29.3468C33.0268 31.1666 36.0134 28.18 36.0134 24.5C36.0134 20.98 33.2801 18.1266 29.8268 17.8866Z" fill="white" /> </g> <defs> - <clipPath id="clip0_7384_9152"> + <clipPath id="clip0_7485_37794"> <rect width="32" height="32" fill="white" transform="translate(4 4.5)" /> </clipPath> </defs> diff --git a/src/assets/icons/visu/bulbEmpty.svg b/src/assets/icons/visu/bulbEmpty.svg index 4c5236c744c157d8670f81596cfcd53577085103..e5099d90d9dc7df9235129632f5c17abe385f8b4 100644 --- a/src/assets/icons/visu/bulbEmpty.svg +++ b/src/assets/icons/visu/bulbEmpty.svg @@ -1,5 +1,5 @@ -<svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg"> +<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path - d="M8.50001 2.00024C8.19334 2.00024 7.88001 2.02691 7.56667 2.09358C5.72667 2.44691 4.26001 3.93358 3.91334 5.77358C3.59334 7.51358 4.23334 9.11358 5.39334 10.1469C5.68001 10.4002 5.83334 10.7536 5.83334 11.1269V12.6669C5.83334 13.4002 6.43334 14.0002 7.16667 14.0002H7.35334C7.58667 14.4002 8.00667 14.6669 8.50001 14.6669C8.99334 14.6669 9.42001 14.4002 9.64667 14.0002H9.83334C10.5667 14.0002 11.1667 13.4002 11.1667 12.6669V11.1269C11.1667 10.7602 11.3133 10.4002 11.5933 10.1536C12.56 9.30024 13.1667 8.05358 13.1667 6.66691C13.1667 4.08691 11.08 2.00024 8.50001 2.00024ZM8.83334 9.33358H8.16667V7.60691L6.94667 6.39358L7.42001 5.92024L8.50001 7.00024L9.58001 5.92024L10.0533 6.39358L8.83334 7.61358V9.33358ZM9.50001 12.6669C9.49334 12.6669 9.48667 12.6602 9.48001 12.6602V12.6669H7.52001V12.6602C7.51334 12.6602 7.50667 12.6669 7.50001 12.6669C7.31334 12.6669 7.16667 12.5202 7.16667 12.3336C7.16667 12.1469 7.31334 12.0002 7.50001 12.0002C7.50667 12.0002 7.51334 12.0069 7.52001 12.0069V12.0002H9.48001V12.0069C9.48667 12.0069 9.49334 12.0002 9.50001 12.0002C9.68667 12.0002 9.83334 12.1469 9.83334 12.3336C9.83334 12.5202 9.68667 12.6669 9.50001 12.6669ZM9.50001 11.3336H7.50001C7.31334 11.3336 7.16667 11.1869 7.16667 11.0002C7.16667 10.8136 7.31334 10.6669 7.50001 10.6669H9.50001C9.68667 10.6669 9.83334 10.8136 9.83334 11.0002C9.83334 11.1869 9.68667 11.3336 9.50001 11.3336Z" + d="M11.9998 3C11.5398 3 11.0698 3.04 10.5998 3.14C7.83983 3.67 5.63983 5.9 5.11983 8.66C4.63983 11.27 5.59983 13.67 7.33983 15.22C7.76983 15.6 7.99983 16.13 7.99983 16.69V19C7.99983 20.1 8.89983 21 9.99983 21H10.2798C10.6298 21.6 11.2598 22 11.9998 22C12.7398 22 13.3798 21.6 13.7198 21H13.9998C15.0998 21 15.9998 20.1 15.9998 19V16.69C15.9998 16.14 16.2198 15.6 16.6398 15.23C18.0898 13.95 18.9998 12.08 18.9998 10C18.9998 6.13 15.8698 3 11.9998 3ZM12.4998 14H11.4998V11.41L9.66983 9.59L10.3798 8.88L11.9998 10.5L13.6198 8.88L14.3298 9.59L12.4998 11.42V14ZM13.4998 19C13.4898 19 13.4798 18.99 13.4698 18.99V19H10.5298V18.99C10.5198 18.99 10.5098 19 10.4998 19C10.2198 19 9.99983 18.78 9.99983 18.5C9.99983 18.22 10.2198 18 10.4998 18C10.5098 18 10.5198 18.01 10.5298 18.01V18H13.4698V18.01C13.4798 18.01 13.4898 18 13.4998 18C13.7798 18 13.9998 18.22 13.9998 18.5C13.9998 18.78 13.7798 19 13.4998 19ZM13.4998 17H10.4998C10.2198 17 9.99983 16.78 9.99983 16.5C9.99983 16.22 10.2198 16 10.4998 16H13.4998C13.7798 16 13.9998 16.22 13.9998 16.5C13.9998 16.78 13.7798 17 13.4998 17Z" fill="#3E414E" /> </svg> \ No newline at end of file diff --git a/src/assets/icons/visu/bulbFilled.svg b/src/assets/icons/visu/bulbFilled.svg index 0f47b034fd1448fe7a1befe4d2269df112e622de..0f0f6e2100ffc5dfc0ba61a4c7ebe75149c1422b 100644 --- a/src/assets/icons/visu/bulbFilled.svg +++ b/src/assets/icons/visu/bulbFilled.svg @@ -1,20 +1,5 @@ -<svg width="19" height="21" viewBox="0 0 19 21" fill="none" xmlns="http://www.w3.org/2000/svg"> - <g filter="url(#filter0_d_7458_86831)"> - <path - d="M9.50001 4.00024C9.19334 4.00024 8.88001 4.02691 8.56667 4.09358C6.72667 4.44691 5.26001 5.93358 4.91334 7.77358C4.59334 9.51358 5.23334 11.1136 6.39334 12.1469C6.68001 12.4002 6.83334 12.7536 6.83334 13.1269V14.6669C6.83334 15.4002 7.43334 16.0002 8.16667 16.0002H8.35334C8.58667 16.4002 9.00667 16.6669 9.50001 16.6669C9.99334 16.6669 10.42 16.4002 10.6467 16.0002H10.8333C11.5667 16.0002 12.1667 15.4002 12.1667 14.6669V13.1269C12.1667 12.7602 12.3133 12.4002 12.5933 12.1536C13.56 11.3002 14.1667 10.0536 14.1667 8.66691C14.1667 6.08691 12.08 4.00024 9.50001 4.00024ZM9.83334 11.3336H9.16667V9.60691L7.94667 8.39358L8.42001 7.92024L9.50001 9.00024L10.58 7.92024L11.0533 8.39358L9.83334 9.61358V11.3336ZM10.5 14.6669C10.4933 14.6669 10.4867 14.6602 10.48 14.6602V14.6669H8.52001V14.6602C8.51334 14.6602 8.50667 14.6669 8.50001 14.6669C8.31334 14.6669 8.16667 14.5202 8.16667 14.3336C8.16667 14.1469 8.31334 14.0002 8.50001 14.0002C8.50667 14.0002 8.51334 14.0069 8.52001 14.0069V14.0002H10.48V14.0069C10.4867 14.0069 10.4933 14.0002 10.5 14.0002C10.6867 14.0002 10.8333 14.1469 10.8333 14.3336C10.8333 14.5202 10.6867 14.6669 10.5 14.6669ZM10.5 13.3336H8.50001C8.31334 13.3336 8.16667 13.1869 8.16667 13.0002C8.16667 12.8136 8.31334 12.6669 8.50001 12.6669H10.5C10.6867 12.6669 10.8333 12.8136 10.8333 13.0002C10.8333 13.1869 10.6867 13.3336 10.5 13.3336Z" - fill="#F1C017" /> - </g> - <defs> - <filter id="filter0_d_7458_86831" x="-2.5" y="-1.99976" width="24" height="24" filterUnits="userSpaceOnUse" - color-interpolation-filters="sRGB"> - <feFlood flood-opacity="0" result="BackgroundImageFix" /> - <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" - result="hardAlpha" /> - <feOffset /> - <feGaussianBlur stdDeviation="2" /> - <feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 0.776471 0 0 0 0 0 0 0 0 0.5 0" /> - <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_7458_86831" /> - <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_7458_86831" result="shape" /> - </filter> - </defs> +<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path + d="M11.9998 3C11.5398 3 11.0698 3.04 10.5998 3.14C7.83983 3.67 5.63983 5.9 5.11983 8.66C4.63983 11.27 5.59983 13.67 7.33983 15.22C7.76983 15.6 7.99983 16.13 7.99983 16.69V19C7.99983 20.1 8.89983 21 9.99983 21H10.2798C10.6298 21.6 11.2598 22 11.9998 22C12.7398 22 13.3798 21.6 13.7198 21H13.9998C15.0998 21 15.9998 20.1 15.9998 19V16.69C15.9998 16.14 16.2198 15.6 16.6398 15.23C18.0898 13.95 18.9998 12.08 18.9998 10C18.9998 6.13 15.8698 3 11.9998 3ZM12.4998 14H11.4998V11.41L9.66983 9.59L10.3798 8.88L11.9998 10.5L13.6198 8.88L14.3298 9.59L12.4998 11.42V14ZM13.4998 19C13.4898 19 13.4798 18.99 13.4698 18.99V19H10.5298V18.99C10.5198 18.99 10.5098 19 10.4998 19C10.2198 19 9.99983 18.78 9.99983 18.5C9.99983 18.22 10.2198 18 10.4998 18C10.5098 18 10.5198 18.01 10.5298 18.01V18H13.4698V18.01C13.4798 18.01 13.4898 18 13.4998 18C13.7798 18 13.9998 18.22 13.9998 18.5C13.9998 18.78 13.7798 19 13.4998 19ZM13.4998 17H10.4998C10.2198 17 9.99983 16.78 9.99983 16.5C9.99983 16.22 10.2198 16 10.4998 16H13.4998C13.7798 16 13.9998 16.22 13.9998 16.5C13.9998 16.78 13.7798 17 13.4998 17Z" + fill="#F1C017" /> </svg> \ No newline at end of file diff --git a/src/components/Action/ActionBegin/actionBegin.scss b/src/components/Action/ActionBegin/actionBegin.scss index 47f4026150eb2dc79461663ae72807cc02c26e56..607a3211f82d4b28f0c8eb4886c7952cc991c3f1 100644 --- a/src/components/Action/ActionBegin/actionBegin.scss +++ b/src/components/Action/ActionBegin/actionBegin.scss @@ -31,6 +31,9 @@ @media (min-width: $width-large-desktop) { margin: 6rem 1rem 1rem 1rem; } + h1 { + margin-block: 0; + } .icon-container { width: 8.125rem; height: 8.125rem; @@ -70,7 +73,7 @@ .action-buttons { display: flex; flex-direction: column; - gap: 1rem; + gap: 8px; width: 100%; } } diff --git a/src/components/Action/ActionList/actionList.scss b/src/components/Action/ActionList/actionList.scss index 038a216c511e134d97407763266980321ab56f58..9e346a3f994f50c13047edd0976e1a5adb5a0245 100644 --- a/src/components/Action/ActionList/actionList.scss +++ b/src/components/Action/ActionList/actionList.scss @@ -10,5 +10,5 @@ gap: 1rem; width: 100%; box-sizing: border-box; - padding: 0 1.5rem; + padding: 0 1rem; } diff --git a/src/components/Analysis/Comparison/Comparison.tsx b/src/components/Analysis/Comparison/Comparison.tsx index 4229f556af4e3573f72a7dab1666c1b78c291990..ab7dd379c9190cff35e3391dbb4e8b71b7269650 100644 --- a/src/components/Analysis/Comparison/Comparison.tsx +++ b/src/components/Analysis/Comparison/Comparison.tsx @@ -98,7 +98,7 @@ const Comparison = ({ return ( <div className="comparison card rich-card"> - <div className="text-24-normal title">{t('analysis.compare.title')}</div> + <div className="text-20-normal title">{t('analysis.compare.title')}</div> {!isLoading && ( <ButtonGroup style={{ backgroundColor: 'var(--grey-0)' }}> <Button diff --git a/src/components/Analysis/Comparison/temperatureComparison.scss b/src/components/Analysis/Comparison/temperatureComparison.scss index 6d985a8d8d8b694d1c8da9568c8a20290b189f74..855a742d6865c72eff418ef5ec3dac059f7131a4 100644 --- a/src/components/Analysis/Comparison/temperatureComparison.scss +++ b/src/components/Analysis/Comparison/temperatureComparison.scss @@ -7,7 +7,6 @@ gap: 16px; border-radius: 8px; padding: 8px 4px 8px 12px; - box-shadow: 0px 4px 16px 0px $black-shadow; background-position: bottom right; background-repeat: no-repeat; height: 60px; diff --git a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis.tsx b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis.tsx index f3375b30ad76b8dec5409420951d5ddccc56891f..20069e774f800b57cab77f3da7faec3497b37bcd 100644 --- a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis.tsx +++ b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/ElecHalfHourMonthlyAnalysis.tsx @@ -180,7 +180,7 @@ const ElecHalfHourMonthlyAnalysis = ({ return ( <ElecHalfHourLayout> - <div className="text-24-normal title">{t('special_elec.average')}</div> + <div className="text-20-normal title">{t('special_elec.average')}</div> <ButtonGroup style={{ backgroundColor: 'var(--grey-0)' }}> <Button className={classNames('btnTab', { active: !isWeekend })} diff --git a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourMonthlyAnalysis.spec.tsx.snap b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourMonthlyAnalysis.spec.tsx.snap index 014cf98b8706369df9085b3ccf6084d7254ef00c..54788cf0577b80d0d86d3842672057a3eda92b8b 100644 --- a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourMonthlyAnalysis.spec.tsx.snap +++ b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourMonthlyAnalysis.spec.tsx.snap @@ -50,7 +50,7 @@ exports[`ElecHalfHourMonthlyAnalysis component should be rendered correctly when special_elec.title </div> <div - class="text-24-normal title" + class="text-20-normal title" > special_elec.average </div> diff --git a/src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.tsx b/src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.tsx index 277afc5d21343b0a90f05a3bd21a442660edf366..9c821866b69fc8ccdc2c6b8e287c7dfbc450facd 100644 --- a/src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.tsx +++ b/src/components/Analysis/MaxConsumptionCard/MaxConsumptionCard.tsx @@ -91,7 +91,7 @@ const MaxConsumptionCard = ({ return ( <div className="max-consumption-container" ref={containerRef}> - <div className="text-24-normal title">{t('analysis.max_day')}</div> + <div className="text-20-normal title">{t('analysis.max_day')}</div> <div className="fluid-navigation" role="tablist"> {fluidsWithData.map(fluid => ( <FluidMaxButton @@ -116,7 +116,7 @@ const MaxConsumptionCard = ({ )} {maxDayData && currentFluid !== undefined && ( <> - <div className="text-24-bold maxDay-date"> + <div className="text-16-bold maxDay-date"> {maxDayData.date.setLocale('fr').toFormat('cccc dd LLLL')} </div> <div> diff --git a/src/components/Analysis/MaxConsumptionCard/__snapshots__/MaxConsumptionCard.spec.tsx.snap b/src/components/Analysis/MaxConsumptionCard/__snapshots__/MaxConsumptionCard.spec.tsx.snap index 84a184e84ce80a08a73be32778f5a9f9aaa6389a..8844ebee0309f501048319c58f437937c3cf2cf0 100644 --- a/src/components/Analysis/MaxConsumptionCard/__snapshots__/MaxConsumptionCard.spec.tsx.snap +++ b/src/components/Analysis/MaxConsumptionCard/__snapshots__/MaxConsumptionCard.spec.tsx.snap @@ -6,7 +6,7 @@ exports[`MaxConsumptionCard component should be rendered correctly with 2 button class="max-consumption-container" > <div - class="text-24-normal title" + class="text-20-normal title" > analysis.max_day </div> @@ -77,7 +77,7 @@ exports[`MaxConsumptionCard component should be rendered correctly with 2 button class="data-container" > <div - class="text-24-bold maxDay-date" + class="text-16-bold maxDay-date" > jeudi 01 octobre </div> diff --git a/src/components/Analysis/ProfileComparator/ProfileComparator.tsx b/src/components/Analysis/ProfileComparator/ProfileComparator.tsx index 38bcecd66e800fdbc95ee94bfffc6cabf3296c0c..9d822f7209d1bbe6c94705f73b288c3f8fab92c1 100644 --- a/src/components/Analysis/ProfileComparator/ProfileComparator.tsx +++ b/src/components/Analysis/ProfileComparator/ProfileComparator.tsx @@ -5,6 +5,7 @@ import { } from '@material-ui/core' import Button from '@material-ui/core/Button' import chevronDown from 'assets/icons/ico/chevron-down.svg' +import CogIcon from 'assets/icons/ico/cog.svg' import StyledIcon from 'components/CommonKit/Icon/StyledIcon' import Loader from 'components/Loader/Loader' import { useClient } from 'cozy-client' @@ -32,7 +33,7 @@ const ProfileComparatorLayout = ({ const { t } = useI18n() return ( <div className="profileComparator"> - <div className="text-24-normal title">{t('analysis.average')}</div> + <div className="text-20-normal title">{t('analysis.average')}</div> {children} </div> ) @@ -146,9 +147,10 @@ const ProfileComparator = ({ </div> <Button onClick={() => navigate('/profileType')} - className="btnSecondary" + className="btnSecondary profileBtn" data-testid="goToProfile" > + <StyledIcon icon={CogIcon} size={24} /> {t('analysis.accessibility.button_go_to_profil')} </Button> </div> @@ -247,9 +249,10 @@ const ProfileComparator = ({ </Accordion> <Button onClick={() => navigate('/profileType')} - className="btnSecondary" + className="btnSecondary profileBtn" data-testid="iconGoToProfile" > + <StyledIcon icon={CogIcon} size={24} /> {t('analysis.average_edit_profile')} </Button> </div> diff --git a/src/components/Analysis/ProfileComparator/__snapshots__/ProfileComparator.spec.tsx.snap b/src/components/Analysis/ProfileComparator/__snapshots__/ProfileComparator.spec.tsx.snap index 5303711932b13831a6e8388c16b39869e88558a4..22df6713365b48e13b3c07e018a9b46c6aabc30c 100644 --- a/src/components/Analysis/ProfileComparator/__snapshots__/ProfileComparator.spec.tsx.snap +++ b/src/components/Analysis/ProfileComparator/__snapshots__/ProfileComparator.spec.tsx.snap @@ -6,7 +6,7 @@ exports[`AnalysisConsumption component should be rendered correctly with profile class="profileComparator" > <div - class="text-24-normal title" + class="text-20-normal title" > analysis.average </div> @@ -19,7 +19,7 @@ exports[`AnalysisConsumption component should be rendered correctly with profile analysis.approximative_description </div> <button - class="MuiButtonBase-root MuiButton-root MuiButton-text btnSecondary" + class="MuiButtonBase-root MuiButton-root MuiButton-text btnSecondary profileBtn" data-testid="goToProfile" tabindex="0" type="button" @@ -27,6 +27,16 @@ exports[`AnalysisConsumption component should be rendered correctly with profile <span class="MuiButton-label" > + <svg + aria-hidden="true" + class="styles__icon___23x3R" + height="24" + width="24" + > + <use + xlink:href="#test-file-stub" + /> + </svg> analysis.accessibility.button_go_to_profil </span> <span @@ -44,7 +54,7 @@ exports[`AnalysisConsumption component should be rendered correctly with profile class="profileComparator" > <div - class="text-24-normal title" + class="text-20-normal title" > analysis.average </div> @@ -165,7 +175,7 @@ exports[`AnalysisConsumption component should be rendered correctly with profile </div> </div> <button - class="MuiButtonBase-root MuiButton-root MuiButton-text btnSecondary" + class="MuiButtonBase-root MuiButton-root MuiButton-text btnSecondary profileBtn" data-testid="iconGoToProfile" tabindex="0" type="button" @@ -173,6 +183,16 @@ exports[`AnalysisConsumption component should be rendered correctly with profile <span class="MuiButton-label" > + <svg + aria-hidden="true" + class="styles__icon___23x3R" + height="24" + width="24" + > + <use + xlink:href="#test-file-stub" + /> + </svg> analysis.average_edit_profile </span> </button> diff --git a/src/components/Analysis/ProfileComparator/profileComparator.scss b/src/components/Analysis/ProfileComparator/profileComparator.scss index 3e3f52ad827eddc7a55401e338b079760e61a1a1..7e2aaac5954b88ce9963b713ff72a79e97e5dcef 100644 --- a/src/components/Analysis/ProfileComparator/profileComparator.scss +++ b/src/components/Analysis/ProfileComparator/profileComparator.scss @@ -50,6 +50,11 @@ align-items: center; margin: auto; } + + .profileBtn span { + display: flex; + gap: 10px; + } } .no-profile { display: flex; @@ -63,8 +68,4 @@ button { max-width: $width-small-phone; } - - svg { - width: 100%; - } } diff --git a/src/components/Analysis/TotalAnalysisChart/TotalAnalysisChart.tsx b/src/components/Analysis/TotalAnalysisChart/TotalAnalysisChart.tsx index b1b96f2a4d9bffa8736434b62309a07fa7fa47b4..aa6af8c2b12b7ff370fb14391cef32367dfa7e57 100644 --- a/src/components/Analysis/TotalAnalysisChart/TotalAnalysisChart.tsx +++ b/src/components/Analysis/TotalAnalysisChart/TotalAnalysisChart.tsx @@ -82,7 +82,7 @@ const TotalAnalysisChart = ({ minHeight: radius + 100, }} > - <div className="text-24-normal title">{t('analysis_pie.total')}</div> + <div className="text-20-normal title">{t('analysis_pie.total')}</div> {isLoading && <Loader />} {!isLoading && !dataLoadValueDetailArray && emptyPieChart()} diff --git a/src/components/Analysis/TotalAnalysisChart/__snapshots__/TotalAnalysisChart.spec.tsx.snap b/src/components/Analysis/TotalAnalysisChart/__snapshots__/TotalAnalysisChart.spec.tsx.snap index 2d3ef40fea5a007e68bb24e56091fbc807579f18..85994855b8f434e24c49e1278534e5871971360a 100644 --- a/src/components/Analysis/TotalAnalysisChart/__snapshots__/TotalAnalysisChart.spec.tsx.snap +++ b/src/components/Analysis/TotalAnalysisChart/__snapshots__/TotalAnalysisChart.spec.tsx.snap @@ -7,7 +7,7 @@ exports[`TotalAnalysisChart component should be rendered correctly 1`] = ` style="min-height: 475px;" > <div - class="text-24-normal title" + class="text-20-normal title" > analysis_pie.total </div> diff --git a/src/components/Analysis/monthlyanalysis.scss b/src/components/Analysis/monthlyanalysis.scss index 8ca80974c6fd745853de8cc1a902b43328ea88b8..e9038cd84a1be8d773ab8451bc7799e3b2c19535 100644 --- a/src/components/Analysis/monthlyanalysis.scss +++ b/src/components/Analysis/monthlyanalysis.scss @@ -14,6 +14,7 @@ .title { text-align: center; color: $grey-bright; + text-wrap: balance; } } } diff --git a/src/components/Challenge/ChallengeCardLast/challengeCardLast.scss b/src/components/Challenge/ChallengeCardLast/challengeCardLast.scss index 9d07ac51aca4a2175d582cd5f24802e311b035fe..be932e68cd994e8da946f0e3f6a7489b01f69bd5 100644 --- a/src/components/Challenge/ChallengeCardLast/challengeCardLast.scss +++ b/src/components/Challenge/ChallengeCardLast/challengeCardLast.scss @@ -8,6 +8,7 @@ transition: all 300ms ease; background-color: $grey-1; border: 1px solid $grey-2; + box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.12); border-radius: 4px; text-align: center; display: flex; diff --git a/src/components/CommonKit/Card/StyledCard.tsx b/src/components/CommonKit/Card/StyledCard.tsx index 7b4516a27ea90892e35695a5ce3401ff2badad9b..13a419cdc9f3bf602722f3eec171bef0815f9e9c 100644 --- a/src/components/CommonKit/Card/StyledCard.tsx +++ b/src/components/CommonKit/Card/StyledCard.tsx @@ -10,6 +10,8 @@ import { getFluidName } from 'utils/utils' const CardBase = withStyles({ root: { background: 'var(--grey-1)', + border: '1px solid var(--grey-2)', + boxShadow: '0px 4px 16px 0px rgba(0, 0, 0, 0.12)', boxSizing: 'border-box', borderRadius: '4px', }, diff --git a/src/components/CommonKit/Card/StyledEcogestureCard.tsx b/src/components/CommonKit/Card/StyledEcogestureCard.tsx index f6b3ac02cd6b3a6de7f6c450b4d170a732dbd4f3..2c80d5cf38c7440b199e56bb3cd128e495d9506d 100644 --- a/src/components/CommonKit/Card/StyledEcogestureCard.tsx +++ b/src/components/CommonKit/Card/StyledEcogestureCard.tsx @@ -8,6 +8,8 @@ import React from 'react' const CardBase = withStyles({ root: { background: 'var(--grey-1)', + border: '1px solid var(--grey-2)', + boxShadow: '0px 4px 16px 0px rgba(0, 0, 0, 0.12)', boxSizing: 'border-box', borderRadius: '4px', padding: '0.5rem 1rem', diff --git a/src/components/CommonKit/FormNavigation/formNavigation.scss b/src/components/CommonKit/FormNavigation/formNavigation.scss index 2daa873fa6232d7d882a84226513f37ed2dc15b8..6610ccfeb5d2af5bb2c86f0928b25fbb1d38d136 100644 --- a/src/components/CommonKit/FormNavigation/formNavigation.scss +++ b/src/components/CommonKit/FormNavigation/formNavigation.scss @@ -2,8 +2,8 @@ @import 'src/styles/base/breakpoint'; .profile-navigation { - border-top: 1px solid $grey-2; background-color: $grey-1; + border-top: 1px solid $grey-2; display: flex; justify-content: center; align-items: center; diff --git a/src/components/Consumption/ChartCompare/ChartCompare.scss b/src/components/Consumption/ChartCompare/ChartCompare.scss index 8a806a68c8efdd725cee8923cff829103c00979e..46a616a4e79d6ffe9fb9312e5932b50c490c7137 100644 --- a/src/components/Consumption/ChartCompare/ChartCompare.scss +++ b/src/components/Consumption/ChartCompare/ChartCompare.scss @@ -10,6 +10,7 @@ width: 100%; background-color: $grey-1; border: 1px solid $grey-2; + box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.12); padding: 16px; border-radius: 4px; box-sizing: border-box; @@ -39,6 +40,9 @@ align-items: center; width: 100%; gap: 12px; + .date { + text-align: center; + } } .verticalLine { diff --git a/src/components/Consumption/ChartCompare/ChartCompare.tsx b/src/components/Consumption/ChartCompare/ChartCompare.tsx index da0417a96f15fe93a51ce841c7b9351f4f68c0fa..e4fe439ad42e63f07a7eb7c35cd593a2887e12ef 100644 --- a/src/components/Consumption/ChartCompare/ChartCompare.tsx +++ b/src/components/Consumption/ChartCompare/ChartCompare.tsx @@ -1,7 +1,12 @@ +import CoinElec from 'assets/icons/ico/coin-elec.svg' +import CoinGas from 'assets/icons/ico/coin-gas.svg' +import CoinWater from 'assets/icons/ico/coin-water.svg' import Coin from 'assets/icons/ico/coin.svg' +import CompareIconElec from 'assets/icons/ico/compare-elec.svg' +import CompareIconGas from 'assets/icons/ico/compare-gas.svg' +import CompareIconWater from 'assets/icons/ico/compare-water.svg' import CompareIcon from 'assets/icons/ico/compare.svg' import LegendComparisonIcon from 'assets/icons/ico/legendComparison.svg' -// import LegendComparisonPreviousIcon from 'assets/icons/ico/legendComparisonPrevious.svg' import StyledIcon from 'components/CommonKit/Icon/StyledIcon' import StyledSwitch from 'components/CommonKit/Switch/StyledSwitch' import { useClient } from 'cozy-client' @@ -17,6 +22,13 @@ import { convertDateToShortDateString } from 'utils/date' import { formatNumberValues, getFluidName } from 'utils/utils' import './ChartCompare.scss' +const fluidIcons = { + [FluidType.ELECTRICITY]: { compare: CompareIconElec, coin: CoinElec }, + [FluidType.WATER]: { compare: CompareIconWater, coin: CoinWater }, + [FluidType.GAS]: { compare: CompareIconGas, coin: CoinGas }, + [FluidType.MULTIFLUID]: { compare: CompareIcon, coin: Coin }, +} + export const ChartCompare = ({ fluidType }: { fluidType: FluidType }) => { const { t } = useI18n() const client = useClient() @@ -125,7 +137,7 @@ export const ChartCompare = ({ fluidType }: { fluidType: FluidType }) => { icon={LegendComparisonIcon} className={`${fluidName} compare`} /> - <span className={`${fluidName} compare`}> + <span className={`${fluidName} text-14 compare`}> {t(`timestep.${lowercaseTimeStep}.last`)} </span> </div> @@ -134,7 +146,7 @@ export const ChartCompare = ({ fluidType }: { fluidType: FluidType }) => { icon={LegendComparisonIcon} className={fluidName} /> - <span className={fluidName}> + <span className={`${fluidName} text-14`}> {t(`timestep.${lowercaseTimeStep}.current`)} </span> </div> @@ -149,7 +161,7 @@ export const ChartCompare = ({ fluidType }: { fluidType: FluidType }) => { <div className="compareDetails"> <div className="bloc"> - <StyledIcon icon={CompareIcon} size={36} /> + <StyledIcon icon={fluidIcons[fluidType].compare} size={36} /> <span className="text-24-bold price"> {previousTotalValue} € </span> @@ -162,7 +174,11 @@ export const ChartCompare = ({ fluidType }: { fluidType: FluidType }) => { </div> <div className="verticalLine" /> <div className="bloc"> - <StyledIcon className="pile-icon" icon={Coin} size={32} /> + <StyledIcon + className="pile-icon" + icon={fluidIcons[fluidType].coin} + size={32} + /> <span className="text-24-bold price">{totalValue} €</span> <span className="date"> {convertDateToShortDateString( diff --git a/src/components/Consumption/ConsumptionDetails/__snapshots__/ConsumptionDetails.spec.tsx.snap b/src/components/Consumption/ConsumptionDetails/__snapshots__/ConsumptionDetails.spec.tsx.snap index cad3655511d68120a098c02e7ce14a503a4750f5..8e15714aca8c47590a1c8fe295481ca97b95fe25 100644 --- a/src/components/Consumption/ConsumptionDetails/__snapshots__/ConsumptionDetails.spec.tsx.snap +++ b/src/components/Consumption/ConsumptionDetails/__snapshots__/ConsumptionDetails.spec.tsx.snap @@ -53,7 +53,7 @@ exports[`ConsumptionDetails component should be rendered correctly and render eu <div class="text-18-normal" > - Bilan du 01/10 au 03/10 + Comparaison du bilan du 01/10 au 03/10 </div> <div class="icon-line" diff --git a/src/components/Consumption/ConsumptionDetails/consumptionDetails.scss b/src/components/Consumption/ConsumptionDetails/consumptionDetails.scss index d6e8893879aaf3811494bf24e82b2eccf5c2c436..858f676ed319d9a7b89650013bd1aa0268b7a576 100644 --- a/src/components/Consumption/ConsumptionDetails/consumptionDetails.scss +++ b/src/components/Consumption/ConsumptionDetails/consumptionDetails.scss @@ -15,6 +15,7 @@ width: 100%; background-color: $grey-1; border: 1px solid $grey-2; + box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.12); padding: 16px; border-radius: 4px; box-sizing: border-box; diff --git a/src/components/ConsumptionVisualizer/DataloadSectionDetail.tsx b/src/components/ConsumptionVisualizer/DataloadSectionDetail.tsx index 68aad423e9598ed96e6ce56694cd8eff005ace0d..de481da35a4060c4877a7e6c086e5279e6584abf 100644 --- a/src/components/ConsumptionVisualizer/DataloadSectionDetail.tsx +++ b/src/components/ConsumptionVisualizer/DataloadSectionDetail.tsx @@ -83,14 +83,14 @@ const DataloadSectionDetail = ({ })} > <StyledIcon icon={getFluidIcon(index)} size={22} /> - <div> + <span> {isValid && `${formatNumberValues(value.value)} €`} {(isUpcoming || isComing) && t('consumption_visualizer.data_to_come')} {(isEmpty || isHole) && t('consumption_visualizer.data_empty')} {isMissing && t('consumption_visualizer.aie')} - </div> + </span> </div> </NavLink> ) @@ -108,13 +108,13 @@ const DataloadSectionDetail = ({ > <div className={`dataloadvisualizer-euro-fluid ${fluidName}`}> <StyledIcon icon={getFluidIcon(fluidType)} size={22} /> - <div>{`${formatNumberValues( + <span>{`${formatNumberValues( converterService.LoadToEuro( dataload.value, fluidType, dataload.price ? dataload.price : null ) - )} €`}</div> + )} €`}</span> </div> </NavLink> </div> diff --git a/src/components/ConsumptionVisualizer/dataloadConsumptionVisualizer.scss b/src/components/ConsumptionVisualizer/dataloadConsumptionVisualizer.scss index bdd30d64b1401002a68ab78e9cbe750c12105c43..1a51a6668890d2ee07de9930bdec7e7a1b257766 100644 --- a/src/components/ConsumptionVisualizer/dataloadConsumptionVisualizer.scss +++ b/src/components/ConsumptionVisualizer/dataloadConsumptionVisualizer.scss @@ -101,6 +101,9 @@ display: flex; gap: 4px; font-weight: 700; + span { + line-height: 22px; + } } .electricity { color: $elec-color; diff --git a/src/components/DateNavigator/datenavigator.scss b/src/components/DateNavigator/datenavigator.scss index 80b089a93cb8d17700582521e1ca0e1345d4cbe4..d2302cc3b934869d43a0d60614b29862084358f7 100644 --- a/src/components/DateNavigator/datenavigator.scss +++ b/src/components/DateNavigator/datenavigator.scss @@ -10,6 +10,7 @@ margin: auto; padding: 12px 16px; border-bottom: 1px solid $grey-2; + box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.12); .date-navigator-button { &.disable { opacity: 0.3; diff --git a/src/components/Ecogesture/EcogestureCard/__snapshots__/EcogestureCard.spec.tsx.snap b/src/components/Ecogesture/EcogestureCard/__snapshots__/EcogestureCard.spec.tsx.snap index 0bd7b018ef12cc8db3c4cc976b61d296dc28f6bc..8b538b407176c7f11b98710edfd91fc29ceb2a90 100644 --- a/src/components/Ecogesture/EcogestureCard/__snapshots__/EcogestureCard.spec.tsx.snap +++ b/src/components/Ecogesture/EcogestureCard/__snapshots__/EcogestureCard.spec.tsx.snap @@ -32,7 +32,7 @@ exports[`EcogestureCard component should be rendered correctly 1`] = ` <div> <svg aria-hidden="true" - class="star styles__icon___23x3R" + class="star glow styles__icon___23x3R" height="16" width="16" > @@ -42,7 +42,7 @@ exports[`EcogestureCard component should be rendered correctly 1`] = ` </svg> <svg aria-hidden="true" - class="star styles__icon___23x3R" + class="star glow styles__icon___23x3R" height="16" width="16" > @@ -52,7 +52,7 @@ exports[`EcogestureCard component should be rendered correctly 1`] = ` </svg> <svg aria-hidden="true" - class="star styles__icon___23x3R" + class="star glow styles__icon___23x3R" height="16" width="16" > @@ -62,7 +62,7 @@ exports[`EcogestureCard component should be rendered correctly 1`] = ` </svg> <svg aria-hidden="true" - class="star styles__icon___23x3R" + class="star glow styles__icon___23x3R" height="16" width="16" > diff --git a/src/components/Ecogesture/EcogestureCard/ecogestureCard.scss b/src/components/Ecogesture/EcogestureCard/ecogestureCard.scss index 25d51f43b376be02920ceed75e9491619d598dc6..a72f62c12fcd110a8e49158ae8fdf081e3c70764 100644 --- a/src/components/Ecogesture/EcogestureCard/ecogestureCard.scss +++ b/src/components/Ecogesture/EcogestureCard/ecogestureCard.scss @@ -8,4 +8,8 @@ align-items: center; justify-content: space-around; text-align: center; + + .star.glow { + filter: drop-shadow(0px 0px 4px rgba(255, 198, 0, 0.5)); + } } diff --git a/src/components/Ecogesture/EcogestureList/ecogestureList.scss b/src/components/Ecogesture/EcogestureList/ecogestureList.scss index 31285c9d049eec590b01dca6448e2d2064ffb0e0..da1743d0b17f21f30a0904dce227f6cd457adc29 100644 --- a/src/components/Ecogesture/EcogestureList/ecogestureList.scss +++ b/src/components/Ecogesture/EcogestureList/ecogestureList.scss @@ -61,8 +61,6 @@ color: $grey-bright; } .ecogesture-list-item { - box-sizing: border-box; - border: 1px solid $grey-2; height: 8rem; animation: appear 600ms ease; display: flex; diff --git a/src/components/Ecogesture/EfficiencyRating/EfficiencyRating.tsx b/src/components/Ecogesture/EfficiencyRating/EfficiencyRating.tsx index b634b05d2aca5fa8315a0ea499e8e07c014a7882..dfef93f033a94d95e375102095f583332a7eea0a 100644 --- a/src/components/Ecogesture/EfficiencyRating/EfficiencyRating.tsx +++ b/src/components/Ecogesture/EfficiencyRating/EfficiencyRating.tsx @@ -1,5 +1,6 @@ import bulbEmpty from 'assets/icons/visu/bulbEmpty.svg' import bulbFilled from 'assets/icons/visu/bulbFilled.svg' +import classNames from 'classnames' import StyledIcon from 'components/CommonKit/Icon/StyledIcon' import React from 'react' @@ -14,14 +15,17 @@ const EfficiencyRating = ({ return ( <div> - {maxStars.map(star => ( - <StyledIcon - key={star} - className="star" - icon={result >= star ? bulbFilled : bulbEmpty} - size={iconSize} - /> - ))} + {maxStars.map(star => { + const isFilled = result >= star + return ( + <StyledIcon + key={star} + className={classNames(`star`, { glow: isFilled })} + icon={isFilled ? bulbFilled : bulbEmpty} + size={iconSize} + /> + ) + })} </div> ) } diff --git a/src/components/Ecogesture/EfficiencyRating/__snapshots__/EfficiencyRating.spec.tsx.snap b/src/components/Ecogesture/EfficiencyRating/__snapshots__/EfficiencyRating.spec.tsx.snap index 8c118b4b09c708317bdd392d05556febd0b9ff00..ccf0c3ac69f19e4c727508e18868d6b1827988bc 100644 --- a/src/components/Ecogesture/EfficiencyRating/__snapshots__/EfficiencyRating.spec.tsx.snap +++ b/src/components/Ecogesture/EfficiencyRating/__snapshots__/EfficiencyRating.spec.tsx.snap @@ -5,7 +5,7 @@ exports[`EfficiencyRating component should be rendered correctly 1`] = ` <div> <svg aria-hidden="true" - class="star styles__icon___23x3R" + class="star glow styles__icon___23x3R" height="16" width="16" > @@ -15,7 +15,7 @@ exports[`EfficiencyRating component should be rendered correctly 1`] = ` </svg> <svg aria-hidden="true" - class="star styles__icon___23x3R" + class="star glow styles__icon___23x3R" height="16" width="16" > @@ -25,7 +25,7 @@ exports[`EfficiencyRating component should be rendered correctly 1`] = ` </svg> <svg aria-hidden="true" - class="star styles__icon___23x3R" + class="star glow styles__icon___23x3R" height="16" width="16" > diff --git a/src/components/Ecogesture/ecogestureTabsView.scss b/src/components/Ecogesture/ecogestureTabsView.scss index d2b09dcaef9289e4f3b1b5a819c164bdc2e07be9..ba52828005fc40dabed33c1a7b4c330d0d7e7a73 100644 --- a/src/components/Ecogesture/ecogestureTabsView.scss +++ b/src/components/Ecogesture/ecogestureTabsView.scss @@ -18,6 +18,7 @@ justify-content: center; width: 100%; max-width: 53rem; + box-sizing: border-box; margin-inline: auto; button { height: auto; diff --git a/src/components/Ecogesture/singleEcogestureView.scss b/src/components/Ecogesture/singleEcogestureView.scss index b12cbb74dbd5fbd3bc1091b9ae98475c6139bf12..fb0307633a3e816287e2241cc6f788429972c13e 100644 --- a/src/components/Ecogesture/singleEcogestureView.scss +++ b/src/components/Ecogesture/singleEcogestureView.scss @@ -36,6 +36,9 @@ flex-direction: column; align-items: center; gap: 4px; + .star.glow { + filter: drop-shadow(0px 0px 4px rgba(255, 198, 0, 0.5)); + } } } .styled-container { diff --git a/src/components/EcogestureSelection/EcogestureSelectionDetail/EcogestureSelectionDetail.tsx b/src/components/EcogestureSelection/EcogestureSelectionDetail/EcogestureSelectionDetail.tsx index 9f825b8df91669ae07a1d12dd8235970deb9a259..873af33ab9644fac44bdf443eb2e7b3108dd155e 100644 --- a/src/components/EcogestureSelection/EcogestureSelectionDetail/EcogestureSelectionDetail.tsx +++ b/src/components/EcogestureSelection/EcogestureSelectionDetail/EcogestureSelectionDetail.tsx @@ -84,7 +84,7 @@ const EcogestureSelectionDetail = ({ }} onClick={() => validate(true, false)} > - <StyledIcon icon={objectiveIcon} size={40} /> + <StyledIcon icon={objectiveIcon} size={24} /> {t('ecogesture_selection.button_objective')} </Button> <Button @@ -94,7 +94,7 @@ const EcogestureSelectionDetail = ({ }} onClick={() => validate(false, true)} > - <StyledIcon icon={doingIcon} size={40} /> + <StyledIcon icon={doingIcon} size={24} /> {t('ecogesture_selection.button_doing')} </Button> <Button @@ -104,7 +104,7 @@ const EcogestureSelectionDetail = ({ }} onClick={() => validate(false, false)} > - <StyledIcon icon={skipIcon} size={40} /> + <StyledIcon icon={skipIcon} size={24} /> {t('ecogesture_selection.button_skip')} </Button> </div> diff --git a/src/components/EcogestureSelection/EcogestureSelectionDetail/__snapshots__/EcogestureSelectionDetail.spec.tsx.snap b/src/components/EcogestureSelection/EcogestureSelectionDetail/__snapshots__/EcogestureSelectionDetail.spec.tsx.snap index cf334dc22fd3eea8878965084c50c7b10e12ec2c..b8d838d24e9424778f248e018c19c9e8ba8ca2b4 100644 --- a/src/components/EcogestureSelection/EcogestureSelectionDetail/__snapshots__/EcogestureSelectionDetail.spec.tsx.snap +++ b/src/components/EcogestureSelection/EcogestureSelectionDetail/__snapshots__/EcogestureSelectionDetail.spec.tsx.snap @@ -38,7 +38,7 @@ exports[`EcogestureSelectionDetail component should be rendered correctly 1`] = <div> <svg aria-hidden="true" - class="star styles__icon___23x3R" + class="star glow styles__icon___23x3R" height="24" width="24" > @@ -48,7 +48,7 @@ exports[`EcogestureSelectionDetail component should be rendered correctly 1`] = </svg> <svg aria-hidden="true" - class="star styles__icon___23x3R" + class="star glow styles__icon___23x3R" height="24" width="24" > @@ -58,7 +58,7 @@ exports[`EcogestureSelectionDetail component should be rendered correctly 1`] = </svg> <svg aria-hidden="true" - class="star styles__icon___23x3R" + class="star glow styles__icon___23x3R" height="24" width="24" > @@ -68,7 +68,7 @@ exports[`EcogestureSelectionDetail component should be rendered correctly 1`] = </svg> <svg aria-hidden="true" - class="star styles__icon___23x3R" + class="star glow styles__icon___23x3R" height="24" width="24" > @@ -140,8 +140,8 @@ exports[`EcogestureSelectionDetail component should be rendered correctly 1`] = <svg aria-hidden="true" class="styles__icon___23x3R" - height="40" - width="40" + height="24" + width="24" > <use xlink:href="#test-file-stub" @@ -164,8 +164,8 @@ exports[`EcogestureSelectionDetail component should be rendered correctly 1`] = <svg aria-hidden="true" class="styles__icon___23x3R" - height="40" - width="40" + height="24" + width="24" > <use xlink:href="#test-file-stub" @@ -188,8 +188,8 @@ exports[`EcogestureSelectionDetail component should be rendered correctly 1`] = <svg aria-hidden="true" class="styles__icon___23x3R" - height="40" - width="40" + height="24" + width="24" > <use xlink:href="#test-file-stub" diff --git a/src/components/EcogestureSelection/EcogestureSelectionDetail/ecogestureSelectionDetail.scss b/src/components/EcogestureSelection/EcogestureSelectionDetail/ecogestureSelectionDetail.scss index 327be3844040d79f814038761d0293e752b3a313..72800374169c290e1f9bd9551542ecdaa4898392 100644 --- a/src/components/EcogestureSelection/EcogestureSelectionDetail/ecogestureSelectionDetail.scss +++ b/src/components/EcogestureSelection/EcogestureSelectionDetail/ecogestureSelectionDetail.scss @@ -34,6 +34,10 @@ flex-direction: column; align-items: center; gap: 4px; + + .star.glow { + filter: drop-shadow(0px 0px 4px rgba(255, 198, 0, 0.5)); + } } .iconContainer { diff --git a/src/components/FluidChart/HalfHourUpcoming/HalfHourUpcoming.scss b/src/components/FluidChart/HalfHourUpcoming/HalfHourUpcoming.scss index 87148009c5cbd660694c3349caa3b859ff5e8777..caf82a36b3fdb2b92974d96ef3a011019c6c8cb4 100644 --- a/src/components/FluidChart/HalfHourUpcoming/HalfHourUpcoming.scss +++ b/src/components/FluidChart/HalfHourUpcoming/HalfHourUpcoming.scss @@ -11,6 +11,7 @@ margin-top: 16px; background-color: $grey-1; border: 1px solid $grey-2; + box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.12); border-radius: 4px; // Same height as FluidChartSwipe to avoid layout shift diff --git a/src/components/Options/ReportOptions/reportOptions.scss b/src/components/Options/ReportOptions/reportOptions.scss index 2e7456e02bff4d9a059bc59e9b829ed2507d52ff..5c2b3087c18e399c712c04b5128555448b1c1267 100644 --- a/src/components/Options/ReportOptions/reportOptions.scss +++ b/src/components/Options/ReportOptions/reportOptions.scss @@ -22,6 +22,7 @@ .reportCard { background-color: $grey-1; border: 1px solid $grey-2; + box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.12); border-radius: 4px; padding: 12px 16px; display: flex; diff --git a/src/components/theme.ts b/src/components/theme.ts index f862d042ac4e3ceffcdf6ed1feebf6d06f040980..9b6840177093a90ad632d6b0989bf7ccf76edcd2 100644 --- a/src/components/theme.ts +++ b/src/components/theme.ts @@ -49,6 +49,7 @@ export const theme = createTheme({ width: '100%', border: '1px solid var(--grey-2)', backgroundColor: 'var(--grey-1)', + boxShadow: ' 0px 4px 16px 0px rgba(0, 0, 0, 0.12)', boxSizing: 'border-box', borderRadius: 43, padding: 8, @@ -69,6 +70,7 @@ export const theme = createTheme({ }, MuiAccordion: { root: { + boxShadow: ' 0px 4px 16px 0px rgba(0, 0, 0, 0.12)', '&.MuiAccordion-root:before': { backgroundColor: 'transparent', }, diff --git a/src/styles/base/_color.scss b/src/styles/base/_color.scss index 13685ee67ff05f07817cc6dcceefc391a416eded..d48801a81003d132d8e9675fae91ccf951fd4665 100644 --- a/src/styles/base/_color.scss +++ b/src/styles/base/_color.scss @@ -8,7 +8,6 @@ $dark-background: radial-gradient( #2a2b30 0%, #1b1c22 100% ); -$black-shadow: #0000008c; /** RED **/ $red-primary: #d25959; diff --git a/src/styles/components/_buttons.scss b/src/styles/components/_buttons.scss index a978cf534a73300831f3d2cc38afc097387e5e78..ee0f068ccbf883c69854bde06f4e198601c19a2a 100644 --- a/src/styles/components/_buttons.scss +++ b/src/styles/components/_buttons.scss @@ -43,6 +43,7 @@ button { text-transform: none; border-radius: 43px !important; height: 25px; + min-width: fit-content; padding: 4px; span { diff --git a/src/styles/components/_card.scss b/src/styles/components/_card.scss index 1c31ceb11a0b105446e8ca080aa0da137938193c..2fe23629f691c96a31eccb7e62c40d8ab50f9483 100644 --- a/src/styles/components/_card.scss +++ b/src/styles/components/_card.scss @@ -4,7 +4,7 @@ background-color: $grey-1; border: 1px solid $grey-2; box-sizing: border-box; - box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.75); + box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.12); border-radius: 4px; padding: 16px; &:hover { diff --git a/src/utils/date.spec.ts b/src/utils/date.spec.ts index df72bc57c0b8160fa54f760725a5e65afe8ef170..52bb83db33ce1441992a8d8273fbf0230a540d2c 100644 --- a/src/utils/date.spec.ts +++ b/src/utils/date.spec.ts @@ -383,22 +383,22 @@ describe('date utils', () => { actualData, TimeStep.HALF_AN_HOUR ) - expect(result).toBe('Bilan du jeudi 01 octobre') + expect(result).toBe('Comparaison du bilan du jeudi 01 octobre') }) it('case WEEK', () => { const result = convertDateToShortDateString(actualData, TimeStep.WEEK) - expect(result).toBe('Bilan du 01/10 au 03/10') + expect(result).toBe('Comparaison du bilan du 01/10 au 03/10') }) it('case DAY', () => { const result = convertDateToShortDateString(actualData, TimeStep.DAY) - expect(result).toBe('Bilan d’octobre') + expect(result).toBe('Comparaison du bilan d’octobre') }) it('case MONTH', () => { const result = convertDateToShortDateString(actualData, TimeStep.MONTH) - expect(result).toBe('Bilan de l’année 2020') + expect(result).toBe('Comparaison du bilan de l’année 2020') }) }) }) diff --git a/src/utils/date.ts b/src/utils/date.ts index 1a6d379dfbc650bf74a09188d1d029a00244aad3..bbef6bf4b9f9970a4d6b54fd1935c68be4193ccc 100644 --- a/src/utils/date.ts +++ b/src/utils/date.ts @@ -119,15 +119,17 @@ export const convertDateToShortDateString = ( const date = actualData[0].date switch (timeStep) { case TimeStep.HALF_AN_HOUR: - return `Bilan du ${date.setLocale('fr').toFormat('cccc dd LLLL')}` + return `Comparaison du bilan du ${date + .setLocale('fr') + .toFormat('cccc dd LLLL')}` case TimeStep.DAY: - return `Bilan ${getMonthNameWithPrep(date)}` + return `Comparaison du bilan ${getMonthNameWithPrep(date)}` case TimeStep.WEEK: - return `Bilan du ${date.toFormat('dd/MM')} au ${actualData[ + return `Comparaison du bilan du ${date.toFormat('dd/MM')} au ${actualData[ actualData.length - 1 ].date.toFormat('dd/MM')}` case TimeStep.MONTH: - return `Bilan de l’année ${date.toFormat('y')}` + return `Comparaison du bilan de l’année ${date.toFormat('y')}` case TimeStep.YEAR: return `de ${date.toFormat('y')} à ${actualData[ actualData.length - 1