rzerres/element-call
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Styling for video room

Browse Source
This commit is contained in:
Robert Long
2021-08-19 12:11:12 -07:00
parent 91e244772f
commit cc59e42bba
40 changed files with 937 additions and 270 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/icons/Chevron.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg width="10" height="6" viewBox="0 0 10 6" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.25 1.25L5 5L8.75 1.25" stroke="white" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 220 B

6
src/icons/DisableVideo.svg Normal file
View File

@@ -0,0 +1,6 @@
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0.290472 1.37627C0.677768 0.985743 1.3057 0.985743 1.69299 1.37627L16.569 16.3762C16.9563 16.7668 16.9563 17.3999 16.569 17.7904C16.1817 18.181 15.5538 18.181 15.1665 17.7904L0.290472 2.79048C-0.096824 2.39995 -0.096824 1.76679 0.290472 1.37627Z" fill="#394049"/>
<path d="M0.597515 5.19186C0.323238 5.646 0.165249 6.17941 0.165249 6.75001V14.0833C0.165249 15.7402 1.49729 17.0833 3.14045 17.0833H12.363L0.639137 5.2371C0.624608 5.22242 0.610733 5.20733 0.597515 5.19186Z" fill="#394049"/>
<path d="M14.2148 6.75002V11.9031L6.14598 3.75002H11.2396C12.8828 3.75002 14.2148 5.09317 14.2148 6.75002Z" fill="#394049"/>
<path d="M18.3887 5.88312L15.8677 7.91669V12.9167L18.3887 14.9503C19.038 15.4741 19.9999 15.0079 19.9999 14.1694V6.66399C19.9999 5.82548 19.038 5.35931 18.3887 5.88312Z" fill="#394049"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 915 B

11
src/icons/Grid.svg Normal file
View File

@@ -0,0 +1,11 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1" y="9" width="6" height="6" rx="1" fill="#8E99A4"/>
<rect x="9" y="9" width="6" height="6" rx="1" fill="#8E99A4"/>
<rect x="17" y="9" width="6" height="6" rx="1" fill="#8E99A4"/>
<rect x="1" y="17" width="6" height="6" rx="1" fill="#8E99A4"/>
<rect x="9" y="17" width="6" height="6" rx="1" fill="#8E99A4"/>
<rect x="17" y="17" width="6" height="6" rx="1" fill="#8E99A4"/>
<rect x="1" y="1" width="6" height="6" rx="1" fill="#8E99A4"/>
<rect x="9" y="1" width="6" height="6" rx="1" fill="#8E99A4"/>
<rect x="17" y="1" width="6" height="6" rx="1" fill="#8E99A4"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 676 B

3
src/icons/Hangup.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.007 6.46375C8.60094 6.4097 5.70947 6.77458 5.00651 6.95945C4.96493 6.97038 4.91704 6.98261 4.86347 6.99628C3.78418 7.27174 0.402266 8.13487 0.0368686 10.8697C-0.246222 12.9885 1.17146 13.6298 1.88015 13.5322C2.37066 13.4707 3.77508 13.2486 5.0727 13.0158C6.34691 12.7872 6.34626 11.9466 6.34582 11.3782C6.34581 11.3677 6.34581 11.3574 6.34581 11.3471L6.34581 10.2044C6.34581 9.91339 6.61929 9.74516 6.9965 9.69969C8.33185 9.51831 9.44662 9.5178 10.0046 9.51779L10.0093 9.51779C10.5672 9.51779 11.6682 9.51832 13.0035 9.6997C13.3807 9.74517 13.6542 9.9134 13.6542 10.2044L13.6542 11.3471C13.6542 11.3574 13.6542 11.3677 13.6542 11.3782C13.6537 11.9466 13.6531 12.7872 14.9273 13.0158C16.2249 13.2486 17.6293 13.4707 18.1198 13.5322C18.8285 13.6298 20.2462 12.9885 19.9631 10.8697C19.5977 8.13487 16.2158 7.27174 15.1365 6.99629C15.083 6.98262 15.0351 6.97039 14.9935 6.95946C14.2905 6.77459 11.413 6.4097 10.007 6.46375Z" fill="white"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

4
src/icons/Mic.svg Normal file
View File

@@ -0,0 +1,4 @@
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6.37785 4.70549C6.37785 2.79707 7.99961 1.25 10.0001 1.25C12.0007 1.25 13.6224 2.79707 13.6224 4.70548V9.87324C13.6224 11.7817 12.0007 13.3287 10.0001 13.3287C7.99961 13.3287 6.37785 11.7817 6.37785 9.87324V4.70549Z" fill="white"/>
<path d="M3.66099 8.77015C4.30219 8.77015 4.82198 9.266 4.82198 9.87768C4.82198 12.5957 7.1314 14.8024 9.98617 14.8095C9.99084 14.8094 9.99552 14.8094 10.0002 14.8094C10.0049 14.8094 10.0095 14.8094 10.0141 14.8095C12.8688 14.8022 15.178 12.5956 15.178 9.87768C15.178 9.266 15.6978 8.77015 16.339 8.77015C16.9802 8.77015 17.5 9.266 17.5 9.87768C17.5 13.4496 14.7509 16.4077 11.1612 16.9394V17.6425C11.1612 18.2541 10.6414 18.75 10.0002 18.75C9.359 18.75 8.83921 18.2541 8.83921 17.6425V16.9395C5.24925 16.4079 2.5 13.4497 2.5 9.87768C2.5 9.266 3.01979 8.77015 3.66099 8.77015Z" fill="white"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 938 B

5
src/icons/MuteMic.svg Normal file
View File

@@ -0,0 +1,5 @@
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2.74372 1.50628C2.40201 1.16457 1.84799 1.16457 1.50628 1.50628C1.16457 1.84799 1.16457 2.40201 1.50628 2.74372L6.5 7.73744V10C6.5 11.933 8.067 13.5 10 13.5C10.6491 13.5 11.2569 13.3233 11.778 13.0154L13.042 14.2794C12.1838 14.8906 11.1339 15.25 10 15.25C7.10051 15.25 4.75 12.8995 4.75 10C4.75 9.51675 4.35825 9.125 3.875 9.125C3.39175 9.125 3 9.51675 3 10C3 13.5697 5.67198 16.5153 9.125 16.9458V17.875C9.125 18.3582 9.51675 18.75 10 18.75C10.4832 18.75 10.875 18.3582 10.875 17.875V16.9458C12.1531 16.7865 13.3242 16.2825 14.2924 15.5299L17.2563 18.4937C17.598 18.8354 18.152 18.8354 18.4937 18.4937C18.8354 18.152 18.8354 17.598 18.4937 17.2563L2.74372 1.50628Z" fill="#394049"/>
<path d="M15.0678 11.3763L16.439 12.7504C16.8001 11.9061 17 10.9764 17 10C17 9.51675 16.6082 9.125 16.125 9.125C15.6418 9.125 15.25 9.51675 15.25 10C15.25 10.4762 15.1866 10.9376 15.0678 11.3763Z" fill="#394049"/>
<path d="M6.87692 3.16834L13.5 9.80523V4.75C13.5 2.817 11.933 1.25 10 1.25C8.63618 1.25 7.45455 2.03005 6.87692 3.16834Z" fill="#394049"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

3
src/icons/Settings.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M20.0988 9.01625C20.3188 9.59375 20.8825 9.97875 21.5013 9.97875C22.3263 9.97875 23 10.6525 23 11.4775V12.5225C23 13.3475 22.3263 14.0213 21.5013 14.0213C20.8825 14.0213 20.3188 14.4062 20.0988 14.9838C20.0806 15.0292 20.0624 15.0753 20.0441 15.1218C19.9792 15.2863 19.9125 15.4555 19.8375 15.6163C19.5763 16.18 19.7 16.84 20.14 17.28C20.7313 17.8575 20.7313 18.8062 20.14 19.3975L19.3975 20.14C18.82 20.7313 17.8713 20.7313 17.28 20.14C16.8538 19.7 16.18 19.5763 15.6163 19.8375C15.41 19.9338 15.2037 20.0163 14.9838 20.0988C14.4062 20.3188 14.0213 20.8825 14.0213 21.5013C14.0213 22.3263 13.3475 23 12.5225 23H11.4775C10.6525 23 9.97875 22.3263 9.97875 21.5013C9.97875 20.8825 9.59375 20.3188 9.01625 20.0988C8.97079 20.0806 8.92466 20.0624 8.87815 20.044C8.71368 19.9792 8.54454 19.9125 8.38375 19.8375C7.82 19.5763 7.16 19.7 6.72 20.14C6.1425 20.7313 5.19375 20.7313 4.6025 20.14L3.86 19.3975C3.26875 18.82 3.26875 17.8713 3.86 17.28C4.3 16.8538 4.42375 16.18 4.1625 15.6163C4.06625 15.41 3.98375 15.2037 3.90125 14.9838C3.68125 14.4062 3.1175 14.0213 2.49875 14.0213C1.67375 14.0213 1 13.3475 1 12.5225V11.4775C1 10.6525 1.67375 9.97875 2.49875 9.97875C3.1175 9.97875 3.68125 9.59375 3.90125 9.01625C3.94464 8.87742 3.99897 8.74406 4.0539 8.60926C4.086 8.53046 4.11831 8.45117 4.14875 8.37C4.41 7.80625 4.28625 7.14625 3.84625 6.70625C3.255 6.12875 3.255 5.18 3.84625 4.58875L4.6025 3.86C5.18 3.26875 6.12875 3.26875 6.72 3.86C7.14625 4.3 7.82 4.42375 8.38375 4.1625C8.59 4.06625 8.79625 3.97 9.01625 3.90125C9.59375 3.68125 9.97875 3.1175 9.97875 2.49875C9.97875 1.67375 10.6525 1 11.4775 1H12.5225C13.3475 1 14.0213 1.67375 14.0213 2.49875C14.0213 3.13125 14.4062 3.68125 14.9838 3.90125C15.0292 3.91943 15.0753 3.93762 15.1218 3.95595C15.2863 4.02079 15.4555 4.08746 15.6163 4.1625C16.18 4.42375 16.84 4.3 17.28 3.86C17.8575 3.26875 18.8062 3.26875 19.3975 3.86L20.14 4.6025C20.7313 5.18 20.7313 6.12875 20.14 6.72C19.7 7.14625 19.5763 7.82 19.8375 8.38375C19.9338 8.59 20.0163 8.79625 20.0988 9.01625ZM12 17.5C8.96125 17.5 6.5 15.0387 6.5 12C6.5 8.96125 8.96125 6.5 12 6.5C15.0387 6.5 17.5 8.96125 17.5 12C17.5 15.0387 15.0387 17.5 12 17.5Z" fill="#8E99A4"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.3 KiB

4
src/icons/User.svg Normal file
View File

@@ -0,0 +1,4 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M18.8914 9.0784C18.5132 9.0784 18.2066 8.777 18.2066 8.4052V5.71251H15.4678C15.0896 5.71251 14.783 5.41111 14.783 5.03931C14.783 4.66751 15.0896 4.36611 15.4678 4.36611H18.2066V1.6732C18.2066 1.3014 18.5132 1 18.8914 1C19.2696 1 19.5761 1.3014 19.5761 1.6732V4.36611H22.3153C22.6934 4.36611 23 4.66751 23 5.03931C23 5.41111 22.6934 5.71251 22.3153 5.71251H19.5761V8.4052C19.5761 8.777 19.2696 9.0784 18.8914 9.0784Z" fill="#8E99A4"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M19.5002 11.5094C19.8949 11.5094 20.281 11.4736 20.6555 11.4051C20.7505 11.9558 20.8 12.5221 20.8 13.1C20.8 18.5676 16.3676 23 10.9 23C5.43238 23 1 18.5676 1 13.1C1 7.63238 5.43238 3.2 10.9 3.2C11.7973 3.2 12.6666 3.31937 13.4931 3.54308C13.3177 4.11118 13.2234 4.71396 13.2234 5.33841C13.2234 8.74655 16.0336 11.5094 19.5002 11.5094ZM11.1308 21.4653C13.2927 21.4653 15.2551 20.6258 16.6993 19.2603C15.7939 17.0769 13.6417 15.5412 11.1308 15.5412C8.61988 15.5412 6.46768 17.0769 5.56225 19.2603C7.00643 20.6258 8.96888 21.4653 11.1308 21.4653ZM11.2799 7.81768C9.78854 7.9515 8.62035 9.18434 8.62035 10.6854C8.62035 12.2759 9.93179 13.5652 11.5495 13.5652C12.6276 13.5652 13.5696 12.9927 14.0781 12.1401C12.6655 11.1035 11.6462 9.57751 11.2799 7.81768Z" fill="#8E99A4"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

4
src/icons/Video.svg Normal file
View File

@@ -0,0 +1,4 @@
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2.50001 3.33334C1.11929 3.33334 0 4.45264 0 5.83336V14.1667C0 15.5474 1.11929 16.6667 2.50001 16.6667H11.6667C13.0474 16.6667 14.1667 15.5474 14.1667 14.1667V5.83336C14.1667 4.45264 13.0474 3.33334 11.6667 3.33334H2.50001Z" fill="white"/>
<path d="M18.6462 5.24983L15.8334 7.50004V12.5001L18.6462 14.7503C19.1918 15.1868 20.0001 14.7983 20.0001 14.0996V5.90056C20.0001 5.2018 19.1918 4.81332 18.6462 5.24983Z" fill="white"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 538 B