KRBL/WhiteNightsAdminPanel
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added more types for media

Browse Source
This commit is contained in:
Илья Куприец
2025-04-27 11:27:22 +03:00
parent abd054b8d4
commit 0d325a3aa6
206 changed files with 20273 additions and 18977 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/preview/components/WeatherWidget/icons/DetHumidity.tsx
View File

@ -1,16 +0,0 @@
export const DetHumidity = () => {
return (
<svg
width="64"
height="64"
viewBox="0 0 64 64"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M32 63.68C19.42 63.68 9.19 53.45 9.19 40.87C9.19 28.25 22.63 9.87001 28.41 2.56001C29.28 1.45001 30.59 0.820007 32 0.820007C33.41 0.820007 34.72 1.45001 35.59 2.56001C41.37 9.88001 54.81 28.26 54.81 40.87C54.81 53.44 44.58 63.68 32 63.68ZM32 4.81001C31.9 4.81001 31.7 4.84001 31.55 5.03001C27.24 10.48 13.19 29.18 13.19 40.86C13.19 51.23 21.63 59.67 32 59.67C42.37 59.67 50.81 51.23 50.81 40.86C50.81 29.18 36.76 10.48 32.46 5.03001C32.3 4.84001 32.1 4.81001 32 4.81001Z"
fill="white"
/>
</svg>
);
};

24
src/preview/components/WeatherWidget/icons/DetWind.tsx
View File

@ -1,24 +0,0 @@
export const DetWind = () => {
return (
<svg
width="64"
height="64"
viewBox="0 0 64 64"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M22.03 23.32H4.59998C3.49998 23.32 2.59998 22.42 2.59998 21.32C2.59998 20.22 3.49998 19.32 4.59998 19.32H22.02C26 19.32 29.24 16.08 29.24 12.1C29.24 8.12001 26 4.88 22.02 4.88C18.04 4.88 14.8 8.12001 14.8 12.1C14.8 13.2 13.9 14.1 12.8 14.1C11.7 14.1 10.8 13.2 10.8 12.1C10.8 5.91001 15.84 0.880005 22.02 0.880005C28.2 0.880005 33.24 5.92001 33.24 12.1C33.24 18.28 28.21 23.32 22.03 23.32Z"
fill="white"
/>
<path
d="M50.17 34.3H14.15C13.05 34.3 12.15 33.4 12.15 32.3C12.15 31.2 13.05 30.3 14.15 30.3H50.17C54.15 30.3 57.39 27.06 57.39 23.08C57.39 19.1 54.15 15.86 50.17 15.86C46.19 15.86 42.95 19.1 42.95 23.08C42.95 24.18 42.05 25.08 40.95 25.08C39.85 25.08 38.95 24.18 38.95 23.08C38.95 16.89 43.99 11.86 50.17 11.86C56.36 11.86 61.39 16.9 61.39 23.08C61.39 29.26 56.36 34.3 50.17 34.3Z"
fill="white"
/>
<path
d="M40.63 63.13C34.44 63.13 29.41 58.09 29.41 51.91C29.41 50.81 30.31 49.91 31.41 49.91C32.51 49.91 33.41 50.81 33.41 51.91C33.41 55.89 36.65 59.13 40.63 59.13C44.61 59.13 47.85 55.89 47.85 51.91C47.85 47.93 44.61 44.69 40.63 44.69H4.59998C3.49998 44.69 2.59998 43.79 2.59998 42.69C2.59998 41.59 3.49998 40.69 4.59998 40.69H40.62C46.81 40.69 51.84 45.73 51.84 51.91C51.84 58.09 46.82 63.13 40.63 63.13Z"
fill="white"
/>
</svg>
);
};

3
src/preview/components/WeatherWidget/icons/cond_cloudy.svg
View File

@ -1,3 +0,0 @@
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M47.15 14.23C46.84 14.23 46.53 14.24 46.23 14.26C44.81 14.34 43.42 13.73 42.63 12.54C39.6 7.98 34.51 5 28.75 5C21.58 5 15.45 9.63 13.02 16.15C12.62 17.24 11.72 18.08 10.61 18.44C4.47 20.42 0 26.35 0 33.36C0 42 6.78 49 15.15 49H47.15C56.46 49 64 41.22 64 31.61C64 22.01 56.46 14.23 47.15 14.23Z" fill="white"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 422 B

4
src/preview/components/WeatherWidget/icons/cond_partlycloudy.svg
View File

@ -1,4 +0,0 @@
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M49.0191 29.96C57.2891 29.96 63.9991 23.25 63.9991 14.98C63.9991 6.71 57.2891 0 49.0191 0C40.7491 0 34.0391 6.71 34.0391 14.98C34.0291 23.26 40.7391 29.96 49.0191 29.96Z" fill="#FCD500"/>
<path d="M43.4668 17.3834C43.1948 17.3834 42.9128 17.3933 42.6408 17.4033C41.2708 17.4728 39.9713 16.8073 39.1957 15.6948C36.3852 11.6422 31.7514 9 26.5032 9C19.9655 9 14.3748 13.1122 12.078 18.933C11.6348 20.0554 10.7181 20.8997 9.56975 21.2871C4.00922 23.1545 0 28.4984 0 34.7859C0 42.633 6.25559 49 13.9718 49H43.4668C52.0393 49 59 41.9277 59 33.1967C59 24.4656 52.0493 17.3834 43.4668 17.3834Z" fill="white"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 714 B

7
src/preview/components/WeatherWidget/icons/cond_rainy.svg
View File

@ -1,7 +0,0 @@
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M47.15 11.22C46.84 11.22 46.53 11.23 46.23 11.25C44.81 11.33 43.42 10.72 42.63 9.53C39.59 4.98 34.51 2 28.75 2C21.58 2 15.45 6.63 13.02 13.15C12.62 14.24 11.72 15.08 10.61 15.44C4.47 17.41 0 23.35 0 30.35C0 38.99 6.78 45.99 15.15 45.99H47.15C56.45 45.99 64 38.21 64 28.6C64 19 56.46 11.22 47.15 11.22Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M17.6908 48.5015C18.4079 48.9162 18.6532 49.8337 18.2385 50.5509L14.4685 57.0709C14.0538 57.7881 13.1362 58.0333 12.4191 57.6186C11.7019 57.2039 11.4567 56.2864 11.8714 55.5692L15.6414 49.0492C16.0561 48.332 16.9736 48.0868 17.6908 48.5015Z" fill="#00B1FF"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M25.8607 53.2215C26.5779 53.6362 26.8231 54.5537 26.4084 55.2709L22.6384 61.7909C22.2237 62.508 21.3062 62.7533 20.589 62.3386C19.8718 61.9239 19.6266 61.0063 20.0413 60.2892L23.8113 53.7692C24.226 53.052 25.1435 52.8068 25.8607 53.2215Z" fill="#00B1FF"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M39.1988 48.9706C39.9165 49.3845 40.1627 50.3017 39.7489 51.0194L35.9889 57.5394C35.575 58.257 34.6578 58.5033 33.9401 58.0894C33.2225 57.6756 32.9762 56.7583 33.39 56.0407L37.1501 49.5207C37.5639 48.803 38.4812 48.5568 39.1988 48.9706Z" fill="#00B1FF"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M47.3687 53.6906C48.0864 54.1044 48.3326 55.0217 47.9188 55.7394L44.1588 62.2593C43.7449 62.977 42.8277 63.2233 42.11 62.8094C41.3924 62.3955 41.1461 61.4783 41.56 60.7606L45.32 54.2406C45.7338 53.523 46.6511 53.2767 47.3687 53.6906Z" fill="#00B1FF"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.6 KiB

11
src/preview/components/WeatherWidget/icons/cond_snow.svg
View File

@ -1,11 +0,0 @@
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M31.95 0.190002C33.0545 0.190002 33.95 1.08543 33.95 2.19V61.87C33.95 62.9746 33.0545 63.87 31.95 63.87C30.8454 63.87 29.95 62.9746 29.95 61.87V2.19C29.95 1.08543 30.8454 0.190002 31.95 0.190002Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M20.4458 4.92578C21.2268 4.14473 22.4932 4.14473 23.2742 4.92578L32.0107 13.6623L40.6265 5.05508C41.4079 4.27442 42.6742 4.27505 43.4549 5.05649C44.2356 5.83793 44.2349 7.10426 43.4535 7.88491L32.0093 19.3177L20.4458 7.75421C19.6647 6.97316 19.6647 5.70683 20.4458 4.92578Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M31.89 45.0416L43.4542 56.6058C44.2352 57.3868 44.2352 58.6532 43.4542 59.4342C42.6732 60.2153 41.4068 60.2153 40.6258 59.4342L31.89 50.6984L23.2742 59.3142C22.4932 60.0953 21.2268 60.0953 20.4458 59.3142C19.6647 58.5332 19.6647 57.2668 20.4458 56.4858L31.89 45.0416Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M4.36797 16.1101C4.92021 15.1535 6.14337 14.8257 7.09998 15.3779L58.79 45.2179C59.7466 45.7701 60.0744 46.9933 59.5222 47.9499C58.9699 48.9065 57.7468 49.2343 56.7901 48.6821L5.10015 18.8421C4.14354 18.2899 3.81573 17.0667 4.36797 16.1101Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.3312 8.57847C15.398 8.29193 16.495 8.92441 16.7816 9.99117L20.981 25.6247L5.17684 29.8521C4.10978 30.1375 3.01339 29.5039 2.72797 28.4368C2.44255 27.3697 3.07619 26.2733 4.14324 25.9879L16.0791 22.7953L12.9185 11.0288C12.632 9.96208 13.2645 8.86502 14.3312 8.57847Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M49.6571 8.51802C50.7242 8.80363 51.3576 9.90015 51.072 10.9672L47.8787 22.8969L59.6488 26.0585C60.7156 26.345 61.3481 27.4421 61.0615 28.5088C60.775 29.5756 59.6779 30.2081 58.6112 29.9215L42.9813 25.7232L47.208 9.93286C47.4936 8.86585 48.5901 8.23241 49.6571 8.51802Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.56812 35.7025C2.85394 34.6355 3.95058 34.0023 5.01753 34.2881L20.65 38.4758L16.4117 54.2781C16.1256 55.345 15.0288 55.9779 13.9619 55.6917C12.895 55.4056 12.2621 54.3088 12.5483 53.2419L15.75 41.3042L3.98249 38.1519C2.91554 37.8661 2.28231 36.7694 2.56812 35.7025Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M61.4318 35.7619C61.7179 36.8288 61.085 37.9256 60.0181 38.2117L48.0793 41.4138L51.2319 53.1825C51.5177 54.2494 50.8845 55.3461 49.8176 55.6319C48.7506 55.9177 47.654 55.2845 47.3681 54.2175L43.1808 38.5862L58.9819 34.3483C60.0488 34.0621 61.1456 34.695 61.4318 35.7619Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M59.5222 16.1101C60.0744 17.0667 59.7466 18.2899 58.79 18.8421L7.09998 48.6821C6.14337 49.2343 4.92021 48.9065 4.36797 47.9499C3.81573 46.9933 4.14354 45.7701 5.10015 45.2179L56.7901 15.3779C57.7468 14.8257 58.9699 15.1535 59.5222 16.1101Z" fill="white"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 2.9 KiB

11
src/preview/components/WeatherWidget/icons/cond_snowy.svg
View File

@ -1,11 +0,0 @@
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M47.15 10.22C46.84 10.22 46.53 10.23 46.23 10.25C44.81 10.33 43.42 9.72 42.63 8.53C39.59 3.98 34.51 1 28.75 1C21.58 1 15.45 5.63 13.02 12.15C12.62 13.24 11.72 14.08 10.61 14.44C4.47 16.42 0 22.35 0 29.36C0 38 6.78 45 15.15 45H47.15C56.45 45 64 37.22 64 27.61C64 18.01 56.46 10.22 47.15 10.22Z" fill="white"/>
<path d="M34.6995 58.07C35.5334 58.07 36.2095 57.394 36.2095 56.56C36.2095 55.7261 35.5334 55.05 34.6995 55.05C33.8655 55.05 33.1895 55.7261 33.1895 56.56C33.1895 57.394 33.8655 58.07 34.6995 58.07Z" fill="white"/>
<path d="M38.4397 51.5901C39.2736 51.5901 39.9497 50.914 39.9497 50.0801C39.9497 49.2461 39.2736 48.5701 38.4397 48.5701C37.6057 48.5701 36.9297 49.2461 36.9297 50.0801C36.9297 50.914 37.6057 51.5901 38.4397 51.5901Z" fill="white"/>
<path d="M42.8694 62.82C43.7033 62.82 44.3794 62.144 44.3794 61.31C44.3794 60.4761 43.7033 59.8 42.8694 59.8C42.0354 59.8 41.3594 60.4761 41.3594 61.31C41.3594 62.144 42.0354 62.82 42.8694 62.82Z" fill="white"/>
<path d="M46.6096 56.3401C47.4436 56.3401 48.1196 55.664 48.1196 54.8301C48.1196 53.9961 47.4436 53.3201 46.6096 53.3201C45.7757 53.3201 45.0996 53.9961 45.0996 54.8301C45.0996 55.664 45.7757 56.3401 46.6096 56.3401Z" fill="white"/>
<path d="M13.1799 58.07C14.0139 58.07 14.6899 57.394 14.6899 56.56C14.6899 55.7261 14.0139 55.05 13.1799 55.05C12.346 55.05 11.6699 55.7261 11.6699 56.56C11.6699 57.394 12.346 58.07 13.1799 58.07Z" fill="white"/>
<path d="M16.9202 51.5901C17.7541 51.5901 18.4302 50.914 18.4302 50.0801C18.4302 49.2461 17.7541 48.5701 16.9202 48.5701C16.0862 48.5701 15.4102 49.2461 15.4102 50.0801C15.4102 50.914 16.0862 51.5901 16.9202 51.5901Z" fill="white"/>
<path d="M21.3498 62.82C22.1838 62.82 22.8598 62.144 22.8598 61.31C22.8598 60.4761 22.1838 59.8 21.3498 59.8C20.5159 59.8 19.8398 60.4761 19.8398 61.31C19.8398 62.144 20.5159 62.82 21.3498 62.82Z" fill="white"/>
<path d="M25.0901 56.3401C25.924 56.3401 26.6001 55.664 26.6001 54.8301C26.6001 53.9961 25.924 53.3201 25.0901 53.3201C24.2561 53.3201 23.5801 53.9961 23.5801 54.8301C23.5801 55.664 24.2561 56.3401 25.0901 56.3401Z" fill="white"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 2.2 KiB

18
src/preview/components/WeatherWidget/icons/cond_sunny.svg
View File

@ -1,18 +0,0 @@
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_383_344)">
<path d="M19.3993 21.64C18.8293 21.64 18.2593 21.42 17.8193 20.99L9.3693 12.53C8.4993 11.66 8.4993 10.25 9.3693 9.38004C10.2393 8.51004 11.6493 8.51004 12.5193 9.38004L20.9693 17.83C21.8393 18.7 21.8393 20.11 20.9693 20.98C20.5393 21.42 19.9693 21.64 19.3993 21.64Z" fill="#FCD500"/>
<path d="M61.7701 34.24H49.8101C48.5801 34.24 47.5801 33.24 47.5801 32.01C47.5801 30.78 48.5801 29.78 49.8101 29.78H61.7701C63.0001 29.78 64.0001 30.78 64.0001 32.01C64.0001 33.24 63.0001 34.24 61.7701 34.24Z" fill="#FCD500"/>
<path d="M44.5997 21.64C44.0297 21.64 43.4597 21.42 43.0197 20.99C42.1497 20.12 42.1497 18.71 43.0197 17.84L51.4697 9.39005C52.3397 8.52005 53.7497 8.52005 54.6197 9.39005C55.4897 10.26 55.4897 11.67 54.6197 12.54L46.1697 20.99C45.7397 21.42 45.1697 21.64 44.5997 21.64Z" fill="#FCD500"/>
<path d="M31.9995 16.42C30.7695 16.42 29.7695 15.42 29.7695 14.19V2.23C29.7695 1 30.7695 0 31.9995 0C33.2295 0 34.2295 1 34.2295 2.23V14.19C34.2295 15.42 33.2295 16.42 31.9995 16.42Z" fill="#FCD500"/>
<path d="M14.19 34.24H2.24C1 34.24 0 33.24 0 32.01C0 30.78 1 29.78 2.23 29.78H14.18C15.41 29.78 16.41 30.78 16.41 32.01C16.41 33.24 15.42 34.24 14.19 34.24Z" fill="#FCD500"/>
<path d="M10.9493 55.29C10.3793 55.29 9.8093 55.0699 9.3693 54.6399C8.4993 53.7699 8.4993 52.36 9.3693 51.49L17.8193 43.04C18.6893 42.17 20.0993 42.17 20.9693 43.04C21.8393 43.91 21.8393 45.3199 20.9693 46.1899L12.5193 54.6399C12.0893 55.0699 11.5193 55.29 10.9493 55.29Z" fill="#FCD500"/>
<path d="M31.9995 64.0098C30.7695 64.0098 29.7695 63.0098 29.7695 61.7798V49.8198C29.7695 48.5898 30.7695 47.5898 31.9995 47.5898C33.2295 47.5898 34.2295 48.5898 34.2295 49.8198V61.7798C34.2295 63.0098 33.2295 64.0098 31.9995 64.0098Z" fill="#FCD500"/>
<path d="M53.0497 55.29C52.4797 55.29 51.9097 55.0699 51.4697 54.6399L43.0197 46.1899C42.1497 45.3199 42.1497 43.91 43.0197 43.04C43.8897 42.17 45.2997 42.17 46.1697 43.04L54.6197 51.49C55.4897 52.36 55.4897 53.7699 54.6197 54.6399C54.1897 55.0699 53.6197 55.29 53.0497 55.29Z" fill="#FCD500"/>
<path d="M32 43.9299C38.6252 43.9299 44 38.5551 44 31.9299C44 25.3047 38.6252 19.9299 32 19.9299C25.3748 19.9299 20 25.3047 20 31.9299C20 38.5551 25.3748 43.9299 32 43.9299Z" fill="#FCD500"/>
</g>
<defs>
<clipPath id="clip0_383_344">
<rect width="64" height="64" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 2.4 KiB

4
src/preview/components/WeatherWidget/icons/cond_thunder.svg
View File

@ -1,4 +0,0 @@
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M47.15 12.22C46.84 12.22 46.53 12.23 46.23 12.25C44.81 12.33 43.42 11.72 42.63 10.53C39.59 5.98 34.51 3 28.75 3C21.58 3 15.45 7.63 13.02 14.15C12.62 15.24 11.72 16.08 10.61 16.44C4.47 18.42 0 24.35 0 31.35C0 39.99 6.78 46.99 15.15 46.99H47.15C56.45 46.99 64 39.21 64 29.6C64 20 56.46 12.22 47.15 12.22Z" fill="white"/>
<path d="M26.0996 47.0101L47.6396 22.1001L44.5296 36.8901H56.9796L33.3696 61.8001L37.0596 47.0101H26.0996Z" fill="#FCD500"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 556 B

3
src/preview/components/WeatherWidget/icons/det_humidity.svg
View File

