Skip to content

Commit

Permalink
ui improvements
Browse files Browse the repository at this point in the history
  • Loading branch information
@heapwolf
heapwolf committed Jul 19, 2024
1 parent f604c57 commit a27c5d8
Show file tree
Hide file tree
Showing 8 changed files with 125 additions and 95 deletions.
13 changes: 11 additions & 2 deletions src/css/components.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,7 @@ modal .dialog > header {

.title {
text-align: center;
padding: 8px;
}
}

Expand All @@ -70,7 +71,7 @@ modal .dialog > footer {
height: 60px;
justify-content: end;
align-items: center;
padding: 0 20px;
padding: 18px;
display: flex;
gap: 10px;
}
Expand Down Expand Up @@ -218,6 +219,14 @@ text[label] .x--text-invalid {
}

/* Button */
button {
place-self: end;
display: grid;
align-content: center;
justify-content: center;
width: 36px;
height: 36px;
}

button[type] {
height: 32px;
Expand Down Expand Up @@ -337,7 +346,7 @@ avatar {
height: 34px;
width: 34px;
position: relative;
border: 1px solid var(--x-primary);
border: 2px solid var(--x-primary);
border-radius: 99em;
padding: 4px;
}
Expand Down
10 changes: 5 additions & 5 deletions src/css/index.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,8 +54,8 @@ defs {

.app-icon {
display: grid;
width: 20px;
height: 20px;
width: 24px;
height: 24px;
will-change: transform;
transition: transform .1s ease;
}
Expand Down Expand Up @@ -119,7 +119,7 @@ button#sidebar-toggle {
top: 10px;
left: 80px;
width: 42px;
height: 32px;
height: 36px;
z-index: 3;
}

Expand All @@ -145,8 +145,8 @@ body[platform="ios"] {
}

#profile-open {
margin-top: 48px;
margin-right: 10px;
margin-top: 58px;
margin-right: 4px;
}

#profile,
Expand Down
54 changes: 32 additions & 22 deletions src/css/messages.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,13 +11,13 @@
user-select: none;
will-change: transform, height;
overflow: hidden;
box-shadow: 0px 0px 24px -10px rgba(0, 0, 0, 1);
box-shadow: 0px 0px 18px -10px rgba(0, 0, 0, 1);
z-index: 2;

header #open-audio-streams {
header #profile-open {
position: absolute;
right: 16px;
top: 16px;
right: 14px;
top: 14px;
}

.empty-state {
Expand All @@ -26,28 +26,29 @@
grid-template-rows: 100%;
align-items: center;
justify-content: center;
height: 100%;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}

.empty-state > div {
display: block;
max-width: 500px;
min-height: 100%;
margin: auto;
padding: 16px 10px;
line-height: 20px;
}

.empty-state > div svg {
width: 60px;
height: 60px;
display: block;
margin: 20px auto;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
max-width: 500px;
width: auto;
}

#input {
position: relative;
padding: 12px;
padding: 11px;
background: var(--x-background-darker);
border-radius: 6px;
height: auto;
Expand Down Expand Up @@ -76,7 +77,7 @@
width: 100%;
font-size: 16px;
outline: none;
padding-right: 32px;
padding-right: 64px;
z-index: 2;
line-height: 22px;
max-height: 250px;
Expand All @@ -85,8 +86,14 @@

#input #send-message {
position: absolute;
bottom: 12px;
right: 12px;
bottom: 4px;
right: 42px;
}

#input #open-streams {
position: absolute;
bottom: 4px;
right: 6px;
}

#input .placeholder-text {
Expand Down Expand Up @@ -181,13 +188,16 @@ body.moving * {


body[hardware="mobile"] {
#messages header #open-audio-streams {
#messages header #open-streams {
top: 76px;
}

#messages .empty-state {
width: 80%;
margin: auto;
#messages #input {
max-width: 90vw;
}

#messages .empty-state > div {
min-width: 80vw;
}
}

Expand Down
12 changes: 6 additions & 6 deletions src/css/profile.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,14 +33,14 @@
#profile-open {
width: fit-content;
background: transparent;
width: 32px;
height: 32px;
width: 24px;
height: 24px;
}

#profile-close {
position: absolute;
right: 0;
top: 0;
right: 4px;
top: 4px;
width: 34px;
height: 50px;
border-radius: 12px;
Expand All @@ -52,8 +52,8 @@

body[platform="ios"] {
#profile-open {
margin-top: 48px;
margin-right: 10px;
margin-top: 58px;
margin-right: 6px;
}

#profile {
Expand Down
23 changes: 12 additions & 11 deletions src/css/sidebar.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,40 +38,36 @@ body[hardware="mobile"] {
justify-content: end;
margin: 0;
width: 280px;
padding-right: 10px;
padding-right: 8px;

button#create-channel-open,
button#profile-open {
place-self: end;

svg {
width: 32px;
height: 32px;
padding: 6px;
}
}
}
}

> .content {
width: 280px;
padding: 20px;
padding: 14px;
}

.channel {
padding: 8px;
margin-bottom: 6px;
margin-bottom: 8px;
font-size: 16px;
border-radius: 8px;
position: relative;
height: 34px;
height: 36px;
transition: background .1s ease;

button {
position: absolute;
right: 8px;
top: 6px;
display: none;
width: 24px;
height: 24px;
}

&[data-active="true"] {
Expand All @@ -88,4 +84,9 @@ body[hardware="mobile"] {
}
}


body[platform="ios"] {
#create-channel-open {
top: 24px;
position: relative;
}
}
60 changes: 31 additions & 29 deletions src/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,17 +41,21 @@
<path d="M14.99 86.8652H85.0095C93.3102 86.8652 97.4612 82.7636 97.4612 74.5605V34.6191C97.4612 26.416 93.3102 22.3633 85.0095 22.3633H74.2185C71.24 22.3633 70.3123 21.6308 68.6521 19.8242L65.6736 16.4551C63.7693 14.4043 61.7185 13.1348 57.7146 13.1348H42.2361C38.1834 13.1348 36.1326 14.4043 34.2771 16.4551L31.2498 19.8242C29.6384 21.6308 28.6619 22.3633 25.7322 22.3633H14.99C6.6892 22.3633 2.53882 26.416 2.53882 34.6191V74.5605C2.53882 82.7636 6.6892 86.8652 14.99 86.8652ZM49.9998 75.1465C38.4763 75.1465 29.199 65.918 29.199 54.3457C29.199 42.7246 38.4763 33.4961 49.9998 33.4961C61.5232 33.4961 70.7517 42.7246 70.7517 54.3457C70.7517 65.918 61.5232 75.1465 49.9998 75.1465ZM49.9998 68.5547C57.8611 68.5547 64.2087 62.2558 64.2087 54.3457C64.2087 46.4355 57.8611 40.0879 49.9998 40.0879C42.1384 40.0879 35.742 46.4355 35.742 54.3457C35.742 62.2558 42.1873 68.5547 49.9998 68.5547ZM73.3396 40.1855C73.3396 37.5 75.6834 35.1562 78.4177 35.1562C81.1521 35.1562 83.447 37.5 83.447 40.1855C83.447 43.0176 81.1521 45.166 78.4177 45.2148C75.6834 45.2637 73.3396 43.0176 73.3396 40.1855Z" fill="var(--x-primary)"/>
</symbol>

<symbol id="talk-icon" viewBox="0 0 100 100" width="20" height="20">
<path fill-rule="evenodd" clip-rule="evenodd" d="M26.0877 99.5639C25.3518 100.307 24.6359 100.827 23.8177 100.827C22.7129 100.827 21.864 99.9113 21.864 98.4134V83.2738H17.4972C6.95782 83.2738 0.265137 75.8088 0.265137 64.0938V18.3578C0.265137 6.64289 6.95782 -0.826832 17.4972 -0.826832H82.5028C93.0423 -0.826832 99.7349 6.76748 99.7349 18.3578V64.0938C99.7349 75.6843 93.0423 83.2738 82.5028 83.2738H43.2122L26.0877 99.5639ZM27.406 15.8107C18.6503 25.568 26.2512 42.421 36.9505 54.3326C47.5939 66.1244 62.7917 74.7642 71.6033 64.8963C71.7297 64.7964 71.7823 64.7232 71.8409 64.6418C71.8717 64.5988 71.9043 64.5536 71.9502 64.5009C74.9963 61.0193 75.3221 58.0759 73.4903 55.8532C73.1378 55.4218 72.5955 55.012 70.4013 53.3538C69.0074 52.3003 66.9467 50.7429 63.8443 48.3561C61.8965 46.8849 59.7576 46.6207 57.1547 49.3987L55.0632 51.6649C54.5222 52.2673 53.7281 52.3202 53.0108 51.8563C51.4352 50.8384 48.2786 48.4819 45.2422 45.1014C42.21 41.7208 40.029 38.1971 39.2307 36.4477C38.8742 35.6633 38.909 34.9706 39.4026 34.4164L41.4339 31.8391C43.8217 28.8649 43.5884 26.493 42.2027 24.3868L35.9201 14.3417C33.8653 11.0845 30.9652 13.1184 28.7173 14.6949C28.4937 14.8518 28.2765 15.0041 28.0673 15.1462C27.8365 15.3002 27.6766 15.491 27.5332 15.6622C27.4898 15.714 27.4479 15.764 27.406 15.8107Z" fill="var(--x-primary)"/>
<symbol id="talk-icon" viewBox="0 0 100 100" width="24" height="24">
<path
fill-rule="evenodd"
clip-rule="evenodd"
fill="var(--x-primary)"
d="M20 48.9547C20 65.3658 30.7666 76.8119 46.4461 78.3275V86.8467H31.7073C29.7213 86.8467 28.1533 88.4146 28.1533 90.3484C28.1533 92.3345 29.7213 93.9024 31.7073 93.9024H68.2927C70.2265 93.9024 71.7944 92.3345 71.7944 90.3484C71.7944 88.4146 70.2265 86.8467 68.2927 86.8467H53.5018V78.3275C69.2334 76.8119 80 65.3658 80 48.9547V40.4879C80 38.5018 78.4321 36.9338 76.446 36.9338C74.5122 36.9338 72.9442 38.5018 72.9442 40.4879V48.6411C72.9442 62.7004 63.9024 71.9512 50 71.9512C36.0976 71.9512 27.0557 62.7004 27.0557 48.6411V40.4879C27.0557 38.5018 25.4879 36.9338 23.5018 36.9338C21.568 36.9338 20 38.5018 20 40.4879V48.9547ZM50 63.5889C58.2578 63.5889 63.9024 57.5261 63.9024 48.5366V21.1498C63.9024 12.1603 58.2578 6.09756 50 6.09756C41.6899 6.09756 36.0454 12.1603 36.0454 21.1498V48.5366C36.0454 57.5261 41.6899 63.5889 50 63.5889Z"/>
</symbol>

<symbol id="profile-icon" viewBox="0 0 100 100" width="20" height="20">
<path fill="var(--x-primary)" d="M49.9978 100C77.4559 100 100 77.4595 100 50C100 22.5405 77.4513 0 49.9931 0C22.4785 0 0 22.5405 0 50C0 77.4595
22.4831 100 49.9978 100ZM49.9978 96.9843C24.0564 96.9843 2.96374 75.9471 2.96374 50C2.96374 24.0529 24.0519 3.01562 49.9931 3.01562C75.9389
3.01562 96.9798 24.0529 96.9798 50C96.9798 75.9471 75.9435 96.9843 49.9978 96.9843ZM84.493 82.8847L84.4791 82.6558C81.0203 75.6532 67.9845
66.7276 49.9978 66.7276C32.133 66.7276 19.1016 75.5922 15.5208 82.4729L15.5071 82.8847C24.3975 92.1841 36.664 98.2193 50.0587 98.2193C63.5798
98.2193 75.1756 92.4281 84.493 82.8847ZM49.9978 57.8264C59.8397 57.8355 67.3391 49.436 67.3391 38.535C67.3391 28.2898 59.6568 19.637 49.9978
19.637C40.3433 19.637 32.5953 28.2898 32.6608 38.535C32.6655 49.436 40.1557 57.8171 49.9978 57.8264Z" />
<symbol id="profile-icon" viewBox="0 0 100 100" width="24" height="24">
<path fill-rule="evenodd" clip-rule="evenodd" fill="var(--x-primary)" d="M96.4522 50.2244C96.4522 73.4136 77.4131 92.4488 54.224 92.4488C30.9871 92.4488 11.9996 73.4136 11.9996 50.2244C11.9996 27.0352 30.9833 8 54.22 8C77.4092 8 96.4522 27.0352 96.4522 50.2244ZM32.0951 71.1745C32.0951 72.1227 32.4185 72.6831 33.4338 72.6831H75.0184C76.0336 72.6831 76.3057 72.1227 76.3057 71.1745C76.3057 66.3005 69.2959 53.0582 54.2242 53.0582C39.1563 53.0582 32.0951 66.3005 32.0951 71.1745ZM43.215 37.5909C43.215 44.4821 48.1123 49.5494 54.2242 49.5532C60.34 49.5571 65.2373 44.4821 65.2373 37.5909C65.2373 31.1428 60.34 25.8024 54.2242 25.8024C48.1123 25.8024 43.215 31.1428 43.215 37.5909Z"/>
</symbol>

<symbol id="settings-icon" viewBox="0 0 100 100" width="24" height="24">
<path fill="var(--x-primary)" d="M22.0707 93H77.9293C88.0157 93 92.9705 88.0453 92.9705 78.1358V21.8642C92.9705 11.9548 88.0157 7 77.9293 7H22.0707C12.0432 7 7.0295 11.9548 7.0295 21.8642V78.1358C7.0295 88.0453 12.0432 93 22.0707 93ZM22.1887 84.4472C17.9417 84.4472 15.5234 82.2058 15.5234 77.7229V22.2771C15.5234 17.8532 17.9417 15.5528 22.1887 15.5528H77.8114C82.0583 15.5528 84.4767 17.8532 84.4767 22.2771V77.7229C84.4767 82.2058 82.0583 84.4472 77.8114 84.4472H22.1887Z"/>
<path fill="var(--x-primary)" d="M28.9129 40.5035H50.6783V33.6022H28.9129C26.9664 33.6022 25.4328 35.1358 25.4328 37.0233C25.4328 38.9699 26.9664 40.5035 28.9129 40.5035ZM56.8128 46.5199C62.0034 46.5199 66.1913 42.2729 66.1913 37.0233C66.1913 31.8327 62.0034 27.5857 56.8128 27.5857C51.6221 27.5857 47.3752 31.8327 47.3752 37.0233C47.3752 42.2729 51.6221 46.5199 56.8128 46.5199ZM56.8128 41.3292C54.3944 41.3292 52.5658 39.4417 52.5658 37.0233C52.5658 34.605 54.3944 32.7764 56.8128 32.7764C59.1722 32.7764 61.0597 34.605 61.0597 37.0233C61.0597 39.4417 59.1722 41.3292 56.8128 41.3292ZM62.5343 40.5035H71.3231C73.0926 40.5035 74.6262 38.9699 74.6262 37.0233C74.6262 35.1358 73.0926 33.6022 71.3231 33.6022H62.5343V40.5035ZM71.0871 58.3169H49.3217V65.2181H71.0871C73.0926 65.2181 74.6262 63.6845 74.6262 61.7969C74.6262 59.8505 73.0926 58.3169 71.0871 58.3169ZM43.1873 52.3004C38.0555 52.3004 33.8086 56.5473 33.8086 61.7969C33.8086 66.9876 38.0555 71.2345 43.1873 71.2345C48.3779 71.2345 52.6249 66.9876 52.6249 61.7969C52.6249 56.5473 48.3779 52.3004 43.1873 52.3004ZM43.1873 57.4911C45.6056 57.4911 47.4342 59.3786 47.4342 61.7969C47.4342 64.2154 45.6056 66.0439 43.1873 66.0439C40.8278 66.0439 38.9993 64.2154 38.9993 61.7969C38.9993 59.3786 40.8278 57.4911 43.1873 57.4911ZM37.5247 58.3169H28.736C26.9664 58.3169 25.4328 59.8505 25.4328 61.7969C25.4328 63.6845 26.9664 65.2181 28.736 65.2181H37.5247V58.3169Z"/>
</symbol>

<symbol id="close-icon" viewBox="0 0 100 100" width="20" height="20">
Expand All @@ -60,21 +64,24 @@
l3.5-3.5c0.1-0.1,0.1-0.3,0-0.4L53.9,49.8l26.8-26.8C80.8,22.8,80.8,22.7,80.7,22.6z"/>
</symbol>

<symbol id="plus-icon" viewBox="0 0 100 100" width="20" height="20">
<line fill="none" stroke="var(--x-primary)" stroke-width="4" stroke-miterlimit="0" x1="46.5" y1="15.4" x2="46.5" y2="86.7"/>
<line fill="none" stroke="var(--x-primary)" stroke-width="4" stroke-miterlimit="0" x1="82.2" y1="51.1" x2="10.9" y2="51.1"/>
<symbol id="plus-icon" viewBox="0 0 100 100" width="24" height="24">
<path
fill="var(--x-primary)"
fill-rule="evenodd"
clip-rule="evenodd"
d="M27.9099 93H72.0903C85.2432 93 93.0001 85.4118 93.0001 72.315V27.6849C93.0001 14.5882 85.2432 7 72.0903 7H27.9099C14.7007 7 7 14.5882 7 27.6849V72.315C7 85.4118 14.7007 93 27.9099 93ZM32.5189 45.6157C29.8771 45.6157 28.0221 47.4144 28.0221 50.0562C28.0221 52.6418 29.8771 54.3843 32.5189 54.3843H45.6156V67.5373C45.6156 70.1229 47.3581 71.9778 49.9438 71.9778C52.5856 71.9778 54.3843 70.1229 54.3843 67.5373V54.3843H67.5934C70.179 54.3843 71.9777 52.6418 71.9777 50.0562C71.9777 47.4144 70.179 45.6157 67.5934 45.6157H54.3843V32.4627C54.3843 29.8209 52.5856 28.0222 49.9438 28.0222C47.3581 28.0222 45.6156 29.8209 45.6156 32.4627V45.6157H32.5189Z"/>
</symbol>

<symbol id="create-channel-icon" viewBox="0 0 100 100" width="24" height="24">
<path fill-rule="evenodd" clip-rule="evenodd" d="M34.9396 90.0914C32.7471 92.1273 31.4943 93.0669 29.6672 93.0669C27.0571 93.0669 25.5433 91.1876 25.5433 88.3687V76.4144H24.0816C11.2398 76.4144 4.50568 69.5236 4.50568 56.8907V26.509C4.50568 13.876 11.2398 6.93306 24.0816 6.93306H75.9185C88.7603 6.93306 95.4943 13.876 95.4943 26.509V56.8907C95.4943 69.5236 88.7603 76.4144 75.9185 76.4144H49.7129L34.9396 90.0914ZM33.739 37.5758C31.2855 37.5758 29.5628 39.2463 29.5628 41.6998C29.5628 44.1011 31.2855 45.7194 33.739 45.7194H45.9544V57.987C45.9544 60.3883 47.5204 62.0587 49.9217 62.0587C52.3752 62.0587 54.0457 60.3883 54.0457 57.987V45.7194H66.3132C68.7145 45.7194 70.4372 44.1011 70.4372 41.6998C70.4372 39.2463 68.7145 37.5758 66.3132 37.5758H54.0457V25.4127C54.0457 22.9591 52.3752 21.2365 49.9217 21.2365C47.5204 21.2365 45.9544 22.9591 45.9544 25.4127V37.5758H33.739Z"/>
</symbol>

