ammar/syncrow-app
1
0
Fork 0
mirror of https://github.com/SyncrowIOT/syncrow-app.git synced 2025-08-26 05:49:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added the curtain interface

Browse Source
This commit is contained in:
Mohammad Salameh
2024-05-07 12:26:54 +03:00
parent fbe2f5fe53
commit 923e7a2d02
8 changed files with 398 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
assets/icons/curtainsIcon/closeCurtain.svg Normal file
View File

@ -0,0 +1,56 @@
<svg width="106" height="106" viewBox="0 0 106 106" fill="none" xmlns="http://www.w3.org/2000/svg">
<g filter="url(#filter0_d_1285_461)">
<g filter="url(#filter1_i_1285_461)">
<path d="M85 55C85 38.4315 71.5685 25 55 25C38.4315 25 25 38.4315 25 55C25 71.5685 38.4315 85 55 85C71.5685 85 85 71.5685 85 55Z" fill="#EBECED"/>
</g>
<g filter="url(#filter2_ddi_1285_461)">
<path d="M75.2843 55.2842C75.2843 44.2385 66.33 35.2842 55.2843 35.2842C44.2386 35.2842 35.2843 44.2385 35.2843 55.2842C35.2843 66.3299 44.2386 75.2842 55.2843 75.2842C66.33 75.2842 75.2843 66.3299 75.2843 55.2842Z" fill="#F9F9F9"/>
</g>
<path d="M67.0139 65L57.0001 55L57.0011 54.9988L67.0139 45L69.7649 47.7472L62.5033 54.9988L62.5022 55L69.7649 62.2528L67.0139 65Z" fill="#023DFE" fill-opacity="0.6"/>
<path d="M42.7511 45L52.765 55L52.7639 55.0012L42.7511 65L40.0001 62.2528L47.263 55L40.0001 47.7472L42.7511 45Z" fill="#023DFE" fill-opacity="0.6"/>
</g>
<defs>
<filter id="filter0_d_1285_461" x="22" y="22" width="68" height="68" 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 dx="1" dy="1"/>
<feGaussianBlur stdDeviation="2"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1285_461"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1285_461" result="shape"/>
</filter>
<filter id="filter1_i_1285_461" x="25" y="25" width="65" height="65" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
<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 dx="5" dy="5"/>
<feGaussianBlur stdDeviation="15"/>
<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0"/>
<feBlend mode="normal" in2="shape" result="effect1_innerShadow_1285_461"/>
</filter>
<filter id="filter2_ddi_1285_461" x="0.284302" y="0.28418" width="105" height="105" 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 dx="5" dy="5"/>
<feGaussianBlur stdDeviation="12.5"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1285_461"/>
<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 dx="-5" dy="-5"/>
<feGaussianBlur stdDeviation="15"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.5 0"/>
<feBlend mode="normal" in2="effect1_dropShadow_1285_461" result="effect2_dropShadow_1285_461"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect2_dropShadow_1285_461" result="shape"/>
<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 dx="5" dy="5"/>
<feGaussianBlur stdDeviation="15"/>
<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.04 0"/>
<feBlend mode="normal" in2="shape" result="effect3_innerShadow_1285_461"/>
</filter>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

34
assets/icons/curtainsIcon/curtainHolder.svg Normal file
View File