@ -1,3 +0,0 @@
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M32 63.68C19.42 63.68 9.19 53.45 9.19 40.87C9.19 28.25 22.63 9.87001 28.41 2.56001C29.28 1.45001 30.59 0.820007 32 0.820007C33.41 0.820007 34.72 1.45001 35.59 2.56001C41.37 9.88001 54.81 28.26 54.81 40.87C54.81 53.44 44.58 63.68 32 63.68ZM32 4.81001C31.9 4.81001 31.7 4.84001 31.55 5.03001C27.24 10.48 13.19 29.18 13.19 40.86C13.19 51.23 21.63 59.67 32 59.67C42.37 59.67 50.81 51.23 50.81 40.86C50.81 29.18 36.76 10.48 32.46 5.03001C32.3 4.84001 32.1 4.81001 32 4.81001Z" fill="white"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 599 B

5
src/preview/components/WeatherWidget/icons/det_wind.svg
View File

@ -1,5 +0,0 @@
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M22.03 23.32H4.59998C3.49998 23.32 2.59998 22.42 2.59998 21.32C2.59998 20.22 3.49998 19.32 4.59998 19.32H22.02C26 19.32 29.24 16.08 29.24 12.1C29.24 8.12001 26 4.88 22.02 4.88C18.04 4.88 14.8 8.12001 14.8 12.1C14.8 13.2 13.9 14.1 12.8 14.1C11.7 14.1 10.8 13.2 10.8 12.1C10.8 5.91001 15.84 0.880005 22.02 0.880005C28.2 0.880005 33.24 5.92001 33.24 12.1C33.24 18.28 28.21 23.32 22.03 23.32Z" fill="white"/>
<path d="M50.17 34.3H14.15C13.05 34.3 12.15 33.4 12.15 32.3C12.15 31.2 13.05 30.3 14.15 30.3H50.17C54.15 30.3 57.39 27.06 57.39 23.08C57.39 19.1 54.15 15.86 50.17 15.86C46.19 15.86 42.95 19.1 42.95 23.08C42.95 24.18 42.05 25.08 40.95 25.08C39.85 25.08 38.95 24.18 38.95 23.08C38.95 16.89 43.99 11.86 50.17 11.86C56.36 11.86 61.39 16.9 61.39 23.08C61.39 29.26 56.36 34.3 50.17 34.3Z" fill="white"/>
<path d="M40.63 63.13C34.44 63.13 29.41 58.09 29.41 51.91C29.41 50.81 30.31 49.91 31.41 49.91C32.51 49.91 33.41 50.81 33.41 51.91C33.41 55.89 36.65 59.13 40.63 59.13C44.61 59.13 47.85 55.89 47.85 51.91C47.85 47.93 44.61 44.69 40.63 44.69H4.59998C3.49998 44.69 2.59998 43.79 2.59998 42.69C2.59998 41.59 3.49998 40.69 4.59998 40.69H40.62C46.81 40.69 51.84 45.73 51.84 51.91C51.84 58.09 46.82 63.13 40.63 63.13Z" fill="white"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.3 KiB

3
src/preview/components/WeatherWidget/index.ts
View File

@ -1,3 +0,0 @@
export * from './weather-widget';
export * from './weather.interface';
export * from './weather.constant';

44
src/preview/components/WeatherWidget/weather-widget-icon.tsx
View File

@ -1,44 +0,0 @@
import { createElement } from "react";
import IconCloudy from "./icons/cond_cloudy.svg";
import IconRainy from "./icons/cond_rainy.svg";
import IconPartlyCloudy from "./icons/cond_partlycloudy.svg";
import IconSnow from "./icons/cond_snow.svg";
import IconSnowy from "./icons/cond_snowy.svg";
import IconSunny from "./icons/cond_sunny.svg";
import IconThunder from "./icons/cond_thunder.svg";
interface WeatherWidgetIconProps {
icon: string | null;
size: number;
}
const Icons = {
CLOUDY: IconCloudy,
RAINY: IconRainy,
PARTLYCLOUDY: IconPartlyCloudy,
SNOW: IconSnow,
SNOWY: IconSnowy,
SUNNY: IconSunny,
THUNDER: IconThunder,
};
export function WeatherWidgetIcon({ icon, size = 16 }: WeatherWidgetIconProps) {
const svg = Icons[icon as keyof typeof Icons] || null;
if (!svg || !icon)
return (
<div
style={{
width: `${size}px`,
height: `${size}px`,
textAlign: "center",
margin: "0 auto",
fontSize: `${size}px`,
lineHeight: 1,
overflow: "hidden",
}}
children="--"
/>
);
return createElement(svg);
}

77
src/preview/components/WeatherWidget/weather-widget-right.tsx
View File

@ -1,77 +0,0 @@
import { WeatherWidgetIcon } from "./weather-widget-icon";
import IconHumidity from "./icons/det_humidity.svg";
import IconWind from "./icons/det_wind.svg";
import { WeatherDayRow, WeatherWidgetData } from "./weather.interface";
const Weekdays = ["Вс", "Пн", "Вт", "Ср", "Чт", "Пт", "Сб", "Вс"];
const WRow = ({ temperature, weekday, condition }: WeatherDayRow) => (
<div
style={{
display: "flex",
marginBottom: "8px",
}}
>
<div
style={{
width: 16,
height: 16,
}}
>
<WeatherWidgetIcon icon={condition} size={16} />
</div>
<div style={{ marginLeft: 8, minWidth: 22 }} children={Weekdays[weekday]} />
<div style={{ marginLeft: 8 }} children={`${temperature ?? "--"}°`} />
</div>
);
export function WeatherWidgetRight({
forecasts,
weatherInfo,
}: WeatherWidgetData) {
const wd = new Date().getDay();
return (
<div
style={{
textAlign: "center",
width: "50%",
fontSize: 18,
lineHeight: "21px",
}}
>
<div
style={{
borderBottom: "1px solid #999",
marginBottom: "8px",
marginTop: "8px",
}}
>
{[...forecasts].slice(0, 3).map((d, idx) => (
<WRow key={idx} {...d?.weatherInfo} weekday={(wd + idx + 1) % 7} />
))}
</div>
<div
style={{
display: "flex",
alignItems: "center",
marginBottom: 8,
}}
>
<IconHumidity />
<b children={weatherInfo?.humidity ?? "--"} />%
</div>
<div
style={{
display: "flex",
alignItems: "center",
}}
>
<IconWind />
<b children={weatherInfo?.windSpeed ?? "--"} />
&nbsp;м/с
</div>
</div>
);
}

54
src/preview/components/WeatherWidget/weather-widget-time.tsx
View File

@ -1,54 +0,0 @@
import { useEffect, useState } from 'react';
const add0 = (val: number) => `${val < 10 ? '0' : ''}${val}`;
const weekdays = [
'воскресенье',
'понедельник',
'вторник',
'среда',
'четверг',
'пятница',
'суббота',
'воскресенье',
];
export function WeatherWidgetTime() {
const [now, setNow] = useState(new Date());
useEffect(() => {
const interval = setInterval(() => setNow(new Date()), 1000);
return () => clearInterval(interval);
}, []);
return (
<div
style={{
textAlign: 'center',
borderBottom: '1px solid #999',
paddingBottom: '13px',
}}
>
<div
style={{
fontWeight: 600,
fontSize: '48px',
lineHeight: '56px',
}}
>
{now.getHours()}
<span children={':'} style={{ opacity: now.getSeconds() % 4 !== 3 ? 1 : 0 }} />
{add0(now.getMinutes())}
</div>
<div
style={{
fontWeight: 400,
fontSize: '14px',
lineHeight: '1',
}}
>
{now.getDate()}.{add0(now.getMonth() + 1)}, {weekdays[now.getDay()]}
</div>
</div>
);
}

48
src/preview/components/WeatherWidget/weather-widget-today.tsx
View File

@ -1,48 +0,0 @@
import { WeatherWidgetIcon } from './weather-widget-icon';
import { WeatherDayProps } from './weather.interface';
const WeatherTypes = {
RAINY: 'дождь',
CLOUDY: 'облачно',
PARTLYCLOUDY: 'переменная облачность',
SNOW: 'снег',
SNOWY: 'идет снег',
SUNNY: 'солнце',
THUNDER: '',
UNKNOWN: 'неизвестно',
};
export function WeatherWidgetToday(props: WeatherDayProps) {
const { temperature, condition } = props;
const wType = WeatherTypes[condition as keyof typeof WeatherTypes] ?? WeatherTypes.UNKNOWN;
return (
<div
style={{
textAlign: 'center',
width: '50%',
}}
>
<div>
<WeatherWidgetIcon icon={condition} size={72} />
</div>
<div
style={{
fontSize: 52,
lineHeight: '61px',
fontWeight: '600',
letterSpacing: '-.075',
}}
children={`${temperature ?? '--'}°`}
/>
<div
style={{
fontSize: 16,
lineHeight: '18.75px',
}}
children={wType}
/>
</div>
);
}

46
src/preview/components/WeatherWidget/weather-widget.tsx
View File

@ -1,46 +0,0 @@
import styled from '@emotion/styled';
import { HTMLAttributes } from 'react';
import { WeatherWidgetRight } from './weather-widget-right';
import { WeatherWidgetTime } from './weather-widget-time';
import { WeatherWidgetToday } from './weather-widget-today';
import { WeatherWidgetData } from './weather.interface';
import { WEATHER_DEFAULTS } from './weather.constant';
const StyledWeatherWidget = styled.div`
width: 225px;
height: 260px;
padding: 8px;
background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%),
rgba(179, 165, 152, 0.4);
box-shadow: inset 4px 4px 12px rgba(255, 255, 255, 0.12);
backdrop-filter: blur(6px);
color: #fff;
font-weight: 400;
border-radius: 10px;
`;
interface Props extends HTMLAttributes<HTMLDivElement> {
weatherData?: WeatherWidgetData;
}
export function WeatherWidget({ weatherData = WEATHER_DEFAULTS, ...props }: Props) {
const { weatherInfo, forecasts } = weatherData;
return (
<StyledWeatherWidget {...props}>
<WeatherWidgetTime />
<div
style={{
display: 'flex',
justifyContent: 'space-between',
marginTop: '8px',
}}
>
<WeatherWidgetToday {...weatherInfo} />
<WeatherWidgetRight weatherInfo={weatherInfo} forecasts={forecasts} />
</div>
</StyledWeatherWidget>
);
}

28
src/preview/components/WeatherWidget/weather.constant.ts
View File

@ -1,28 +0,0 @@
export const WEATHER_DEFAULTS = {
weatherInfo: {
condition: null,
temperature: null,
humidity: null,
windSpeed: null,
},
forecasts: [
{
weatherInfo: {
condition: null,
temperature: null,
},
},
{
weatherInfo: {
condition: null,
temperature: null,
},
},
{
weatherInfo: {
condition: null,
temperature: null,
},
},
],
};

29
src/preview/components/WeatherWidget/weather.interface.ts
View File

@ -1,29 +0,0 @@
export type WeatherTypes =
| 'CLOUDY'
| 'PARTLYCLOUDY'
| 'RAINY'
| 'SNOW'
| 'SNOWY'
| 'SUNNY'
| 'THUNDER';
export interface WeatherDayShortProps {
condition: WeatherTypes | null;
temperature: number | null;
}
export type WeatherDayProps = WeatherDayShortProps & {
humidity: number | null;
windSpeed: number | null;
};
export interface WeatherForecastsProps {
weatherInfo: WeatherDayShortProps;
}
export interface WeatherWidgetData {
forecasts: WeatherForecastsProps[];
weatherInfo: WeatherDayProps;
}
export type WeatherDayRow = WeatherDayShortProps & {
weekday: number;
};