<symbol id="sidebar-icon" viewBox="0 0 100 100" width="40" height="20">
<path fill="var(--x-primary)" stroke="var(--x-primary)" stroke-width="0.5" d="M13.735 86H87.2651C94.2791 86 98 82.189 98 75.297V24.7029C98 17.8109
94.2791 14 87.2651 14H13.735C6.72462 14 3 17.7136 3 24.7029V75.297C3 82.2864 6.72462 86 13.735 86ZM13.8398 83.6199C8.26159 83.6199 5.38101
80.756 5.38101 75.1741V24.8259C5.38101 19.2477 8.26159 16.38 13.8398 16.38H87.1602C92.5434 16.38 95.619 19.2477 95.619 24.8259V75.1741C95.619
80.756 92.5434 83.6199 87.1602 83.6199H13.8398ZM32.2777 84.1604H34.6477V15.3639H32.2777V84.1604ZM24.4594 31.7473C25.1435 31.7473 25.618 31.2215
25.618 30.5911C25.618 30.0092 25.1435 29.4907 24.4594 29.4907H13.2066C12.5261 29.4907 12.003 30.0092 12.003 30.5911C12.003 31.2215 12.5261
31.7473 13.2066 31.7473H24.4594ZM24.4594 42.9897C25.1435 42.9897 25.618 42.4676 25.618 41.8821C25.618 41.2517 25.1435 40.7332 24.4594
40.7332H13.2066C12.5261 40.7332 12.003 41.2517 12.003 41.8821C12.003 42.4676 12.5261 42.9897 13.2066 42.9897H24.4594ZM24.4594 54.1834C25.1435
54.1834 25.618 53.7099 25.618 53.0796C25.618 52.4491 25.1435 51.9792 24.4594 51.9792H13.2066C12.5261 51.9792 12.003 52.4491 12.003 53.0796C12.003
53.7099 12.5261 54.1834 13.2066 54.1834H24.4594Z" />
<path
fill="var(--x-primary)"
stroke="var(--x-primary)"
stroke-width="0.5"
d="M13.7478 93.2979H86.252C95.47 93.2979 99.9984 88.7697 99.9984 79.7134V20.2866C99.9984 11.2303 95.47 6.70214 86.252 6.70214H13.7478C4.58363 6.70214 0.00159073 11.2303 0.00159073 20.2866V79.7134C0.00159073 88.7697 4.58363 93.2979 13.7478 93.2979ZM13.8556 85.4814C9.97427 85.4814 7.76416 83.433 7.76416 79.336V20.6639C7.76416 16.621 9.97427 14.5186 13.8556 14.5186H86.1442C90.0255 14.5186 92.2356 16.621 92.2356 20.6639V79.336C92.2356 83.433 90.0255 85.4814 86.1442 85.4814H13.8556ZM32.615 86.9908H40.2158V13.171H32.615V86.9908ZM24.4752 38.1515C25.9307 38.1515 27.1705 36.8578 27.1705 35.4561C27.1705 34.0546 25.9307 32.8687 24.4752 32.8687H16.0119C14.6102 32.8687 13.3704 34.0546 13.3704 35.4561C13.3704 36.8578 14.6102 38.1515 16.0119 38.1515H24.4752ZM24.4752 48.9328C25.9307 48.9328 27.1705 47.6929 27.1705 46.2375C27.1705 44.8359 25.9307 43.6499 24.4752 43.6499H16.0119C14.6102 43.6499 13.3704 44.8359 13.3704 46.2375C13.3704 47.6929 14.6102 48.9328 16.0119 48.9328H24.4752ZM24.4752 59.7141C25.9307 59.7141 27.1705 58.4743 27.1705 57.0727C27.1705 55.6711 25.9307 54.4852 24.4752 54.4852H16.0119C14.6102 54.4852 13.3704 55.6711 13.3704 57.0727C13.3704 58.4743 14.6102 59.7141 16.0119 59.7141H24.4752Z"/>
</symbol>

<symbol id="config-icon" viewBox="0 0 100 100">
Expand All @@ -99,14 +106,9 @@
<path fill="var(--x-primary)" fill-rule="evenodd" clip-rule="evenodd" d="M33.6098 27.6691V18.6588C33.6098 14.9807 36.58 11.999 40.2439 11.999H60.1536C63.1633 11.999 66.0293 13.291 68.0288 15.5492L79.3386 28.3218C81.053 30.258 82 32.7585 82 35.349V65.6691C82 69.3472 79.0298 72.3289 75.3659 72.3289H66.3902V79.3392C66.3902 83.0173 63.42 85.999 59.7561 85.999H25.6341C21.9702 85.999 19 83.0173 19 79.3392V34.3289C19 30.6508 21.9702 27.6691 25.6341 27.6691H33.6098ZM39.0732 18.6588C39.0732 18.0097 39.5973 17.4836 40.2439 17.4836H60.1536C61.6027 17.4836 62.9826 18.1056 63.9454 19.1929L75.2551 31.9656C76.0806 32.8978 76.5366 34.1017 76.5366 35.349V65.6691C76.5366 66.3182 76.0124 66.8444 75.3659 66.8444H40.2439C39.5973 66.8444 39.0732 66.3182 39.0732 65.6691V18.6588ZM60.9268 72.3289V79.3392C60.9268 79.9883 60.4027 80.5145 59.7561 80.5145H25.6341C24.9876 80.5145 24.4634 79.9883 24.4634 79.3392V34.3289C24.4634 33.6798 24.9876 33.1537 25.6341 33.1537H33.6098V65.6691C33.6098 69.3472 36.58 72.3289 40.2439 72.3289H60.9268Z"/>
</symbol>

<symbol id="send-icon" viewBox="0 0 100 100" width="20" height="20">
<path fill="var(--x-primary)" d="M57.2555 95C59.3291 95 60.8129 93.6391 61.9104 90.6363L94.4412 5.47585C94.8486 4.45303 95 3.62114 95 2.8713C95
1.05383 93.9462 0 92.1286 0C91.3789 0 90.547 0.151311 89.5284 0.558793L4.32959 33.05C1.37368 34.1829 0 35.6708 0 37.7445C0 40.0078 1.45152
41.1886 5.01125 42.2522L41.9877 52.96L52.7435 89.9547C53.7505 93.4792 54.9357 95 57.2555 95ZM42.7801 50.2886L5.87476 39.6417C3.4698 38.9546
2.89577 38.4893 2.89577 37.6848C2.89577 36.8761 3.5221 36.2979 5.36578 35.6064L87.4729 4.25975C88.8497 3.74891 90.2702 3.09099 91.0163
2.785C90.1389 3.44604 87.8008 5.26787 87.1963 5.87237L42.7801 50.2886ZM57.3194 92.0562C56.5107 92.0562 56.0497 91.5302 55.3584 89.1818L44.6547
52.2765L89.1276 7.8079C89.6798 7.25571 91.5059 4.96999 92.2758 4.03161C91.9132 4.77783 91.3076 6.14597 90.7402 7.47465L59.3936 89.6342C58.7021
91.4779 58.1282 92.0562 57.3194 92.0562Z" />
<symbol id="send-icon" viewBox="0 0 100 100" width="24" height="24">
<path fill="var(--x-primary)"
d="M56.1022 90C59.2395 90 61.4154 87.2675 63.0347 83.1181L88.7407 15.9686C89.5504 13.9446 90.0058 12.1229 90.0058 10.6048C90.0058 7.771 88.2347 6 85.4516 6C83.9336 6 82.1118 6.50594 80.0877 7.26506L12.4829 33.2241C8.94073 34.5397 6.0564 36.7663 6.0564 39.9542C6.0564 43.9518 9.19374 45.2675 13.1913 46.4313L33.3817 52.6048C36.2154 53.465 37.683 53.465 39.6058 51.694L83.4781 10.959C84.0347 10.4529 84.6926 10.5542 85.0974 10.9084C85.5529 11.3132 85.6034 12.0216 85.0974 12.5783L44.5649 56.653C42.8949 58.4747 42.7432 59.841 43.654 62.8264L49.5238 82.4602C50.7383 86.6602 52.054 90 56.1022 90Z"/>
</symbol>
</defs>
</svg>
Expand Down
Loading

0 comments on commit a27c5d8

Please sign in to comment.