@ -0,0 +1,34 @@
<svg width="273" height="19" viewBox="0 0 273 19" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.31 0H3.37V18.0724H1.31C0.59 18.0724 0 17.5304 0 16.8688V1.2036C0 0.542081 0.59 0 1.31 0Z" fill="url(#paint0_linear_1285_507)"/>
<path d="M268.85 0H270.91C271.63 0 272.22 0.542082 272.22 1.2036V16.8597C272.22 17.5212 271.63 18.0633 270.91 18.0633H268.85V0Z" fill="url(#paint1_linear_1285_507)"/>
<path d="M3.37012 18.0723L268.89 18.0723V-0.000181198L3.37012 -0.000181198V18.0723Z" fill="url(#paint2_linear_1285_507)"/>
<path style="mix-blend-mode:multiply" opacity="0.1" d="M268.89 0H265.1V18.0724H268.89V0Z" fill="url(#paint3_linear_1285_507)"/>
<path style="mix-blend-mode:multiply" opacity="0.1" d="M7.16 0H3.37V18.0724H7.16V0Z" fill="url(#paint4_linear_1285_507)"/>
<path style="mix-blend-mode:multiply" opacity="0.3" d="M268.89 16.3359H3.37012V18.0724H268.89V16.3359Z" fill="url(#paint5_linear_1285_507)"/>
<defs>
<linearGradient id="paint0_linear_1285_507" x1="0" y1="9.03163" x2="3.37" y2="9.03163" gradientUnits="userSpaceOnUse">
<stop stop-color="#B8B8B8"/>
<stop offset="1" stop-color="white"/>
</linearGradient>
<linearGradient id="paint1_linear_1285_507" x1="268.85" y1="9.03163" x2="272.22" y2="9.03163" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#B8B8B8"/>
</linearGradient>
<linearGradient id="paint2_linear_1285_507" x1="136.13" y1="26.9385" x2="136.13" y2="-8.12222" gradientUnits="userSpaceOnUse">
<stop offset="0.19" stop-color="white"/>
<stop offset="1" stop-color="#B8B8B8"/>
</linearGradient>
<linearGradient id="paint3_linear_1285_507" x1="265.55" y1="9.03163" x2="268.99" y2="9.03163" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1"/>
</linearGradient>
<linearGradient id="paint4_linear_1285_507" x1="6.71" y1="9.03163" x2="3.27" y2="9.03163" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1"/>
</linearGradient>
<linearGradient id="paint5_linear_1285_507" x1="136.13" y1="16.5289" x2="136.13" y2="18.1092" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1"/>
</linearGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

56
assets/icons/curtainsIcon/openCurtain.svg Normal file
View File

@ -0,0 +1,56 @@
<svg width="106" height="106" viewBox="0 0 106 106" fill="none" xmlns="http://www.w3.org/2000/svg">
<g filter="url(#filter0_d_1285_477)">
<g filter="url(#filter1_i_1285_477)">
<path d="M85 55C85 38.4315 71.5685 25 55 25C38.4315 25 25 38.4315 25 55C25 71.5685 38.4315 85 55 85C71.5685 85 85 71.5685 85 55Z" fill="#EBECED"/>
</g>
<g filter="url(#filter2_ddi_1285_477)">
<path d="M75.2843 55.2842C75.2843 44.2385 66.33 35.2842 55.2843 35.2842C44.2386 35.2842 35.2843 44.2385 35.2843 55.2842C35.2843 66.3299 44.2386 75.2842 55.2843 75.2842C66.33 75.2842 75.2843 66.3299 75.2843 55.2842Z" fill="#F9F9F9"/>
</g>
<path d="M50.0139 65L40.0001 55L40.0011 54.9988L50.0139 45L52.7649 47.7472L45.5033 54.9988L45.5022 55L52.7649 62.2528L50.0139 65Z" fill="#023DFE" fill-opacity="0.6"/>
<path d="M59.751 45L69.7648 55L69.7638 55.0012L59.751 65L57 62.2528L64.2628 55L57 47.7472L59.751 45Z" fill="#023DFE" fill-opacity="0.6"/>
</g>
<defs>
<filter id="filter0_d_1285_477" x="22" y="22" width="68" height="68" 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 dx="1" dy="1"/>
<feGaussianBlur stdDeviation="2"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1285_477"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1285_477" result="shape"/>
</filter>
<filter id="filter1_i_1285_477" x="25" y="25" width="65" height="65" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
<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 dx="5" dy="5"/>
<feGaussianBlur stdDeviation="15"/>
<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0"/>
<feBlend mode="normal" in2="shape" result="effect1_innerShadow_1285_477"/>
</filter>
<filter id="filter2_ddi_1285_477" x="0.284302" y="0.28418" width="105" height="105" 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 dx="5" dy="5"/>
<feGaussianBlur stdDeviation="12.5"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1285_477"/>
<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 dx="-5" dy="-5"/>
<feGaussianBlur stdDeviation="15"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.5 0"/>
<feBlend mode="normal" in2="effect1_dropShadow_1285_477" result="effect2_dropShadow_1285_477"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect2_dropShadow_1285_477" result="shape"/>
<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 dx="5" dy="5"/>
<feGaussianBlur stdDeviation="15"/>
<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.04 0"/>
<feBlend mode="normal" in2="shape" result="effect3_innerShadow_1285_477"/>
</filter>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.7 KiB

32
assets/icons/curtainsIcon/verticalBlade.svg Normal file
View File

@ -0,0 +1,32 @@
<svg width="33" height="319" viewBox="0 0 33 319" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0.559326 6.07198V318.219L2.69933 319V5.29102L0.559326 6.07198Z" fill="url(#paint0_linear_1285_538)"/>
<path d="M32.7092 315.619L2.69922 319V5.29102L32.7092 8.68132V315.619Z" fill="url(#paint1_linear_1285_538)"/>
<path d="M15.2593 0.0722656H20.1493V7.5144C20.1493 8.50669 19.2693 9.31522 18.1893 9.31522H17.2193C16.1393 9.31522 15.2593 8.50669 15.2593 7.5144V0.0722656Z" fill="url(#paint2_linear_1285_538)"/>
<defs>
<linearGradient id="paint0_linear_1285_538" x1="-48.9107" y1="20.5612" x2="42.5356" y2="323.172" gradientUnits="userSpaceOnUse">
<stop stop-color="#E9E9E9"/>
<stop offset="0.26" stop-color="#E4E4E4"/>
<stop offset="0.51" stop-color="#D8D8D8"/>
<stop offset="0.77" stop-color="#C4C4C4"/>
<stop offset="0.78" stop-color="#C4C4C4"/>
<stop offset="1" stop-color="#C6C6C6"/>
</linearGradient>
<linearGradient id="paint1_linear_1285_538" x1="2.69922" y1="-18.0001" x2="32.7092" y2="-18.0001" gradientUnits="userSpaceOnUse">
<stop stop-color="#F5F5F5"/>
<stop offset="0.22" stop-color="#F0F0F0"/>
<stop offset="0.45" stop-color="#E4E4E4"/>
<stop offset="0.67" stop-color="#D0D0D0"/>
<stop offset="0.78" stop-color="#C4C4C4"/>
<stop offset="1" stop-color="#C6C6C6"/>
</linearGradient>
<linearGradient id="paint2_linear_1285_538" x1="15.2593" y1="-18.0002" x2="20.1593" y2="-18.0002" gradientUnits="userSpaceOnUse">
<stop stop-color="#C4C4C4"/>
<stop offset="0.41" stop-color="#F8F8F8"/>
<stop offset="0.49" stop-color="#F0F0F0"/>
<stop offset="0.6" stop-color="#DCDCDC"/>
<stop offset="0.75" stop-color="#BABABA"/>
<stop offset="0.79" stop-color="#AEAEAE"/>
<stop offset="1" stop-color="#BEBEBE"/>
</linearGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB