anyproto/anytype-ts
1
0
Fork 0
mirror of https://github.com/anyproto/anytype-ts.git synced 2025-06-10 10:00:48 +09:00
Code Activity

Merge pull request #512 from anyproto/feature/payments

Browse source 
Feature/JS-3346: Payments
This commit is contained in:
Razor 2024-03-29 13:12:50 +01:00 • committed by GitHub
commit d87cb75355
Signed by: github
GPG key ID: B5690EEEBB952194
66 changed files with 2085 additions and 113 deletions
Download patch file Download diff file Expand all files Collapse all files

BIN
dist/font/riccione/extralight.otf vendored Normal file
View file

Binary file not shown.

10
electron/js/menu.js
View file

@ -261,6 +261,16 @@ class MenuManager {
Separator,
{
label: 'Test payment', type: 'checkbox', checked: config.testPayment,
click: () => {
Api.setConfig(this.win, { testPayment: !config.testPayment });
this.win.reload();
}
},
Separator,
{ label: 'Export templates', click: () => Util.send(this.win, 'commandGlobal', 'exportTemplates') },
{ label: 'Export objects', click: () => Util.send(this.win, 'commandGlobal', 'exportObjects') },
{ label: 'Export localstore', click: () => Util.send(this.win, 'commandGlobal', 'exportLocalstore') },

3
src/img/icon/payment/hyperlink.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.5 3.75H13M13 3.75V11.25M13 3.75L3 13.75" stroke="black"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 173 B

34
src/img/icon/payment/slide0.svg Normal file
View file

@ -0,0 +1,34 @@
<svg width="320" height="104" viewBox="0 0 320 104" fill="none" xmlns="http://www.w3.org/2000/svg">
<mask id="path-1-inside-1_1508_9466" fill="white">
<path fill-rule="evenodd" clip-rule="evenodd" d="M136.763 51.8221C136 53.3194 136 55.2796 136 59.2V60.8C136 64.7204 136 66.6806 136.763 68.1779C137.434 69.4951 138.505 70.5659 139.822 71.237C141.319 72 143.28 72 147.2 72H148.8C152.72 72 154.681 72 156.178 71.237C157.495 70.5659 158.566 69.4951 159.237 68.1779C160 66.6806 160 64.7204 160 60.8V59.2C160 55.2796 160 53.3194 159.237 51.8221C158.566 50.5049 157.495 49.4341 156.178 48.763C154.681 48 152.72 48 148.8 48H147.2C143.28 48 141.319 48 139.822 48.763C138.505 49.4341 137.434 50.5049 136.763 51.8221ZM147.085 65.7914L154.422 54.2675L153.578 53.7305L146.911 64.2027L142.354 59.6436L141.646 60.3505L147.085 65.7914Z"/>
</mask>
<path fill-rule="evenodd" clip-rule="evenodd" d="M136.763 51.8221C136 53.3194 136 55.2796 136 59.2V60.8C136 64.7204 136 66.6806 136.763 68.1779C137.434 69.4951 138.505 70.5659 139.822 71.237C141.319 72 143.28 72 147.2 72H148.8C152.72 72 154.681 72 156.178 71.237C157.495 70.5659 158.566 69.4951 159.237 68.1779C160 66.6806 160 64.7204 160 60.8V59.2C160 55.2796 160 53.3194 159.237 51.8221C158.566 50.5049 157.495 49.4341 156.178 48.763C154.681 48 152.72 48 148.8 48H147.2C143.28 48 141.319 48 139.822 48.763C138.505 49.4341 137.434 50.5049 136.763 51.8221ZM147.085 65.7914L154.422 54.2675L153.578 53.7305L146.911 64.2027L142.354 59.6436L141.646 60.3505L147.085 65.7914Z" fill="#252525"/>
<path d="M136.763 51.8221L137.654 52.2761L136.763 51.8221ZM136.763 68.1779L137.654 67.7239H137.654L136.763 68.1779ZM139.822 71.237L139.368 72.1281L139.822 71.237ZM156.178 71.237L155.724 70.346L156.178 71.237ZM159.237 68.1779L158.346 67.7239L159.237 68.1779ZM159.237 51.8221L160.128 51.3681L159.237 51.8221ZM156.178 48.763L155.724 49.654V49.654L156.178 48.763ZM139.822 48.763L140.276 49.654L139.822 48.763ZM154.422 54.2675L155.265 54.8046L155.802 53.9611L154.959 53.424L154.422 54.2675ZM147.085 65.7914L146.378 66.4983L147.259 67.38L147.928 66.3284L147.085 65.7914ZM153.578 53.7305L154.115 52.8869L153.272 52.3499L152.735 53.1934L153.578 53.7305ZM146.911 64.2027L146.204 64.9097L147.085 65.7914L147.754 64.7398L146.911 64.2027ZM142.354 59.6436L143.061 58.9366L142.354 58.2294L141.647 58.9363L142.354 59.6436ZM141.646 60.3505L140.94 59.6433L140.232 60.3502L140.939 61.0575L141.646 60.3505ZM137 59.2C137 57.2233 137.001 55.8009 137.092 54.6838C137.182 53.5784 137.356 52.8603 137.654 52.2761L135.872 51.3681C135.407 52.2812 135.199 53.2919 135.099 54.521C134.999 55.7384 135 57.2563 135 59.2H137ZM137 60.8V59.2H135V60.8H137ZM137.654 67.7239C137.356 67.1397 137.182 66.4216 137.092 65.3162C137.001 64.1991 137 62.7767 137 60.8H135C135 62.7437 134.999 64.2616 135.099 65.479C135.199 66.7081 135.407 67.7188 135.872 68.6319L137.654 67.7239ZM140.276 70.346C139.147 69.7708 138.229 68.8529 137.654 67.7239L135.872 68.6319C136.639 70.1372 137.863 71.3611 139.368 72.1281L140.276 70.346ZM147.2 71C145.223 71 143.801 70.9992 142.684 70.908C141.578 70.8176 140.86 70.6437 140.276 70.346L139.368 72.1281C140.281 72.5933 141.292 72.8009 142.521 72.9013C143.738 73.0008 145.256 73 147.2 73V71ZM148.8 71H147.2V73H148.8V71ZM155.724 70.346C155.14 70.6437 154.422 70.8176 153.316 70.908C152.199 70.9992 150.777 71 148.8 71V73C150.744 73 152.262 73.0008 153.479 72.9013C154.708 72.8009 155.719 72.5933 156.632 72.1281L155.724 70.346ZM158.346 67.7239C157.771 68.8529 156.853 69.7708 155.724 70.346L156.632 72.1281C158.137 71.3611 159.361 70.1372 160.128 68.6319L158.346 67.7239ZM159 60.8C159 62.7767 158.999 64.1991 158.908 65.3162C158.818 66.4216 158.644 67.1397 158.346 67.7239L160.128 68.6319C160.593 67.7188 160.801 66.7081 160.901 65.479C161.001 64.2616 161 62.7437 161 60.8H159ZM159 59.2V60.8H161V59.2H159ZM158.346 52.2761C158.644 52.8603 158.818 53.5784 158.908 54.6838C158.999 55.8009 159 57.2233 159 59.2H161C161 57.2563 161.001 55.7384 160.901 54.521C160.801 53.2919 160.593 52.2812 160.128 51.3681L158.346 52.2761ZM155.724 49.654C156.853 50.2292 157.771 51.1471 158.346 52.2761L160.128 51.3681C159.361 49.8628 158.137 48.6389 156.632 47.8719L155.724 49.654ZM148.8 49C150.777 49 152.199 49.0008 153.316 49.092C154.422 49.1824 155.14 49.3563 155.724 49.654L156.632 47.8719C155.719 47.4067 154.708 47.1991 153.479 47.0987C152.262 46.9992 150.744 47 148.8 47V49ZM147.2 49H148.8V47H147.2V49ZM140.276 49.654C140.86 49.3563 141.578 49.1824 142.684 49.092C143.801 49.0008 145.223 49 147.2 49V47C145.256 47 143.738 46.9992 142.521 47.0987C141.292 47.1991 140.281 47.4067 139.368 47.8719L140.276 49.654ZM137.654 52.2761C138.229 51.1471 139.147 50.2292 140.276 49.654L139.368 47.8719C137.863 48.6389 136.639 49.8628 135.872 51.3681L137.654 52.2761ZM153.578 53.7305L146.241 65.2543L147.928 66.3284L155.265 54.8046L153.578 53.7305ZM153.041 54.574L153.885 55.1111L154.959 53.424L154.115 52.8869L153.041 54.574ZM147.754 64.7398L154.422 54.2675L152.735 53.1934L146.067 63.6657L147.754 64.7398ZM141.646 60.3505L146.204 64.9097L147.618 63.4958L143.061 58.9366L141.646 60.3505ZM142.353 61.0578L143.061 60.3508L141.647 58.9363L140.94 59.6433L142.353 61.0578ZM147.792 65.0844L142.354 59.6436L140.939 61.0575L146.378 66.4983L147.792 65.0844Z" fill="#252525" mask="url(#path-1-inside-1_1508_9466)"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M40 84C40 95.0457 31.0457 104 20 104C8.9543 104 0 95.0457 0 84C0 72.9543 8.9543 64 20 64C31.0457 64 40 72.9543 40 84ZM15 76V74H16V76H15ZM24 74V76H25V74H24ZM23.2488 81.9347C22.4378 81.367 21.2907 81 20 81V80C21.4707 80 22.8237 80.4165 23.8223 81.1155C24.8193 81.8134 25.5 82.8256 25.5 84C25.5 85.1744 24.8193 86.1866 23.8223 86.8845C22.8237 87.5835 21.4707 88 20 88V87C21.2907 87 22.4378 86.633 23.2488 86.0653C24.0614 85.4964 24.5 84.7586 24.5 84C24.5 83.2414 24.0614 82.5036 23.2488 81.9347ZM12.5 88C12.5 92.1421 15.8579 95.5 20 95.5V96.5C15.3056 96.5 11.5 92.6944 11.5 88H12.5Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M88 20C88 31.0457 79.0457 40 68 40C56.9543 40 48 31.0457 48 20C48 8.9543 56.9543 0 68 0C79.0457 0 88 8.9543 88 20ZM63 12V10H64V12H63ZM72 10V12H73V10H72ZM72.4891 23.0006C72.3529 19.7571 70.8894 16.1792 67.709 13.9075L68.2902 13.0938C71.9454 15.7046 73.4996 19.8708 73.4996 23.5006V24.0006H67.9996V23.0006H72.4891ZM60.5 24C60.5 28.1421 63.8579 31.5 68 31.5V32.5C63.3056 32.5 59.5 28.6944 59.5 24H60.5Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M148 81H60C53.9249 81 49 85.9249 49 92C49 98.0751 53.9249 103 60 103H148C154.075 103 159 98.0751 159 92C159 85.9249 154.075 81 148 81ZM60 80C53.3726 80 48 85.3726 48 92C48 98.6274 53.3726 104 60 104H148C154.627 104 160 98.6274 160 92C160 85.3726 154.627 80 148 80H60Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M148.375 92.5H60.375V91.5H148.375V92.5Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M228 1H108C101.925 1 97 5.92487 97 12V20C97 26.0751 101.925 31 108 31H228C234.075 31 239 26.0751 239 20V12C239 5.92487 234.075 1 228 1ZM108 0C101.373 0 96 5.37258 96 12V20C96 26.6274 101.373 32 108 32H228C234.627 32 240 26.6274 240 20V12C240 5.37258 234.627 0 228 0H108Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M228 12.5H108V11.5H228V12.5Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M195 20.5H108V19.5H195V20.5Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M116 49H60C53.9249 49 49 53.9249 49 60C49 66.0751 53.9249 71 60 71H116C122.075 71 127 66.0751 127 60C127 53.9249 122.075 49 116 49ZM60 48C53.3726 48 48 53.3726 48 60C48 66.6274 53.3726 72 60 72H116C122.627 72 128 66.6274 128 60C128 53.3726 122.627 48 116 48H60Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M116 60.5H60V59.5H116V60.5Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M260 41H188C181.925 41 177 45.9249 177 52V76C177 82.0751 181.925 87 188 87H260C266.075 87 271 82.0751 271 76V52C271 45.9249 266.075 41 260 41ZM188 40C181.373 40 176 45.3726 176 52V76C176 82.6274 181.373 88 188 88H260C266.627 88 272 82.6274 272 76V52C272 45.3726 266.627 40 260 40H188Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M259 52.5H188V51.5H259V52.5Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M248 60.5H188V59.5H248V60.5Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M259 68.5H188V67.5H259V68.5Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M232 76.5H188V75.5H232V76.5Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M300 96C288.954 96 280 87.0457 280 76C280 64.9543 288.954 56 300 56C311.046 56 320 64.9543 320 76C320 87.0457 311.046 96 300 96ZM305 68V70H304V68H305ZM296 70V68H295V70H296ZM299 68C299 70.2091 297.209 72 295 72C292.791 72 291 70.2091 291 68C291 65.7909 292.791 64 295 64C297.209 64 299 65.7909 299 68ZM296.567 72.7495C296.074 72.9121 295.547 73 295 73C292.239 73 290 70.7614 290 68C290 65.2386 292.239 63 295 63C297.761 63 300 65.2386 300 68C300 69.2774 299.521 70.443 298.733 71.3268L292.883 80H300V81H291.003L296.567 72.7495ZM305 73C302.239 73 300 70.7614 300 68C300 65.2386 302.239 63 305 63C307.761 63 310 65.2386 310 68C310 70.7614 307.761 73 305 73ZM305.841 85.8542C304.268 87.4234 302.148 88.5002 300 88.5002V87.5002C301.821 87.5002 303.701 86.577 305.135 85.1461C306.57 83.7155 307.5 81.8362 307.5 80H308.5C308.5 82.1639 307.415 84.2847 305.841 85.8542ZM305 72C307.209 72 309 70.2091 309 68C309 65.7909 307.209 64 305 64C302.791 64 301 65.7909 301 68C301 70.2091 302.791 72 305 72Z" fill="#252525"/>
<circle cx="261" cy="17" r="3" fill="#252525"/>
<circle cx="267" cy="17" r="3" fill="#252525"/>
<path d="M264 24.9997C260.344 23.2802 258.07 19.8913 258 17H264V24.9997Z" fill="#252525"/>
<path d="M264 24.9997C267.656 23.2802 269.93 19.8913 270 17H264V24.9997Z" fill="#252525"/>
<circle cx="247" cy="23" r="3" fill="#252525"/>
<circle cx="253" cy="23" r="3" fill="#252525"/>
<path d="M250 30.9997C246.344 29.2802 244.07 25.8913 244 23H250V30.9997Z" fill="#252525"/>
<path d="M250 30.9997C253.656 29.2802 255.93 25.8913 256 23H250V30.9997Z" fill="#252525"/>
<circle cx="281" cy="3" r="3" fill="#252525"/>
<circle cx="275" cy="3" r="3" fill="#252525"/>
<path d="M278 10.9997C274.344 9.28024 272.07 5.89134 272 3H278V10.9997Z" fill="#252525"/>
<path d="M278 10.9997C281.656 9.28024 283.93 5.89134 284 3H278V10.9997Z" fill="#252525"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 10 KiB

22
src/img/icon/payment/slide1.svg Normal file
View file

@ -0,0 +1,22 @@
<svg width="320" height="104" viewBox="0 0 320 104" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M75 37C71.134 37 68 40.134 68 44C68 47.866 71.134 51 75 51H93C96.866 51 100 47.866 100 44C100 40.134 96.866 37 93 37H75ZM91 43H90V45H91V43ZM87 43H88V45H87V43ZM94 43H93V45H94V43Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M75 53C71.134 53 68 56.134 68 60C68 63.866 71.134 67 75 67H93C96.866 67 100 63.866 100 60C100 56.134 96.866 53 93 53H75ZM91 59H90V61H91V59ZM87 59H88V61H87V59ZM94 59H93V61H94V59Z" fill="#252525"/>
<path d="M232 52C232 48.6863 229.314 46 226 46C222.686 46 220 48.6863 220 52C220 55.3137 222.686 58 226 58C229.314 58 232 55.3137 232 52Z" fill="black"/>
<path d="M248 43C248 39.6863 245.314 37 242 37C238.686 37 236 39.6863 236 43C236 46.3137 238.686 49 242 49C245.314 49 248 46.3137 248 43Z" fill="black"/>
<path d="M248 61C248 57.6863 245.314 55 242 55C238.686 55 236 57.6863 236 61C236 64.3137 238.686 67 242 67C245.314 67 248 64.3137 248 61Z" fill="black"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M188 1H132C125.925 1 121 5.92487 121 12V92C121 98.0751 125.925 103 132 103H188C194.075 103 199 98.0751 199 92V12C199 5.92487 194.075 1 188 1ZM132 0C125.373 0 120 5.37259 120 12V92C120 98.6274 125.373 104 132 104H188C194.627 104 200 98.6274 200 92V12C200 5.37258 194.627 0 188 0H132Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M102 17H66C61.0294 17 57 21.0294 57 26V78C57 82.9706 61.0294 87 66 87H102C106.971 87 111 82.9706 111 78V26C111 21.0294 106.971 17 102 17ZM66 16C60.4772 16 56 20.4772 56 26V78C56 83.5229 60.4772 88 66 88H102C107.523 88 112 83.5229 112 78V26C112 20.4772 107.523 16 102 16H66Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M254 16.625H218C213.029 16.625 209 20.6544 209 25.625V77.625C209 82.5956 213.029 86.625 218 86.625H254C258.971 86.625 263 82.5956 263 77.625V25.625C263 20.6544 258.971 16.625 254 16.625ZM218 15.625C212.477 15.625 208 20.1022 208 25.625V77.625C208 83.1479 212.477 87.625 218 87.625H254C259.523 87.625 264 83.1479 264 77.625V25.625C264 20.1022 259.523 15.625 254 15.625H218Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M40 23H8C4.13401 23 1 26.134 1 30V74C1 77.866 4.13401 81 8 81H40C43.866 81 47 77.866 47 74V30C47 26.134 43.866 23 40 23ZM8 22C3.58172 22 0 25.5817 0 30V74C0 78.4183 3.58172 82 8 82H40C44.4183 82 48 78.4183 48 74V30C48 25.5817 44.4183 22 40 22H8Z" fill="#252525"/>
<path d="M136 69H184V70H136V69Z" fill="black"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M136 69V70H184V69H136Z" fill="#252525"/>
<path d="M136 77H184V78H136V77Z" fill="black"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M136 77V78H184V77H136Z" fill="#252525"/>
<path d="M148 85H172V86H148V85Z" fill="black"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M148 85V86H172V85H148Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M312 22.625H280C276.134 22.625 273 25.759 273 29.625V73.625C273 77.491 276.134 80.625 280 80.625H312C315.866 80.625 319 77.491 319 73.625V29.625C319 25.759 315.866 22.625 312 22.625ZM280 21.625C275.582 21.625 272 25.2067 272 29.625V73.625C272 78.0433 275.582 81.625 280 81.625H312C316.418 81.625 320 78.0433 320 73.625V29.625C320 25.2067 316.418 21.625 312 21.625H280Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M308 52C308 58.6274 302.627 64 296 64C289.373 64 284 58.6274 284 52C284 45.3726 289.373 40 296 40C302.627 40 308 45.3726 308 52ZM295.5 51.5V46H296.5V51.5H302V52.5H296.5V58H295.5V52.5H290V51.5H295.5Z" fill="black"/>
<path d="M36 51.8125C36 58.4054 30.6554 63.75 24.0625 63.75C17.4696 63.75 12.125 58.4054 12.125 51.8125C12.125 45.2196 17.4696 39.875 24.0625 39.875C30.6554 39.875 36 45.2196 36 51.8125Z" fill="black"/>
<path d="M32 52L34 66L21 59L32 52Z" fill="black"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M160.391 58C149.345 58 140.391 49.0457 140.391 38C140.391 26.9543 149.345 18 160.391 18C171.436 18 180.391 26.9543 180.391 38C180.391 49.0457 171.436 58 160.391 58ZM165.391 30V32H164.391V30H165.391ZM156.391 32V30H155.391V32H156.391ZM159.391 30C159.391 32.2091 157.6 34 155.391 34C153.181 34 151.391 32.2091 151.391 30C151.391 27.7909 153.181 26 155.391 26C157.6 26 159.391 27.7909 159.391 30ZM156.958 34.7495C156.465 34.9121 155.938 35 155.391 35C152.629 35 150.391 32.7614 150.391 30C150.391 27.2386 152.629 25 155.391 25C158.152 25 160.391 27.2386 160.391 30C160.391 31.2774 159.912 32.443 159.123 33.3268L153.274 42H160.391V43H151.393L156.958 34.7495ZM165.391 35C162.629 35 160.391 32.7614 160.391 30C160.391 27.2386 162.629 25 165.391 25C168.152 25 170.391 27.2386 170.391 30C170.391 32.7614 168.152 35 165.391 35ZM166.232 47.8542C164.659 49.4234 162.538 50.5002 160.391 50.5002V49.5002C162.212 49.5002 164.091 48.577 165.526 47.1461C166.96 45.7155 167.891 43.8362 167.891 42H168.891C168.891 44.1639 167.805 46.2847 166.232 47.8542ZM165.391 34C167.6 34 169.391 32.2091 169.391 30C169.391 27.7909 167.6 26 165.391 26C163.181 26 161.391 27.7909 161.391 30C161.391 32.2091 163.181 34 165.391 34Z" fill="black"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 5 KiB

30
src/img/icon/payment/slide2.svg Normal file
View file

@ -0,0 +1,30 @@
<svg width="320" height="104" viewBox="0 0 320 104" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M280 76C280 87.0457 288.954 96 300 96C311.046 96 320 87.0457 320 76C320 64.9543 311.046 56 300 56C288.954 56 280 64.9543 280 76ZM305 68V66H304V68H305ZM296 66V68H295V66H296ZM296.751 73.9347C297.562 73.367 298.709 73 300 73V72C298.529 72 297.176 72.4165 296.178 73.1155C295.181 73.8134 294.5 74.8256 294.5 76C294.5 77.1744 295.181 78.1866 296.178 78.8845C297.176 79.5835 298.529 80 300 80V79C298.709 79 297.562 78.633 296.751 78.0653C295.939 77.4964 295.5 76.7586 295.5 76C295.5 75.2414 295.939 74.5036 296.751 73.9347ZM307.5 80C307.5 84.1421 304.142 87.5 300 87.5V88.5C304.694 88.5 308.5 84.6944 308.5 80H307.5Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M204 17H116C109.925 17 105 21.9249 105 28V76C105 82.0751 109.925 87 116 87H204C210.075 87 215 82.0751 215 76V28C215 21.9249 210.075 17 204 17ZM116 16C109.373 16 104 21.3726 104 28V76C104 82.6274 109.373 88 116 88H204C210.627 88 216 82.6274 216 76V28C216 21.3726 210.627 16 204 16H116Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M178 1H142C135.925 1 131 5.92487 131 12V92C131 98.0751 135.925 103 142 103H178C184.075 103 189 98.0751 189 92V12C189 5.92487 184.075 1 178 1ZM142 0C135.373 0 130 5.37259 130 12V92C130 98.6274 135.373 104 142 104H178C184.627 104 190 98.6274 190 92V12C190 5.37258 184.627 0 178 0H142Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M40 52C40 63.0457 31.0457 72 20 72C8.9543 72 0 63.0457 0 52C0 40.9543 8.9543 32 20 32C31.0457 32 40 40.9543 40 52ZM15 46V44H16V46H15ZM24 44V46H25V44H24ZM27.0644 56H20V57H28.9356L23.4174 48.7444C23.9147 48.9102 24.4469 49 25 49C27.7614 49 30 46.7614 30 44C30 41.2386 27.7614 39 25 39C22.2386 39 20 41.2386 20 44C20 45.2768 20.4786 46.4418 21.2662 47.3255L27.0644 56ZM20 64.5002C17.8524 64.5002 15.7319 63.4234 14.1586 61.8542C12.5851 60.2847 11.5 58.1639 11.5 56H12.5C12.5 57.8362 13.4305 59.7155 14.8648 61.1461C16.2993 62.577 18.1788 63.5002 20 63.5002V64.5002ZM25 48C22.7909 48 21 46.2091 21 44C21 41.7909 22.7909 40 25 40C27.2091 40 29 41.7909 29 44C29 46.2091 27.2091 48 25 48ZM11 44C11 46.2091 12.7909 48 15 48C17.2091 48 19 46.2091 19 44C19 41.7909 17.2091 40 15 40C12.7909 40 11 41.7909 11 44ZM10 44C10 46.7614 12.2386 49 15 49C17.7614 49 20 46.7614 20 44C20 41.2386 17.7614 39 15 39C12.2386 39 10 41.2386 10 44Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M151 32C144.925 32 140 36.9249 140 43V61C140 67.0751 144.925 72 151 72H169C175.075 72 180 67.0751 180 61V43C180 36.9249 175.075 32 169 32H151ZM160 63.75C153.649 63.75 148.5 58.6013 148.5 52.25H147.5C147.5 59.1536 153.096 64.75 160 64.75C166.904 64.75 172.5 59.1536 172.5 52.25H171.5C171.5 58.6013 166.351 63.75 160 63.75ZM154.5 46.25V43.25H155.5V46.25H154.5ZM164.5 43.25V46.25H165.5V43.25H164.5Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M280 28C280 39.0457 288.954 48 300 48C311.046 48 320 39.0457 320 28C320 16.9543 311.046 8 300 8C288.954 8 280 16.9543 280 28ZM305 20V18H304V20H305ZM296 18V20H295V18H296ZM295.511 31.0006C295.647 27.7571 297.111 24.1792 300.291 21.9075L299.71 21.0938C296.055 23.7046 294.5 27.8708 294.5 31.5006V32.0006H300V31.0006H295.511ZM307.5 32C307.5 36.1421 304.142 39.5 300 39.5V40.5C304.694 40.5 308.5 36.6944 308.5 32H307.5Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M256 39C264.284 39 271 32.2843 271 24C271 15.7157 264.284 9 256 9C255.302 9 254.615 9.04767 253.943 9.13993C253.314 8.88824 252.665 8.6753 252 8.50407C253.278 8.17501 254.619 8 256 8C264.837 8 272 15.1634 272 24C272 32.8366 264.837 40 256 40C254.619 40 253.278 39.825 252 39.4959C252.665 39.3247 253.314 39.1118 253.943 38.8601C254.615 38.9523 255.302 39 256 39Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M256 40C264.837 40 272 32.8366 272 24C272 15.1634 264.837 8 256 8C255.346 8 254.702 8.03921 254.068 8.1154C253.364 8.20018 252.673 8.33076 252 8.50407C252.665 8.67528 253.314 8.88818 253.942 9.13984C253.942 9.13987 253.943 9.1399 253.943 9.13993C254.459 9.06909 254.984 9.02453 255.516 9.00766C255.677 9.00257 255.838 9 256 9C264.284 9 271 15.7157 271 24C271 32.2843 264.284 39 256 39C255.795 39 255.591 38.9959 255.388 38.9877C254.9 38.9682 254.418 38.9252 253.943 38.8601C253.943 38.8601 253.942 38.8601 253.942 38.8602C253.314 39.1118 252.665 39.3247 252 39.4959C252.673 39.6692 253.364 39.7998 254.068 39.8846C254.522 39.9391 254.981 39.9747 255.445 39.9905C255.629 39.9968 255.814 40 256 40Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M248 39C256.284 39 263 32.2843 263 24C263 15.7157 256.284 9 248 9C247.302 9 246.615 9.04767 245.943 9.13993C245.314 8.88824 244.665 8.6753 244 8.50407C245.278 8.17501 246.619 8 248 8C256.837 8 264 15.1634 264 24C264 32.8366 256.837 40 248 40C246.619 40 245.278 39.825 244 39.4959C244.665 39.3247 245.314 39.1118 245.943 38.8601C246.615 38.9523 247.302 39 248 39Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M248 40C256.837 40 264 32.8366 264 24C264 15.1634 256.837 8 248 8C247.346 8 246.702 8.03921 246.068 8.1154C245.364 8.20018 244.673 8.33076 244 8.50407C244.665 8.67528 245.314 8.88818 245.942 9.13984C245.942 9.13987 245.943 9.1399 245.943 9.13993C246.459 9.06909 246.984 9.02453 247.516 9.00766C247.677 9.00257 247.838 9 248 9C256.284 9 263 15.7157 263 24C263 32.2843 256.284 39 248 39C247.795 39 247.591 38.9959 247.388 38.9877C246.9 38.9682 246.418 38.9252 245.943 38.8601C245.943 38.8601 245.942 38.8601 245.942 38.8602C245.314 39.1118 244.665 39.3247 244 39.4959C244.673 39.6692 245.364 39.7998 246.068 39.8846C246.522 39.9391 246.981 39.9747 247.445 39.9905C247.629 39.9968 247.814 40 248 40Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M225 24C225 32.2843 231.716 39 240 39C248.284 39 255 32.2843 255 24C255 15.7157 248.284 9 240 9C231.716 9 225 15.7157 225 24ZM240 8C231.163 8 224 15.1634 224 24C224 32.8366 231.163 40 240 40C248.837 40 256 32.8366 256 24C256 15.1634 248.837 8 240 8Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M233.023 22.4052C233.304 25.5642 235.91 29.1453 240 31C244.09 29.1453 246.696 25.5642 246.977 22.4052C246.992 22.2723 247 22.137 247 22C247 20.067 245.433 18.5 243.5 18.5C241.567 18.5 240 20.067 240 22C240 20.067 238.433 18.5 236.5 18.5C234.567 18.5 233 20.067 233 22C233 22.137 233.008 22.2723 233.023 22.4052Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M64 63C55.7157 63 49 56.2843 49 48C49 39.7157 55.7157 33 64 33C64.698 33 65.3848 33.0477 66.0574 33.1399C66.6862 32.8882 67.3347 32.6753 68 32.5041C66.7215 32.175 65.3812 32 64 32C55.1634 32 48 39.1634 48 48C48 56.8366 55.1634 64 64 64C65.3812 64 66.7215 63.825 68 63.4959C67.3347 63.3247 66.6862 63.1118 66.0574 62.8601C65.3848 62.9523 64.698 63 64 63Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M64 64C55.1634 64 48 56.8366 48 48C48 39.1634 55.1634 32 64 32C64.6537 32 65.2983 32.0392 65.9315 32.1154C66.6361 32.2002 67.3266 32.3308 68 32.5041C67.3348 32.6753 66.6864 32.8882 66.0576 33.1398C66.0575 33.1399 66.0575 33.1399 66.0574 33.1399C65.5409 33.0691 65.0161 33.0245 64.4843 33.0077C64.3235 33.0026 64.1621 33 64 33C55.7157 33 49 39.7157 49 48C49 56.2843 55.7157 63 64 63C64.2051 63 64.4092 62.9959 64.6123 62.9877C65.1004 62.9682 65.5824 62.9252 66.0574 62.8601C66.0575 62.8601 66.0575 62.8601 66.0576 62.8602C66.6864 63.1118 67.3348 63.3247 68 63.4959C67.3266 63.6692 66.6361 63.7998 65.9315 63.8846C65.4784 63.9391 65.0195 63.9747 64.5555 63.9905C64.3711 63.9968 64.1859 64 64 64Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M72 63C63.7157 63 57 56.2843 57 48C57 39.7157 63.7157 33 72 33C72.698 33 73.3848 33.0477 74.0574 33.1399C74.6862 32.8882 75.3347 32.6753 76 32.5041C74.7215 32.175 73.3812 32 72 32C63.1634 32 56 39.1634 56 48C56 56.8366 63.1634 64 72 64C73.3812 64 74.7215 63.825 76 63.4959C75.3347 63.3247 74.6862 63.1118 74.0574 62.8601C73.3848 62.9523 72.698 63 72 63Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M72 64C63.1634 64 56 56.8366 56 48C56 39.1634 63.1634 32 72 32C72.6537 32 73.2983 32.0392 73.9315 32.1154C74.6361 32.2002 75.3266 32.3308 76 32.5041C75.3348 32.6753 74.6864 32.8882 74.0576 33.1398C74.0575 33.1399 74.0575 33.1399 74.0574 33.1399C73.5409 33.0691 73.0161 33.0245 72.4843 33.0077C72.3235 33.0026 72.1621 33 72 33C63.7157 33 57 39.7157 57 48C57 56.2843 63.7157 63 72 63C72.2051 63 72.4092 62.9959 72.6123 62.9877C73.1004 62.9682 73.5824 62.9252 74.0574 62.8601C74.0575 62.8601 74.0575 62.8601 74.0576 62.8602C74.6864 63.1118 75.3348 63.3247 76 63.4959C75.3266 63.6692 74.6361 63.7998 73.9315 63.8846C73.4784 63.9391 73.0195 63.9747 72.5555 63.9905C72.3711 63.9968 72.1859 64 72 64Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M65 48C65 56.2843 71.7157 63 80 63C88.2843 63 95 56.2843 95 48C95 39.7157 88.2843 33 80 33C71.7157 33 65 39.7157 65 48ZM80 32C71.1634 32 64 39.1634 64 48C64 56.8366 71.1634 64 80 64C88.8366 64 96 56.8366 96 48C96 39.1634 88.8366 32 80 32Z" fill="#252525"/>
<path d="M77 44.9906V52.9641C77 53.5146 77.4448 53.9615 77.9952 53.9641L84.897 53.997C85.3675 53.9992 85.7759 53.6732 85.878 53.2139L87.4327 46.2178C87.5715 45.5932 87.0963 45.0008 86.4565 45.0008H82C82 45.0008 83 43.5637 83 42.0012C83 40.4012 82.5508 39.6906 81.9922 39.2595C81.4336 38.8284 80.2812 39.006 80.2812 40.0281C80.2734 42.0321 78.9375 43.6414 77 44.9906Z" fill="#252525"/>
<path d="M72 45H76V53C76 53.5523 75.5523 54 75 54H73C72.4477 54 72 53.5523 72 53V45Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M225 72C225 80.2843 231.716 87 240 87C248.284 87 255 80.2843 255 72C255 63.7157 248.284 57 240 57C231.716 57 225 63.7157 225 72ZM240 56C231.163 56 224 63.1634 224 72C224 80.8366 231.163 88 240 88C248.837 88 256 80.8366 256 72C256 63.1634 248.837 56 240 56Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M256 87C264.284 87 271 80.2843 271 72C271 63.7157 264.284 57 256 57C255.302 57 254.615 57.0477 253.943 57.1399C253.314 56.8882 252.665 56.6753 252 56.5041C253.278 56.175 254.619 56 256 56C264.837 56 272 63.1634 272 72C272 80.8366 264.837 88 256 88C254.619 88 253.278 87.825 252 87.4959C252.665 87.3247 253.314 87.1118 253.943 86.8601C254.615 86.9523 255.302 87 256 87Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M256 88C264.837 88 272 80.8366 272 72C272 63.1634 264.837 56 256 56C255.346 56 254.702 56.0392 254.068 56.1154C253.364 56.2002 252.673 56.3308 252 56.5041C252.665 56.6753 253.314 56.8882 253.942 57.1398C253.942 57.1399 253.943 57.1399 253.943 57.1399C254.459 57.0691 254.984 57.0245 255.516 57.0077C255.677 57.0026 255.838 57 256 57C264.284 57 271 63.7157 271 72C271 80.2843 264.284 87 256 87C255.795 87 255.591 86.9959 255.388 86.9877C254.9 86.9682 254.418 86.9252 253.943 86.8601C253.943 86.8601 253.942 86.8601 253.942 86.8602C253.314 87.1118 252.665 87.3247 252 87.4959C252.673 87.6692 253.364 87.7998 254.068 87.8846C254.522 87.9391 254.981 87.9747 255.445 87.9905C255.629 87.9968 255.814 88 256 88Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M248 87C256.284 87 263 80.2843 263 72C263 63.7157 256.284 57 248 57C247.302 57 246.615 57.0477 245.943 57.1399C245.314 56.8882 244.665 56.6753 244 56.5041C245.278 56.175 246.619 56 248 56C256.837 56 264 63.1634 264 72C264 80.8366 256.837 88 248 88C246.619 88 245.278 87.825 244 87.4959C244.665 87.3247 245.314 87.1118 245.943 86.8601C246.615 86.9523 247.302 87 248 87Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M248 88C256.837 88 264 80.8366 264 72C264 63.1634 256.837 56 248 56C247.346 56 246.702 56.0392 246.068 56.1154C245.364 56.2002 244.673 56.3308 244 56.5041C244.665 56.6753 245.314 56.8882 245.942 57.1398C245.942 57.1399 245.943 57.1399 245.943 57.1399C246.459 57.0691 246.984 57.0245 247.516 57.0077C247.677 57.0026 247.838 57 248 57C256.284 57 263 63.7157 263 72C263 80.2843 256.284 87 248 87C247.795 87 247.591 86.9959 247.388 86.9877C246.9 86.9682 246.418 86.9252 245.943 86.8601C245.943 86.8601 245.942 86.8601 245.942 86.8602C245.314 87.1118 244.665 87.3247 244 87.4959C244.673 87.6692 245.364 87.7998 246.068 87.8846C246.522 87.9391 246.981 87.9747 247.445 87.9905C247.629 87.9968 247.814 88 248 88Z" fill="#252525"/>
<path d="M231 72.5V71.5L238 68V69.5L233 72L231 72.5Z" fill="#252525"/>
<path d="M231 71.5V72.5L238 76V74.5L233 72L231 71.5Z" fill="#252525"/>
<path d="M249 72.5V71.5L242 68V69.5L247 72L249 72.5Z" fill="#252525"/>
<path d="M249 71.5V72.5L242 76V74.5L247 72L249 71.5Z" fill="#252525"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 12 KiB

17
src/img/icon/payment/slide3.svg Normal file
View file

@ -0,0 +1,17 @@
<svg width="320" height="104" viewBox="0 0 320 104" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M190.625 35.5145L232.811 11.5151C232.958 11.8158 233.124 12.1058 233.306 12.3838L191.133 36.3757C190.981 36.0773 190.811 35.7898 190.625 35.5145ZM248.774 33.5952L242.258 15.6769C242.581 15.5822 242.894 15.4678 243.198 15.3351L249.715 33.2574C249.398 33.3624 249.084 33.475 248.774 33.5952ZM236.402 48.2393L191.954 40.857C191.918 41.1922 191.862 41.5213 191.786 41.8428L236.227 49.224C236.277 48.893 236.335 48.5647 236.402 48.2393ZM236.038 53.4948L141.9 62.9085C141.96 63.2319 141.993 63.5643 141.999 63.9036L236.124 54.4911C236.087 54.1614 236.058 53.8292 236.038 53.4948ZM239.588 63.6844L215.69 81.608C215.903 81.864 216.104 82.1309 216.291 82.4076L240.181 64.4899C239.977 64.2265 239.779 63.9579 239.588 63.6844ZM262.445 71.189L269.485 90.5508C269.786 90.4119 270.1 90.2971 270.425 90.2089L263.383 70.8432C263.074 70.966 262.761 71.0814 262.445 71.189ZM275.504 56.6921L304.086 62.8168C304.136 62.4837 304.206 62.1572 304.295 61.8388L275.701 55.7116C275.643 56.0413 275.578 56.3682 275.504 56.6921ZM272.179 40.4912L299.516 19.9881C299.295 19.7393 299.094 19.4719 298.916 19.1886L271.571 39.6976C271.78 39.9568 271.983 40.2215 272.179 40.4912ZM49.5723 13.792C49.8974 13.7039 50.2115 13.5892 50.5121 13.4503L57.6337 33.0346C57.3168 33.1409 57.0035 33.255 56.6939 33.3765L49.5723 13.792ZM80.2946 40.4015C80.1009 40.1299 79.9006 39.8633 79.6939 39.602L103.708 21.5918C103.895 21.8685 104.095 22.1354 104.308 22.3914L80.2946 40.4015ZM121.319 19.6332C121.44 19.3241 121.545 19.0076 121.635 18.6845L176.581 36.9998C176.457 37.307 176.351 37.6237 176.265 37.9485L121.319 19.6332ZM176.005 40.2959C176.017 40.6334 176.05 40.9655 176.103 41.2911L83.9445 50.5069C83.9199 50.1728 83.887 49.8411 83.8461 49.5118L176.005 40.2959ZM198.68 84.3676L141.831 65.418C141.752 65.7455 141.645 66.0626 141.515 66.3667L198.364 85.3163C198.454 84.9932 198.559 84.6766 198.68 84.3676ZM130.192 62.4864C130.109 62.8054 130.052 63.1347 130.022 63.4719L83.6449 55.7691C83.7071 55.443 83.7613 55.114 83.8075 54.7824L130.192 62.4864ZM70.3631 70.9666C70.6799 70.8603 70.9933 70.7463 71.3028 70.6248L77.7389 88.3241C77.4168 88.4188 77.1031 88.5332 76.7992 88.666L70.3631 70.9666ZM72.1375 94.5126C72.0765 94.837 72.0351 95.1682 72.0145 95.5051L21.8718 89.2372C21.9393 88.9151 21.981 88.5836 21.9946 88.2448L72.1375 94.5126ZM21.0824 84.8107C20.9043 84.5274 20.7031 84.2601 20.4815 84.0113L47.7021 63.5959C47.8957 63.8675 48.096 64.1342 48.3026 64.3955L21.0824 84.8107ZM44.5552 47.2985C44.4774 47.6215 44.4074 47.9475 44.3455 48.2763L15.7188 42.1084C15.8057 41.7894 15.8733 41.4625 15.9204 41.1289L44.5552 47.2985Z" fill="#252525"/>
<path d="M54 8C54 11.3137 51.3137 14 48 14C44.6863 14 42 11.3137 42 8C42 4.68629 44.6863 2 48 2C51.3137 2 54 4.68629 54 8Z" fill="#252525"/>
<path d="M122.25 16C122.25 21.5228 117.773 26 112.25 26C106.727 26 102.25 21.5228 102.25 16C102.25 10.4772 106.727 6 112.25 6C117.773 6 122.25 10.4772 122.25 16Z" fill="#252525"/>
<path d="M142 64C142 67.3137 139.314 70 136 70C132.686 70 130 67.3137 130 64C130 60.6863 132.686 58 136 58C139.314 58 142 60.6863 142 64Z" fill="#252525"/>
<path d="M22 88C22 91.3137 19.3137 94 16 94C12.6863 94 10 91.3137 10 88C10 84.6863 12.6863 82 16 82C19.3137 82 22 84.6863 22 88Z" fill="#252525"/>
<path d="M88 96C88 100.418 84.4183 104 80 104C75.5817 104 72 100.418 72 96C72 91.5817 75.5817 88 80 88C84.4183 88 88 91.5817 88 96Z" fill="#252525"/>
<path d="M16 40C16 44.4183 12.4183 48 8 48C3.58172 48 0 44.4183 0 40C0 35.5817 3.58172 32 8 32C12.4183 32 16 35.5817 16 40Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M84 52C84 63.0457 75.0457 72 64 72C52.9543 72 44 63.0457 44 52C44 40.9543 52.9543 32 64 32C75.0457 32 84 40.9543 84 52ZM59 46V44H60V46H59ZM68 44V46H69V44H68ZM71.0644 56H64V57H72.9356L67.4174 48.7444C67.9147 48.9102 68.4469 49 69 49C71.7614 49 74 46.7614 74 44C74 41.2386 71.7614 39 69 39C66.2386 39 64 41.2386 64 44C64 45.2768 64.4786 46.4418 65.2662 47.3255L71.0644 56ZM64 64.5002C61.8524 64.5002 59.7319 63.4234 58.1586 61.8542C56.5851 60.2847 55.5 58.1639 55.5 56H56.5C56.5 57.8362 57.4305 59.7155 58.8648 61.1461C60.2993 62.577 62.1788 63.5002 64 63.5002V64.5002ZM69 48C66.7909 48 65 46.2091 65 44C65 41.7909 66.7909 40 69 40C71.2091 40 73 41.7909 73 44C73 46.2091 71.2091 48 69 48ZM55 44C55 46.2091 56.7909 48 59 48C61.2091 48 63 46.2091 63 44C63 41.7909 61.2091 40 59 40C56.7909 40 55 41.7909 55 44ZM54 44C54 46.7614 56.2386 49 59 49C61.7614 49 64 46.7614 64 44C64 41.2386 61.7614 39 59 39C56.2386 39 54 41.2386 54 44Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M272 91C269.239 91 267 93.2386 267 96C267 98.7614 269.239 101 272 101C274.761 101 277 98.7614 277 96C277 93.2386 274.761 91 272 91ZM272 90C268.686 90 266 92.6863 266 96C266 99.3137 268.686 102 272 102C275.314 102 278 99.3137 278 96C278 92.6863 275.314 90 272 90Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M304 11C301.239 11 299 13.2386 299 16C299 18.7614 301.239 21 304 21C306.761 21 309 18.7614 309 16C309 13.2386 306.761 11 304 11ZM304 10C300.686 10 298 12.6863 298 16C298 19.3137 300.686 22 304 22C307.314 22 310 19.3137 310 16C310 12.6863 307.314 10 304 10Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M207.75 79C202.779 79 198.75 83.0294 198.75 88C198.75 92.9706 202.779 97 207.75 97C212.721 97 216.75 92.9706 216.75 88C216.75 83.0294 212.721 79 207.75 79ZM207.75 78C202.227 78 197.75 82.4772 197.75 88C197.75 93.5228 202.227 98 207.75 98C213.273 98 217.75 93.5228 217.75 88C217.75 82.4772 213.273 78 207.75 78Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M184 33C180.134 33 177 36.134 177 40C177 43.866 180.134 47 184 47C187.866 47 191 43.866 191 40C191 36.134 187.866 33 184 33ZM184 32C179.582 32 176 35.5817 176 40C176 44.4183 179.582 48 184 48C188.418 48 192 44.4183 192 40C192 35.5817 188.418 32 184 32Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M312 57C308.134 57 305 60.134 305 64C305 67.866 308.134 71 312 71C315.866 71 319 67.866 319 64C319 60.134 315.866 57 312 57ZM312 56C307.582 56 304 59.5817 304 64C304 68.4183 307.582 72 312 72C316.418 72 320 68.4183 320 64C320 59.5817 316.418 56 312 56Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M240 1C236.134 1 233 4.13401 233 8C233 11.866 236.134 15 240 15C243.866 15 247 11.866 247 8C247 4.13401 243.866 1 240 1ZM240 0C235.582 0 232 3.58172 232 8C232 12.4183 235.582 16 240 16C244.418 16 248 12.4183 248 8C248 3.58172 244.418 0 240 0Z" fill="#252525"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M256 72C244.954 72 236 63.0457 236 52C236 40.9543 244.954 32 256 32C267.046 32 276 40.9543 276 52C276 63.0457 267.046 72 256 72ZM261 44V42H260V44H261ZM252 44V42H251V44H252ZM256 49C254.709 49 253.562 49.367 252.751 49.9347C251.939 50.5036 251.5 51.2414 251.5 52C251.5 52.7586 251.939 53.4964 252.751 54.0653C253.562 54.633 254.709 55 256 55V56C254.529 56 253.176 55.5835 252.178 54.8845C251.181 54.1866 250.5 53.1744 250.5 52C250.5 50.8256 251.181 49.8134 252.178 49.1155C253.176 48.4165 254.529 48 256 48V49ZM256 63.5C260.142 63.5 263.5 60.1421 263.5 56H264.5C264.5 60.6944 260.694 64.5 256 64.5V63.5Z" fill="#252525"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 7.1 KiB

3
src/img/icon/payment/tick.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 6L5 10L11 1" stroke="#252525" stroke-width="1.5"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 166 B

19
src/img/icon/payment/tier1.svg Normal file
View file

@ -0,0 +1,19 @@
<svg width="120" height="120" viewBox="0 0 120 120" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle opacity="0.4" cx="60" cy="60" r="60" fill="url(#paint0_radial_1048_18469)"/>
<circle opacity="0.6" cx="60" cy="60.3242" r="33" fill="url(#paint1_radial_1048_18469)"/>
<circle opacity="0.8" cx="60" cy="60.3281" r="7.5" fill="url(#paint2_radial_1048_18469)"/>
<defs>
<radialGradient id="paint0_radial_1048_18469" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(60 60) rotate(90) scale(60)">
<stop offset="0.41" stop-color="#24BFD4" stop-opacity="0"/>
<stop offset="1" stop-color="#24BFD4"/>
</radialGradient>
<radialGradient id="paint1_radial_1048_18469" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(60 60.3242) rotate(90) scale(33)">
<stop offset="0.41" stop-color="#24BFD4" stop-opacity="0"/>
<stop offset="1" stop-color="#24BFD4"/>
</radialGradient>
<radialGradient id="paint2_radial_1048_18469" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(60 60.3281) rotate(90) scale(7.5)">
<stop offset="0.285" stop-color="#2AAFC1" stop-opacity="0"/>
<stop offset="1" stop-color="#2AAFC1"/>
</radialGradient>
</defs>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.2 KiB

24
src/img/icon/payment/tier2.svg Normal file
View file

@ -0,0 +1,24 @@
<svg width="120" height="120" viewBox="0 0 120 120" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="33" cy="33" r="33" transform="rotate(-90 33 33)" fill="url(#paint0_radial_1048_18435)"/>
<circle cx="33" cy="87" r="33" transform="rotate(-90 33 87)" fill="url(#paint1_radial_1048_18435)"/>
<circle cx="87" cy="33" r="33" transform="rotate(-90 87 33)" fill="url(#paint2_radial_1048_18435)"/>
<circle cx="87" cy="87" r="33" transform="rotate(-90 87 87)" fill="url(#paint3_radial_1048_18435)"/>
<defs>
<radialGradient id="paint0_radial_1048_18435" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(33 33) rotate(90) scale(33)">
<stop offset="0.41" stop-color="#A5AEFF" stop-opacity="0"/>
<stop offset="1" stop-color="#A5AEFF"/>
</radialGradient>
<radialGradient id="paint1_radial_1048_18435" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(33 87) rotate(90) scale(33)">
<stop offset="0.41" stop-color="#A5AEFF" stop-opacity="0"/>
<stop offset="1" stop-color="#A5AEFF"/>
</radialGradient>
<radialGradient id="paint2_radial_1048_18435" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(87 33) rotate(90) scale(33)">
<stop offset="0.41" stop-color="#A5AEFF" stop-opacity="0"/>
<stop offset="1" stop-color="#A5AEFF"/>
</radialGradient>
<radialGradient id="paint3_radial_1048_18435" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(87 87) rotate(90) scale(33)">
<stop offset="0.41" stop-color="#A5AEFF" stop-opacity="0"/>
<stop offset="1" stop-color="#A5AEFF"/>
</radialGradient>
</defs>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.6 KiB

49
src/img/icon/payment/tier3.svg Normal file
View file

@ -0,0 +1,49 @@
<svg width="120" height="121" viewBox="0 0 120 121" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1048_18449)">
<circle opacity="0.6" cx="60" cy="25.2695" r="25" transform="rotate(-90 60 25.2695)" fill="url(#paint0_radial_1048_18449)"/>
<circle opacity="0.6" cx="60" cy="95.2734" r="25" transform="rotate(-90 60 95.2734)" fill="url(#paint1_radial_1048_18449)"/>
<circle opacity="0.6" cx="25" cy="60.2656" r="25" transform="rotate(-180 25 60.2656)" fill="url(#paint2_radial_1048_18449)"/>
<circle opacity="0.6" cx="95" cy="60.2656" r="25" transform="rotate(-180 95 60.2656)" fill="url(#paint3_radial_1048_18449)"/>
<circle opacity="0.6" cx="35.2539" cy="35.5197" r="25" transform="rotate(-135 35.2539 35.5197)" fill="url(#paint4_radial_1048_18449)"/>
<circle opacity="0.6" cx="84.7539" cy="85.0197" r="25" transform="rotate(-135 84.7539 85.0197)" fill="url(#paint5_radial_1048_18449)"/>
<circle opacity="0.6" cx="35.2501" cy="85.0156" r="25" transform="rotate(135 35.2501 85.0156)" fill="url(#paint6_radial_1048_18449)"/>
<circle opacity="0.6" cx="84.7462" cy="35.5195" r="25" transform="rotate(135 84.7462 35.5195)" fill="url(#paint7_radial_1048_18449)"/>
</g>
<defs>
<radialGradient id="paint0_radial_1048_18449" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(60 25.2695) rotate(90) scale(25)">
<stop offset="0.41" stop-color="#F05F5F" stop-opacity="0"/>
<stop offset="1" stop-color="#F05F5F"/>
</radialGradient>
<radialGradient id="paint1_radial_1048_18449" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(60 95.2734) rotate(90) scale(25)">
<stop offset="0.41" stop-color="#F05F5F" stop-opacity="0"/>
<stop offset="1" stop-color="#F05F5F"/>
</radialGradient>
<radialGradient id="paint2_radial_1048_18449" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(25 60.2656) rotate(90) scale(25)">
<stop offset="0.41" stop-color="#F05F5F" stop-opacity="0"/>
<stop offset="1" stop-color="#F05F5F"/>
</radialGradient>
<radialGradient id="paint3_radial_1048_18449" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(95 60.2656) rotate(90) scale(25)">
<stop offset="0.41" stop-color="#F05F5F" stop-opacity="0"/>
<stop offset="1" stop-color="#F05F5F"/>
</radialGradient>
<radialGradient id="paint4_radial_1048_18449" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(35.2539 35.5197) rotate(90) scale(25)">
<stop offset="0.41" stop-color="#F05F5F" stop-opacity="0"/>
<stop offset="1" stop-color="#F05F5F"/>
</radialGradient>
<radialGradient id="paint5_radial_1048_18449" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(84.7539 85.0197) rotate(90) scale(25)">
<stop offset="0.41" stop-color="#F05F5F" stop-opacity="0"/>
<stop offset="1" stop-color="#F05F5F"/>
</radialGradient>
<radialGradient id="paint6_radial_1048_18449" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(35.2501 85.0156) rotate(90) scale(25)">
<stop offset="0.41" stop-color="#F05F5F" stop-opacity="0"/>
<stop offset="1" stop-color="#F05F5F"/>
</radialGradient>
<radialGradient id="paint7_radial_1048_18449" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(84.7462 35.5195) rotate(90) scale(25)">
<stop offset="0.41" stop-color="#F05F5F" stop-opacity="0"/>
<stop offset="1" stop-color="#F05F5F"/>
</radialGradient>
<clipPath id="clip0_1048_18449">
<rect width="120" height="120" fill="white" transform="translate(0 0.273438)"/>
</clipPath>
</defs>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3.5 KiB

12
src/img/icon/popup/settings/membership.svg Normal file
View file

@ -0,0 +1,12 @@
<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="22" height="22" rx="4" fill="#252525"/>
<path d="M10.9564 17.5673C10.7109 16.16 9.71273 14.3927 7.81455 12.9691C6.88182 12.2655 5.93273 11.8073 5 11.6109V10.9236C6.84909 10.4818 8.66545 9.23818 9.82727 7.55273C10.4164 6.70182 10.7927 5.86727 10.9564 5H11.6436C11.9218 6.65273 13.1982 8.48546 14.9327 9.71273C15.7836 10.3182 16.6673 10.7273 17.5673 10.9236V11.6109C15.7509 11.9873 13.64 13.6073 12.5927 15.26C12.0691 16.0945 11.7582 16.8636 11.6436 17.5673H10.9564Z" fill="white"/>
<path d="M10.9564 17.5673C10.7109 16.16 9.71273 14.3927 7.81455 12.9691C6.88182 12.2655 5.93273 11.8073 5 11.6109V10.9236C6.84909 10.4818 8.66545 9.23818 9.82727 7.55273C10.4164 6.70182 10.7927 5.86727 10.9564 5H11.6436C11.9218 6.65273 13.1982 8.48546 14.9327 9.71273C15.7836 10.3182 16.6673 10.7273 17.5673 10.9236V11.6109C15.7509 11.9873 13.64 13.6073 12.5927 15.26C12.0691 16.0945 11.7582 16.8636 11.6436 17.5673H10.9564Z" fill="url(#paint0_linear_9739_24299)"/>
<defs>
<linearGradient id="paint0_linear_9739_24299" x1="9.50062" y1="-25.5518" x2="-12.0578" y2="4.34144" gradientUnits="userSpaceOnUse">
<stop offset="0.640625" stop-color="#FFEDBE" stop-opacity="0"/>
<stop offset="0.820797" stop-color="#FFEDBE"/>
<stop offset="1" stop-color="#FFBCC3"/>
</linearGradient>
</defs>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.3 KiB

3
src/img/theme/dark/icon/payment/hyperlink.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.5 3.75H13M13 3.75V11.25M13 3.75L3 13.75" stroke="#DCDCDC"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 175 B

30
src/img/theme/dark/icon/payment/slide0.svg Normal file
View file

@ -0,0 +1,30 @@
<svg width="320" height="104" viewBox="0 0 320 104" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M136.763 51.8221C136 53.3194 136 55.2796 136 59.2V60.8C136 64.7204 136 66.6806 136.763 68.1779C137.434 69.4951 138.505 70.5659 139.822 71.237C141.319 72 143.28 72 147.2 72H148.8C152.72 72 154.681 72 156.178 71.237C157.495 70.5659 158.566 69.4951 159.237 68.1779C160 66.6806 160 64.7204 160 60.8V59.2C160 55.2796 160 53.3194 159.237 51.8221C158.566 50.5049 157.495 49.4341 156.178 48.763C154.681 48 152.72 48 148.8 48H147.2C143.28 48 141.319 48 139.822 48.763C138.505 49.4341 137.434 50.5049 136.763 51.8221ZM147.085 65.7914L154.422 54.2675L153.578 53.7305L146.911 64.2027L142.354 59.6436L141.646 60.3505L147.085 65.7914Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M40 84C40 95.0457 31.0457 104 20 104C8.9543 104 0 95.0457 0 84C0 72.9543 8.9543 64 20 64C31.0457 64 40 72.9543 40 84ZM15 76V74H16V76H15ZM24 74V76H25V74H24ZM23.2488 81.9347C22.4378 81.367 21.2907 81 20 81V80C21.4707 80 22.8237 80.4165 23.8223 81.1155C24.8193 81.8134 25.5 82.8256 25.5 84C25.5 85.1744 24.8193 86.1866 23.8223 86.8845C22.8237 87.5835 21.4707 88 20 88V87C21.2907 87 22.4378 86.633 23.2488 86.0653C24.0614 85.4964 24.5 84.7586 24.5 84C24.5 83.2414 24.0614 82.5036 23.2488 81.9347ZM12.5 88C12.5 92.1421 15.8579 95.5 20 95.5V96.5C15.3056 96.5 11.5 92.6944 11.5 88H12.5Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M88 20C88 31.0457 79.0457 40 68 40C56.9543 40 48 31.0457 48 20C48 8.9543 56.9543 0 68 0C79.0457 0 88 8.9543 88 20ZM63 12V10H64V12H63ZM72 10V12H73V10H72ZM72.4891 23.0006C72.3529 19.7571 70.8894 16.1792 67.709 13.9075L68.2902 13.0938C71.9454 15.7046 73.4996 19.8708 73.4996 23.5006V24.0006H67.9996V23.0006H72.4891ZM60.5 24C60.5 28.1421 63.8579 31.5 68 31.5V32.5C63.3056 32.5 59.5 28.6944 59.5 24H60.5Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M148 81H60C53.9249 81 49 85.9249 49 92C49 98.0751 53.9249 103 60 103H148C154.075 103 159 98.0751 159 92C159 85.9249 154.075 81 148 81ZM60 80C53.3726 80 48 85.3726 48 92C48 98.6274 53.3726 104 60 104H148C154.627 104 160 98.6274 160 92C160 85.3726 154.627 80 148 80H60Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M148.375 92.5H60.375V91.5H148.375V92.5Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M228 1H108C101.925 1 97 5.92487 97 12V20C97 26.0751 101.925 31 108 31H228C234.075 31 239 26.0751 239 20V12C239 5.92487 234.075 1 228 1ZM108 0C101.373 0 96 5.37258 96 12V20C96 26.6274 101.373 32 108 32H228C234.627 32 240 26.6274 240 20V12C240 5.37258 234.627 0 228 0H108Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M228 12.5H108V11.5H228V12.5Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M195 20.5H108V19.5H195V20.5Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M116 49H60C53.9249 49 49 53.9249 49 60C49 66.0751 53.9249 71 60 71H116C122.075 71 127 66.0751 127 60C127 53.9249 122.075 49 116 49ZM60 48C53.3726 48 48 53.3726 48 60C48 66.6274 53.3726 72 60 72H116C122.627 72 128 66.6274 128 60C128 53.3726 122.627 48 116 48H60Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M116 60.5H60V59.5H116V60.5Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M260 41H188C181.925 41 177 45.9249 177 52V76C177 82.0751 181.925 87 188 87H260C266.075 87 271 82.0751 271 76V52C271 45.9249 266.075 41 260 41ZM188 40C181.373 40 176 45.3726 176 52V76C176 82.6274 181.373 88 188 88H260C266.627 88 272 82.6274 272 76V52C272 45.3726 266.627 40 260 40H188Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M259 52.5H188V51.5H259V52.5Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M248 60.5H188V59.5H248V60.5Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M259 68.5H188V67.5H259V68.5Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M232 76.5H188V75.5H232V76.5Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M300 96C288.954 96 280 87.0457 280 76C280 64.9543 288.954 56 300 56C311.046 56 320 64.9543 320 76C320 87.0457 311.046 96 300 96ZM305 68V70H304V68H305ZM296 70V68H295V70H296ZM299 68C299 70.2091 297.209 72 295 72C292.791 72 291 70.2091 291 68C291 65.7909 292.791 64 295 64C297.209 64 299 65.7909 299 68ZM296.567 72.7495C296.074 72.9121 295.547 73 295 73C292.239 73 290 70.7614 290 68C290 65.2386 292.239 63 295 63C297.761 63 300 65.2386 300 68C300 69.2774 299.521 70.443 298.733 71.3268L292.883 80H300V81H291.003L296.567 72.7495ZM305 73C302.239 73 300 70.7614 300 68C300 65.2386 302.239 63 305 63C307.761 63 310 65.2386 310 68C310 70.7614 307.761 73 305 73ZM305.841 85.8542C304.268 87.4234 302.148 88.5002 300 88.5002V87.5002C301.821 87.5002 303.701 86.577 305.135 85.1461C306.57 83.7155 307.5 81.8362 307.5 80H308.5C308.5 82.1639 307.415 84.2847 305.841 85.8542ZM305 72C307.209 72 309 70.2091 309 68C309 65.7909 307.209 64 305 64C302.791 64 301 65.7909 301 68C301 70.2091 302.791 72 305 72Z" fill="#DCDCDC"/>
<circle cx="261" cy="17" r="3" fill="#DCDCDC"/>
<circle cx="267" cy="17" r="3" fill="#DCDCDC"/>
<path d="M264 24.9997C260.344 23.2802 258.07 19.8913 258 17H264V24.9997Z" fill="#DCDCDC"/>
<path d="M264 24.9997C267.656 23.2802 269.93 19.8913 270 17H264V24.9997Z" fill="#DCDCDC"/>
<circle cx="247" cy="23" r="3" fill="#DCDCDC"/>
<circle cx="253" cy="23" r="3" fill="#DCDCDC"/>
<path d="M250 30.9997C246.344 29.2802 244.07 25.8913 244 23H250V30.9997Z" fill="#DCDCDC"/>
<path d="M250 30.9997C253.656 29.2802 255.93 25.8913 256 23H250V30.9997Z" fill="#DCDCDC"/>
<circle cx="281" cy="3" r="3" fill="#DCDCDC"/>
<circle cx="275" cy="3" r="3" fill="#DCDCDC"/>
<path d="M278 10.9997C274.344 9.28024 272.07 5.89134 272 3H278V10.9997Z" fill="#DCDCDC"/>
<path d="M278 10.9997C281.656 9.28024 283.93 5.89134 284 3H278V10.9997Z" fill="#DCDCDC"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 5.8 KiB

19
src/img/theme/dark/icon/payment/slide1.svg Normal file
View file

@ -0,0 +1,19 @@
<svg width="320" height="104" viewBox="0 0 320 104" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M75 37C71.134 37 68 40.134 68 44C68 47.866 71.134 51 75 51H93C96.866 51 100 47.866 100 44C100 40.134 96.866 37 93 37H75ZM91 43H90V45H91V43ZM87 43H88V45H87V43ZM94 43H93V45H94V43Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M75 53C71.134 53 68 56.134 68 60C68 63.866 71.134 67 75 67H93C96.866 67 100 63.866 100 60C100 56.134 96.866 53 93 53H75ZM91 59H90V61H91V59ZM87 59H88V61H87V59ZM94 59H93V61H94V59Z" fill="#DCDCDC"/>
<rect width="12" height="12" rx="6" transform="matrix(-1 0 0 1 232 46)" fill="#DCDCDC"/>
<rect width="12" height="12" rx="6" transform="matrix(-1 0 0 1 248 37)" fill="#DCDCDC"/>
<rect width="12" height="12" rx="6" transform="matrix(-1 0 0 1 248 55)" fill="#DCDCDC"/>
<rect x="120.5" y="0.5" width="79" height="103" rx="11.5" stroke="#DCDCDC"/>
<rect x="56.5" y="16.5" width="55" height="71" rx="9.5" stroke="#DCDCDC"/>
<rect x="208.5" y="16.125" width="55" height="71" rx="9.5" stroke="#DCDCDC"/>
<rect x="0.5" y="22.5" width="47" height="59" rx="7.5" stroke="#DCDCDC"/>
<rect x="136" y="69" width="48" height="1" fill="#DCDCDC"/>
<rect x="136" y="77" width="48" height="1" fill="#DCDCDC"/>
<rect x="148" y="85" width="24" height="1" fill="#DCDCDC"/>
<rect x="272.5" y="22.125" width="47" height="59" rx="7.5" stroke="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M308 52C308 58.6274 302.627 64 296 64C289.373 64 284 58.6274 284 52C284 45.3726 289.373 40 296 40C302.627 40 308 45.3726 308 52ZM295.5 51.5V46H296.5V51.5H302V52.5H296.5V58H295.5V52.5H290V51.5H295.5Z" fill="#DCDCDC"/>
<circle cx="24.0625" cy="51.8125" r="11.9375" fill="#DCDCDC"/>
<path d="M32 52L34 66L21 59L32 52Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M160.391 58C149.345 58 140.391 49.0457 140.391 38C140.391 26.9543 149.345 18 160.391 18C171.436 18 180.391 26.9543 180.391 38C180.391 49.0457 171.436 58 160.391 58ZM165.391 30V32H164.391V30H165.391ZM156.391 32V30H155.391V32H156.391ZM159.391 30C159.391 32.2091 157.6 34 155.391 34C153.181 34 151.391 32.2091 151.391 30C151.391 27.7909 153.181 26 155.391 26C157.6 26 159.391 27.7909 159.391 30ZM156.958 34.7495C156.465 34.9121 155.938 35 155.391 35C152.629 35 150.391 32.7614 150.391 30C150.391 27.2386 152.629 25 155.391 25C158.152 25 160.391 27.2386 160.391 30C160.391 31.2774 159.912 32.443 159.123 33.3268L153.274 42H160.391V43H151.393L156.958 34.7495ZM165.391 35C162.629 35 160.391 32.7614 160.391 30C160.391 27.2386 162.629 25 165.391 25C168.152 25 170.391 27.2386 170.391 30C170.391 32.7614 168.152 35 165.391 35ZM166.232 47.8542C164.659 49.4234 162.538 50.5002 160.391 50.5002V49.5002C162.212 49.5002 164.091 48.577 165.526 47.1461C166.96 45.7155 167.891 43.8362 167.891 42H168.891C168.891 44.1639 167.805 46.2847 166.232 47.8542ZM165.391 34C167.6 34 169.391 32.2091 169.391 30C169.391 27.7909 167.6 26 165.391 26C163.181 26 161.391 27.7909 161.391 30C161.391 32.2091 163.181 34 165.391 34Z" fill="#DCDCDC"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3 KiB

30
src/img/theme/dark/icon/payment/slide2.svg Normal file
View file

@ -0,0 +1,30 @@
<svg width="320" height="104" viewBox="0 0 320 104" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M280 76C280 87.0457 288.954 96 300 96C311.046 96 320 87.0457 320 76C320 64.9543 311.046 56 300 56C288.954 56 280 64.9543 280 76ZM305 68V66H304V68H305ZM296 66V68H295V66H296ZM296.751 73.9347C297.562 73.367 298.709 73 300 73V72C298.529 72 297.176 72.4165 296.178 73.1155C295.181 73.8134 294.5 74.8256 294.5 76C294.5 77.1744 295.181 78.1866 296.178 78.8845C297.176 79.5835 298.529 80 300 80V79C298.709 79 297.562 78.633 296.751 78.0653C295.939 77.4964 295.5 76.7586 295.5 76C295.5 75.2414 295.939 74.5036 296.751 73.9347ZM307.5 80C307.5 84.1421 304.142 87.5 300 87.5V88.5C304.694 88.5 308.5 84.6944 308.5 80H307.5Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M204 17H116C109.925 17 105 21.9249 105 28V76C105 82.0751 109.925 87 116 87H204C210.075 87 215 82.0751 215 76V28C215 21.9249 210.075 17 204 17ZM116 16C109.373 16 104 21.3726 104 28V76C104 82.6274 109.373 88 116 88H204C210.627 88 216 82.6274 216 76V28C216 21.3726 210.627 16 204 16H116Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M178 1H142C135.925 1 131 5.92487 131 12V92C131 98.0751 135.925 103 142 103H178C184.075 103 189 98.0751 189 92V12C189 5.92487 184.075 1 178 1ZM142 0C135.373 0 130 5.37259 130 12V92C130 98.6274 135.373 104 142 104H178C184.627 104 190 98.6274 190 92V12C190 5.37258 184.627 0 178 0H142Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M40 52C40 63.0457 31.0457 72 20 72C8.9543 72 0 63.0457 0 52C0 40.9543 8.9543 32 20 32C31.0457 32 40 40.9543 40 52ZM15 46V44H16V46H15ZM24 44V46H25V44H24ZM27.0644 56H20V57H28.9356L23.4174 48.7444C23.9147 48.9102 24.4469 49 25 49C27.7614 49 30 46.7614 30 44C30 41.2386 27.7614 39 25 39C22.2386 39 20 41.2386 20 44C20 45.2768 20.4786 46.4418 21.2662 47.3255L27.0644 56ZM20 64.5002C17.8524 64.5002 15.7319 63.4234 14.1586 61.8542C12.5851 60.2847 11.5 58.1639 11.5 56H12.5C12.5 57.8362 13.4305 59.7155 14.8648 61.1461C16.2993 62.577 18.1788 63.5002 20 63.5002V64.5002ZM25 48C22.7909 48 21 46.2091 21 44C21 41.7909 22.7909 40 25 40C27.2091 40 29 41.7909 29 44C29 46.2091 27.2091 48 25 48ZM11 44C11 46.2091 12.7909 48 15 48C17.2091 48 19 46.2091 19 44C19 41.7909 17.2091 40 15 40C12.7909 40 11 41.7909 11 44ZM10 44C10 46.7614 12.2386 49 15 49C17.7614 49 20 46.7614 20 44C20 41.2386 17.7614 39 15 39C12.2386 39 10 41.2386 10 44Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M151 32C144.925 32 140 36.9249 140 43V61C140 67.0751 144.925 72 151 72H169C175.075 72 180 67.0751 180 61V43C180 36.9249 175.075 32 169 32H151ZM160 63.75C153.649 63.75 148.5 58.6013 148.5 52.25H147.5C147.5 59.1536 153.096 64.75 160 64.75C166.904 64.75 172.5 59.1536 172.5 52.25H171.5C171.5 58.6013 166.351 63.75 160 63.75ZM154.5 46.25V43.25H155.5V46.25H154.5ZM164.5 43.25V46.25H165.5V43.25H164.5Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M280 28C280 39.0457 288.954 48 300 48C311.046 48 320 39.0457 320 28C320 16.9543 311.046 8 300 8C288.954 8 280 16.9543 280 28ZM305 20V18H304V20H305ZM296 18V20H295V18H296ZM295.511 31.0006C295.647 27.7571 297.111 24.1792 300.291 21.9075L299.71 21.0938C296.055 23.7046 294.5 27.8708 294.5 31.5006V32.0006H300V31.0006H295.511ZM307.5 32C307.5 36.1421 304.142 39.5 300 39.5V40.5C304.694 40.5 308.5 36.6944 308.5 32H307.5Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M256 39C264.284 39 271 32.2843 271 24C271 15.7157 264.284 9 256 9C255.302 9 254.615 9.04767 253.943 9.13993C253.314 8.88824 252.665 8.6753 252 8.50407C253.278 8.17501 254.619 8 256 8C264.837 8 272 15.1634 272 24C272 32.8366 264.837 40 256 40C254.619 40 253.278 39.825 252 39.4959C252.665 39.3247 253.314 39.1118 253.943 38.8601C254.615 38.9523 255.302 39 256 39Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M256 40C264.837 40 272 32.8366 272 24C272 15.1634 264.837 8 256 8C255.346 8 254.702 8.03921 254.068 8.1154C253.364 8.20018 252.673 8.33076 252 8.50407C252.665 8.67528 253.314 8.88818 253.942 9.13984C253.942 9.13987 253.943 9.1399 253.943 9.13993C254.459 9.06909 254.984 9.02453 255.516 9.00766C255.677 9.00257 255.838 9 256 9C264.284 9 271 15.7157 271 24C271 32.2843 264.284 39 256 39C255.795 39 255.591 38.9959 255.388 38.9877C254.9 38.9682 254.418 38.9252 253.943 38.8601C253.943 38.8601 253.942 38.8601 253.942 38.8602C253.314 39.1118 252.665 39.3247 252 39.4959C252.673 39.6692 253.364 39.7998 254.068 39.8846C254.522 39.9391 254.981 39.9747 255.445 39.9905C255.629 39.9968 255.814 40 256 40Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M248 39C256.284 39 263 32.2843 263 24C263 15.7157 256.284 9 248 9C247.302 9 246.615 9.04767 245.943 9.13993C245.314 8.88824 244.665 8.6753 244 8.50407C245.278 8.17501 246.619 8 248 8C256.837 8 264 15.1634 264 24C264 32.8366 256.837 40 248 40C246.619 40 245.278 39.825 244 39.4959C244.665 39.3247 245.314 39.1118 245.943 38.8601C246.615 38.9523 247.302 39 248 39Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M248 40C256.837 40 264 32.8366 264 24C264 15.1634 256.837 8 248 8C247.346 8 246.702 8.03921 246.068 8.1154C245.364 8.20018 244.673 8.33076 244 8.50407C244.665 8.67528 245.314 8.88818 245.942 9.13984C245.942 9.13987 245.943 9.1399 245.943 9.13993C246.459 9.06909 246.984 9.02453 247.516 9.00766C247.677 9.00257 247.838 9 248 9C256.284 9 263 15.7157 263 24C263 32.2843 256.284 39 248 39C247.795 39 247.591 38.9959 247.388 38.9877C246.9 38.9682 246.418 38.9252 245.943 38.8601C245.943 38.8601 245.942 38.8601 245.942 38.8602C245.314 39.1118 244.665 39.3247 244 39.4959C244.673 39.6692 245.364 39.7998 246.068 39.8846C246.522 39.9391 246.981 39.9747 247.445 39.9905C247.629 39.9968 247.814 40 248 40Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M225 24C225 32.2843 231.716 39 240 39C248.284 39 255 32.2843 255 24C255 15.7157 248.284 9 240 9C231.716 9 225 15.7157 225 24ZM240 8C231.163 8 224 15.1634 224 24C224 32.8366 231.163 40 240 40C248.837 40 256 32.8366 256 24C256 15.1634 248.837 8 240 8Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M233.023 22.4052C233.304 25.5642 235.91 29.1453 240 31C244.09 29.1453 246.696 25.5642 246.977 22.4052C246.992 22.2723 247 22.137 247 22C247 20.067 245.433 18.5 243.5 18.5C241.567 18.5 240 20.067 240 22C240 20.067 238.433 18.5 236.5 18.5C234.567 18.5 233 20.067 233 22C233 22.137 233.008 22.2723 233.023 22.4052Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M64 63C55.7157 63 49 56.2843 49 48C49 39.7157 55.7157 33 64 33C64.698 33 65.3848 33.0477 66.0574 33.1399C66.6862 32.8882 67.3347 32.6753 68 32.5041C66.7215 32.175 65.3812 32 64 32C55.1634 32 48 39.1634 48 48C48 56.8366 55.1634 64 64 64C65.3812 64 66.7215 63.825 68 63.4959C67.3347 63.3247 66.6862 63.1118 66.0574 62.8601C65.3848 62.9523 64.698 63 64 63Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M64 64C55.1634 64 48 56.8366 48 48C48 39.1634 55.1634 32 64 32C64.6537 32 65.2983 32.0392 65.9315 32.1154C66.6361 32.2002 67.3266 32.3308 68 32.5041C67.3348 32.6753 66.6864 32.8882 66.0576 33.1398C66.0575 33.1399 66.0575 33.1399 66.0574 33.1399C65.5409 33.0691 65.0161 33.0245 64.4843 33.0077C64.3235 33.0026 64.1621 33 64 33C55.7157 33 49 39.7157 49 48C49 56.2843 55.7157 63 64 63C64.2051 63 64.4092 62.9959 64.6123 62.9877C65.1004 62.9682 65.5824 62.9252 66.0574 62.8601C66.0575 62.8601 66.0575 62.8601 66.0576 62.8602C66.6864 63.1118 67.3348 63.3247 68 63.4959C67.3266 63.6692 66.6361 63.7998 65.9315 63.8846C65.4784 63.9391 65.0195 63.9747 64.5555 63.9905C64.3711 63.9968 64.1859 64 64 64Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M72 63C63.7157 63 57 56.2843 57 48C57 39.7157 63.7157 33 72 33C72.698 33 73.3848 33.0477 74.0574 33.1399C74.6862 32.8882 75.3347 32.6753 76 32.5041C74.7215 32.175 73.3812 32 72 32C63.1634 32 56 39.1634 56 48C56 56.8366 63.1634 64 72 64C73.3812 64 74.7215 63.825 76 63.4959C75.3347 63.3247 74.6862 63.1118 74.0574 62.8601C73.3848 62.9523 72.698 63 72 63Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M72 64C63.1634 64 56 56.8366 56 48C56 39.1634 63.1634 32 72 32C72.6537 32 73.2983 32.0392 73.9315 32.1154C74.6361 32.2002 75.3266 32.3308 76 32.5041C75.3348 32.6753 74.6864 32.8882 74.0576 33.1398C74.0575 33.1399 74.0575 33.1399 74.0574 33.1399C73.5409 33.0691 73.0161 33.0245 72.4843 33.0077C72.3235 33.0026 72.1621 33 72 33C63.7157 33 57 39.7157 57 48C57 56.2843 63.7157 63 72 63C72.2051 63 72.4092 62.9959 72.6123 62.9877C73.1004 62.9682 73.5824 62.9252 74.0574 62.8601C74.0575 62.8601 74.0575 62.8601 74.0576 62.8602C74.6864 63.1118 75.3348 63.3247 76 63.4959C75.3266 63.6692 74.6361 63.7998 73.9315 63.8846C73.4784 63.9391 73.0195 63.9747 72.5555 63.9905C72.3711 63.9968 72.1859 64 72 64Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M65 48C65 56.2843 71.7157 63 80 63C88.2843 63 95 56.2843 95 48C95 39.7157 88.2843 33 80 33C71.7157 33 65 39.7157 65 48ZM80 32C71.1634 32 64 39.1634 64 48C64 56.8366 71.1634 64 80 64C88.8366 64 96 56.8366 96 48C96 39.1634 88.8366 32 80 32Z" fill="#DCDCDC"/>
<path d="M77 44.9906V52.9641C77 53.5146 77.4448 53.9615 77.9952 53.9641L84.897 53.997C85.3675 53.9992 85.7759 53.6732 85.878 53.2139L87.4327 46.2178C87.5715 45.5932 87.0963 45.0008 86.4565 45.0008H82C82 45.0008 83 43.5637 83 42.0012C83 40.4012 82.5508 39.6906 81.9922 39.2595C81.4336 38.8284 80.2812 39.006 80.2812 40.0281C80.2734 42.0321 78.9375 43.6414 77 44.9906Z" fill="#DCDCDC"/>
<path d="M72 45H76V53C76 53.5523 75.5523 54 75 54H73C72.4477 54 72 53.5523 72 53V45Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M225 72C225 80.2843 231.716 87 240 87C248.284 87 255 80.2843 255 72C255 63.7157 248.284 57 240 57C231.716 57 225 63.7157 225 72ZM240 56C231.163 56 224 63.1634 224 72C224 80.8366 231.163 88 240 88C248.837 88 256 80.8366 256 72C256 63.1634 248.837 56 240 56Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M256 87C264.284 87 271 80.2843 271 72C271 63.7157 264.284 57 256 57C255.302 57 254.615 57.0477 253.943 57.1399C253.314 56.8882 252.665 56.6753 252 56.5041C253.278 56.175 254.619 56 256 56C264.837 56 272 63.1634 272 72C272 80.8366 264.837 88 256 88C254.619 88 253.278 87.825 252 87.4959C252.665 87.3247 253.314 87.1118 253.943 86.8601C254.615 86.9523 255.302 87 256 87Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M256 88C264.837 88 272 80.8366 272 72C272 63.1634 264.837 56 256 56C255.346 56 254.702 56.0392 254.068 56.1154C253.364 56.2002 252.673 56.3308 252 56.5041C252.665 56.6753 253.314 56.8882 253.942 57.1398C253.942 57.1399 253.943 57.1399 253.943 57.1399C254.459 57.0691 254.984 57.0245 255.516 57.0077C255.677 57.0026 255.838 57 256 57C264.284 57 271 63.7157 271 72C271 80.2843 264.284 87 256 87C255.795 87 255.591 86.9959 255.388 86.9877C254.9 86.9682 254.418 86.9252 253.943 86.8601C253.943 86.8601 253.942 86.8601 253.942 86.8602C253.314 87.1118 252.665 87.3247 252 87.4959C252.673 87.6692 253.364 87.7998 254.068 87.8846C254.522 87.9391 254.981 87.9747 255.445 87.9905C255.629 87.9968 255.814 88 256 88Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M248 87C256.284 87 263 80.2843 263 72C263 63.7157 256.284 57 248 57C247.302 57 246.615 57.0477 245.943 57.1399C245.314 56.8882 244.665 56.6753 244 56.5041C245.278 56.175 246.619 56 248 56C256.837 56 264 63.1634 264 72C264 80.8366 256.837 88 248 88C246.619 88 245.278 87.825 244 87.4959C244.665 87.3247 245.314 87.1118 245.943 86.8601C246.615 86.9523 247.302 87 248 87Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M248 88C256.837 88 264 80.8366 264 72C264 63.1634 256.837 56 248 56C247.346 56 246.702 56.0392 246.068 56.1154C245.364 56.2002 244.673 56.3308 244 56.5041C244.665 56.6753 245.314 56.8882 245.942 57.1398C245.942 57.1399 245.943 57.1399 245.943 57.1399C246.459 57.0691 246.984 57.0245 247.516 57.0077C247.677 57.0026 247.838 57 248 57C256.284 57 263 63.7157 263 72C263 80.2843 256.284 87 248 87C247.795 87 247.591 86.9959 247.388 86.9877C246.9 86.9682 246.418 86.9252 245.943 86.8601C245.943 86.8601 245.942 86.8601 245.942 86.8602C245.314 87.1118 244.665 87.3247 244 87.4959C244.673 87.6692 245.364 87.7998 246.068 87.8846C246.522 87.9391 246.981 87.9747 247.445 87.9905C247.629 87.9968 247.814 88 248 88Z" fill="#DCDCDC"/>
<path d="M231 72.5V71.5L238 68V69.5L233 72L231 72.5Z" fill="#DCDCDC"/>
<path d="M231 71.5V72.5L238 76V74.5L233 72L231 71.5Z" fill="#DCDCDC"/>
<path d="M249 72.5V71.5L242 68V69.5L247 72L249 72.5Z" fill="#DCDCDC"/>
<path d="M249 71.5V72.5L242 76V74.5L247 72L249 71.5Z" fill="#DCDCDC"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 12 KiB

17
src/img/theme/dark/icon/payment/slide3.svg Normal file
View file

@ -0,0 +1,17 @@
<svg width="320" height="104" viewBox="0 0 320 104" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M190.625 35.5145L232.811 11.5151C232.958 11.8158 233.124 12.1058 233.306 12.3838L191.133 36.3757C190.981 36.0773 190.811 35.7898 190.625 35.5145ZM248.774 33.5952L242.258 15.6769C242.581 15.5822 242.894 15.4678 243.198 15.3351L249.715 33.2574C249.398 33.3624 249.084 33.475 248.774 33.5952ZM236.402 48.2393L191.954 40.857C191.918 41.1922 191.862 41.5213 191.786 41.8428L236.227 49.224C236.277 48.893 236.335 48.5647 236.402 48.2393ZM236.038 53.4948L141.9 62.9085C141.96 63.2319 141.993 63.5643 141.999 63.9036L236.124 54.4911C236.087 54.1614 236.058 53.8292 236.038 53.4948ZM239.588 63.6844L215.69 81.608C215.903 81.864 216.104 82.1309 216.291 82.4076L240.181 64.4899C239.977 64.2265 239.779 63.9579 239.588 63.6844ZM262.445 71.189L269.485 90.5508C269.786 90.4119 270.1 90.2971 270.425 90.2089L263.383 70.8432C263.074 70.966 262.761 71.0814 262.445 71.189ZM275.504 56.6921L304.086 62.8168C304.136 62.4837 304.206 62.1572 304.295 61.8388L275.701 55.7116C275.643 56.0413 275.578 56.3682 275.504 56.6921ZM272.179 40.4912L299.516 19.9881C299.295 19.7393 299.094 19.4719 298.916 19.1886L271.571 39.6976C271.78 39.9568 271.983 40.2215 272.179 40.4912ZM49.5723 13.792C49.8974 13.7039 50.2115 13.5892 50.5121 13.4503L57.6337 33.0346C57.3168 33.1409 57.0035 33.255 56.6939 33.3765L49.5723 13.792ZM80.2946 40.4015C80.1009 40.1299 79.9006 39.8633 79.6939 39.602L103.708 21.5918C103.895 21.8685 104.095 22.1354 104.308 22.3914L80.2946 40.4015ZM121.319 19.6332C121.44 19.3241 121.545 19.0076 121.635 18.6845L176.581 36.9998C176.457 37.307 176.351 37.6237 176.265 37.9485L121.319 19.6332ZM176.005 40.2959C176.017 40.6334 176.05 40.9655 176.103 41.2911L83.9445 50.5069C83.9199 50.1728 83.887 49.8411 83.8461 49.5118L176.005 40.2959ZM198.68 84.3676L141.831 65.418C141.752 65.7455 141.645 66.0626 141.515 66.3667L198.364 85.3163C198.454 84.9932 198.559 84.6766 198.68 84.3676ZM130.192 62.4864C130.109 62.8054 130.052 63.1347 130.022 63.4719L83.6449 55.7691C83.7071 55.443 83.7613 55.114 83.8075 54.7824L130.192 62.4864ZM70.3631 70.9666C70.6799 70.8603 70.9933 70.7463 71.3028 70.6248L77.7389 88.3241C77.4168 88.4188 77.1031 88.5332 76.7992 88.666L70.3631 70.9666ZM72.1375 94.5126C72.0765 94.837 72.0351 95.1682 72.0145 95.5051L21.8718 89.2372C21.9393 88.9151 21.981 88.5836 21.9946 88.2448L72.1375 94.5126ZM21.0824 84.8107C20.9043 84.5274 20.7031 84.2601 20.4815 84.0113L47.7021 63.5959C47.8957 63.8675 48.096 64.1342 48.3026 64.3955L21.0824 84.8107ZM44.5552 47.2985C44.4774 47.6215 44.4074 47.9475 44.3455 48.2763L15.7188 42.1084C15.8057 41.7894 15.8733 41.4625 15.9204 41.1289L44.5552 47.2985Z" fill="#DCDCDC"/>
<path d="M54 8C54 11.3137 51.3137 14 48 14C44.6863 14 42 11.3137 42 8C42 4.68629 44.6863 2 48 2C51.3137 2 54 4.68629 54 8Z" fill="#DCDCDC"/>
<path d="M122.25 16C122.25 21.5228 117.773 26 112.25 26C106.727 26 102.25 21.5228 102.25 16C102.25 10.4772 106.727 6 112.25 6C117.773 6 122.25 10.4772 122.25 16Z" fill="#DCDCDC"/>
<path d="M142 64C142 67.3137 139.314 70 136 70C132.686 70 130 67.3137 130 64C130 60.6863 132.686 58 136 58C139.314 58 142 60.6863 142 64Z" fill="#DCDCDC"/>
<path d="M22 88C22 91.3137 19.3137 94 16 94C12.6863 94 10 91.3137 10 88C10 84.6863 12.6863 82 16 82C19.3137 82 22 84.6863 22 88Z" fill="#DCDCDC"/>
<path d="M88 96C88 100.418 84.4183 104 80 104C75.5817 104 72 100.418 72 96C72 91.5817 75.5817 88 80 88C84.4183 88 88 91.5817 88 96Z" fill="#DCDCDC"/>
<path d="M16 40C16 44.4183 12.4183 48 8 48C3.58172 48 0 44.4183 0 40C0 35.5817 3.58172 32 8 32C12.4183 32 16 35.5817 16 40Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M84 52C84 63.0457 75.0457 72 64 72C52.9543 72 44 63.0457 44 52C44 40.9543 52.9543 32 64 32C75.0457 32 84 40.9543 84 52ZM59 46V44H60V46H59ZM68 44V46H69V44H68ZM71.0644 56H64V57H72.9356L67.4174 48.7444C67.9147 48.9102 68.4469 49 69 49C71.7614 49 74 46.7614 74 44C74 41.2386 71.7614 39 69 39C66.2386 39 64 41.2386 64 44C64 45.2768 64.4786 46.4418 65.2662 47.3255L71.0644 56ZM64 64.5002C61.8524 64.5002 59.7319 63.4234 58.1586 61.8542C56.5851 60.2847 55.5 58.1639 55.5 56H56.5C56.5 57.8362 57.4305 59.7155 58.8648 61.1461C60.2993 62.577 62.1788 63.5002 64 63.5002V64.5002ZM69 48C66.7909 48 65 46.2091 65 44C65 41.7909 66.7909 40 69 40C71.2091 40 73 41.7909 73 44C73 46.2091 71.2091 48 69 48ZM55 44C55 46.2091 56.7909 48 59 48C61.2091 48 63 46.2091 63 44C63 41.7909 61.2091 40 59 40C56.7909 40 55 41.7909 55 44ZM54 44C54 46.7614 56.2386 49 59 49C61.7614 49 64 46.7614 64 44C64 41.2386 61.7614 39 59 39C56.2386 39 54 41.2386 54 44Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M272 91C269.239 91 267 93.2386 267 96C267 98.7614 269.239 101 272 101C274.761 101 277 98.7614 277 96C277 93.2386 274.761 91 272 91ZM272 90C268.686 90 266 92.6863 266 96C266 99.3137 268.686 102 272 102C275.314 102 278 99.3137 278 96C278 92.6863 275.314 90 272 90Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M304 11C301.239 11 299 13.2386 299 16C299 18.7614 301.239 21 304 21C306.761 21 309 18.7614 309 16C309 13.2386 306.761 11 304 11ZM304 10C300.686 10 298 12.6863 298 16C298 19.3137 300.686 22 304 22C307.314 22 310 19.3137 310 16C310 12.6863 307.314 10 304 10Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M207.75 79C202.779 79 198.75 83.0294 198.75 88C198.75 92.9706 202.779 97 207.75 97C212.721 97 216.75 92.9706 216.75 88C216.75 83.0294 212.721 79 207.75 79ZM207.75 78C202.227 78 197.75 82.4772 197.75 88C197.75 93.5228 202.227 98 207.75 98C213.273 98 217.75 93.5228 217.75 88C217.75 82.4772 213.273 78 207.75 78Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M184 33C180.134 33 177 36.134 177 40C177 43.866 180.134 47 184 47C187.866 47 191 43.866 191 40C191 36.134 187.866 33 184 33ZM184 32C179.582 32 176 35.5817 176 40C176 44.4183 179.582 48 184 48C188.418 48 192 44.4183 192 40C192 35.5817 188.418 32 184 32Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M312 57C308.134 57 305 60.134 305 64C305 67.866 308.134 71 312 71C315.866 71 319 67.866 319 64C319 60.134 315.866 57 312 57ZM312 56C307.582 56 304 59.5817 304 64C304 68.4183 307.582 72 312 72C316.418 72 320 68.4183 320 64C320 59.5817 316.418 56 312 56Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M240 1C236.134 1 233 4.13401 233 8C233 11.866 236.134 15 240 15C243.866 15 247 11.866 247 8C247 4.13401 243.866 1 240 1ZM240 0C235.582 0 232 3.58172 232 8C232 12.4183 235.582 16 240 16C244.418 16 248 12.4183 248 8C248 3.58172 244.418 0 240 0Z" fill="#DCDCDC"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M256 72C244.954 72 236 63.0457 236 52C236 40.9543 244.954 32 256 32C267.046 32 276 40.9543 276 52C276 63.0457 267.046 72 256 72ZM261 44V42H260V44H261ZM252 44V42H251V44H252ZM256 49C254.709 49 253.562 49.367 252.751 49.9347C251.939 50.5036 251.5 51.2414 251.5 52C251.5 52.7586 251.939 53.4964 252.751 54.0653C253.562 54.633 254.709 55 256 55V56C254.529 56 253.176 55.5835 252.178 54.8845C251.181 54.1866 250.5 53.1744 250.5 52C250.5 50.8256 251.181 49.8134 252.178 49.1155C253.176 48.4165 254.529 48 256 48V49ZM256 63.5C260.142 63.5 263.5 60.1421 263.5 56H264.5C264.5 60.6944 260.694 64.5 256 64.5V63.5Z" fill="#DCDCDC"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 7.1 KiB

3
src/img/theme/dark/icon/payment/tick.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="12" height="11" viewBox="0 0 12 11" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 5.46717L5 8.95653L11 1.10547" stroke="#DCDCDC" stroke-width="1.5"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 183 B

4
src/json/constant.json
View file

@ -5,6 +5,7 @@
"amplitude": "1ba981d1a9afb8af8c81847ef3383a20",
"protocol": "anytype",
"appName": "Anytype",
"anyNameSpace": ".any",
"networkId": {
"production": "N83gJpVd9MuNRZAuJLZ7LiMntTThhPc6DtzWWVjb1M3PouVU",
@ -266,7 +267,8 @@
"participantRelationKeys": [
"identity",
"participantPermissions",
"participantStatus"
"participantStatus",
"globalName"
],
"pageCoverRelationKey": "pageCover",

110
src/json/text.json
View file

@ -125,6 +125,9 @@
"commonLanguage": "Language",
"commonSpelling": "Spelling",
"commonGallery": "Gallery",
"commonEmail": "E-mail",
"commonContinue": "Continue",
"commonJoin": "Join",
"commonLeaveSpace": "Leave space",
"commonYou": "you",
"commonApprove": "Approve",
@ -406,6 +409,9 @@
"pageMainInviteErrorData": "Incorrect invite data",
"pageMainInviteErrorDuplicate": "You are joining or have already joined the %s space",
"pageMainMembershipTitle": "Retrieving membership",
"pageMainMembershipError": "Something went wrong",
"pageAuthLoginInvalidPhrase": "Invalid Recovery Phrase",
"pageAuthDeletedAccountDeletionTitle": "This account is planned for deletion in %s",
@ -764,7 +770,10 @@
"popupSettingsSpaceShareTitle": "Sharing",
"popupSettingsSpaceShareInviteLinkTitle": "Invite link",
"popupSettingsSpaceShareInviteLinkLabel": "Share this link to invite others to your Space. Once they request to join, you can set their access rights.",
"popupSettingsSpaceShareInvitesLimit": "You can add up to %s %s and up to %s %s",
"popupSettingsSpaceShareInvitesReaderLimitReachedLabel": "You can't add more members",
"popupSettingsSpaceShareInvitesReaderLimitReachedButton": "✦ Upgrade to add more members",
"popupSettingsSpaceShareInvitesWriterLimitReachedLabel": "You can't add more editors",
"popupSettingsSpaceShareInvitesWriterLimitReachedButton": "✦ Upgrade to add more editors",
"popupSettingsSpaceShareMembersTitle": "Members",
"popupSettingsSpaceShareJoinRequest": "Join Request",
@ -811,6 +820,99 @@
"popupSettingsSpaceRemoveText": "Members could no longer see any objects inside",
"popupSettingsSpaceRemoveButton": "Move to Bin",
"popupSettingsMembershipTitle1": "Membership",
"popupSettingsMembershipTitle2": "Let’s build together",
"popupSettingsMembershipText": "Joining Anytype network means contributing to its story",
"popupSettingsMembershipSlide0Title": "Co-create with us",
"popupSettingsMembershipSlide0Text": "Stay closely connected with our team and community. Join calls with the team, influence Anytype's evolution, and have your say on features.",
"popupSettingsMembershipSlide1Title": "Gain Benefits",
"popupSettingsMembershipSlide1Text": "Our members have unique identity on Anytype Network, more storage, shared spaces and members per space for extensive collaboration",
"popupSettingsMembershipSlide2Title": "Support the Vision",
"popupSettingsMembershipSlide2Text": "Your contribution supports our independent team and endorses <a href=\"%s\">our vision</a>︎ of a user-driven, secure, and collaborative digital environment.",
"popupSettingsMembershipSlide3Title": "Invest in Connectivity",
"popupSettingsMembershipSlide3Text": "Our software is free by design, but we thrive on the network that connects us all. Support us, and you're investing in the very infrastructure that keeps us united",
"popupSettingsMembershipTier1Title": "Explorer",
"popupSettingsMembershipTier1Text": "Dive into the network and enjoy the thrill of one-on-one collaboration",
"popupSettingsMembershipTier2Title": "Builder",
"popupSettingsMembershipTier2Text": "Unlock the magic of multi-party collaboration and enjoy top-notch support\n\n",
"popupSettingsMembershipTier3Title": "Co-creator",
"popupSettingsMembershipTier3Text": "Support our adventure and unlock exclusive access and perks",
"popupSettingsMembershipJustEmail": "Just e-mail",
"popupSettingsMembershipPerYear": "per year",
"popupSettingsMembershipPerYears": "per %s years",
"popupSettingsMembershipLearnMore": "Learn more",
"popupSettingsMembershipCurrent": "Current",
"popupSettingsMembershipManage": "Manage",
"popupSettingsMembershipValidUntil": "Valid until %s",
"popupSettingsMembershipForeverFree": "Forever free",
"popupSettingsMembershipLevelsDetails": "Membership levels details",
"popupSettingsMembershipPrivacyPolicy": "Privacy policy",
"popupSettingsMembershipTermsAndConditions": "Terms and conditions",
"popupSettingsMembershipSpecial": "Would you like to use Anytype for business, education, etc.? <a href=\"%s\">Please let us know here</a>︎.",
"popupMembershipFreeTitleStep1": "Get your free membership with just your email!",
"popupMembershipFreeTitleStep2": "Enter the code sent to your email",
"popupMembershipFreeText": "We need your email to keep spam at bay and the fun in play!",
"popupMembershipFreeCheckboxText": "I'd like to get updates on products and enjoy free perks!",
"popupMembershipPaidTitle": "Pick your unique name",
"popupMembershipPaidText": "This name acts like a personal domain, making it easier for others to find you",
"popupMembershipPaidPlaceholder": "Myself",
"popupMembershipPayByCard": "Pay by Card",
"popupMembershipPayByCrypto": "Pay by Crypto",
"popupMembershipResend": "Resend",
"popupMembershipCountdown": " in %s sec",
"popupMembershipStatusWaitASecond": "Wait a second...",
"popupMembershipStatusNameAvailable": "This name is available!",
"popupMembershipStatusNameNotAvailable": "Oops! This name is already taken!",
"popupMembershipCurrentStatus": "Current status",
"popupMembershipValidUntil": "Valid until",
"popupMembershipForever": "Forever",
"popupMembershipChangeEmail": "Change e-mail",
"popupMembershipManagePayment": "Manage payment",
"popupMembershipWriteToAnyteam": "Write to Anyteam",
"popupMembershipPaidBy": "Paid by %s",
"popupMembershipPaymentMethod0": "Card",
"popupMembershipPaymentMethod1": "Crypto",
"popupMembershipPaymentMethod2": "ApplePay",
"popupMembershipPaymentMethod3": "GooglePay",
"popupMembershipWhatsIncluded": "What’s included",
"popupMembershipTier1Content1": "1 GB of network space",
"popupMembershipTier1Content2": "10 one-to-one spaces",
"popupMembershipTier1Content3": "Up to 10 shared spaces in read-only mode",
"popupMembershipTier2Content1": "Unique name (from 7 characters)",
"popupMembershipTier2Content2": "128 GB of network space",
"popupMembershipTier2Content3": "10 guest collaborator seats",
"popupMembershipTier2Content4": "Priority support ",
"popupMembershipTier3Content1": "Unique name (from 5 characters)",
"popupMembershipTier3Content2": "256 GB of network space",
"popupMembershipTier3Content3": "25 Guest collaborator seats",
"popupMembershipTier3Content4": "Chat with the team",
"popupMembershipTier3Content5": "Unique collectible ",
"popupMembershipSuccessTitle": "Welcome to the network, %s",
"popupMembershipSuccessTextCuriosity": "Big cheers for your curiosity!",
"popupMembershipSuccessTextSupport": "Big cheers for your support!",
"popupMembershipCode1": "Unknown error occurred",
"popupMembershipCode2": "No .any provided",
"popupMembershipCode3": "Name is too short",
"popupMembershipCode4": "Name is too long",
"popupMembershipCode5": "Name has invalid characters",
"popupMembershipCode6": "This tier does not support name",
"popupSettingsOnboardingModeTitle": "Network",
"popupSettingsOnboardingNetworkTitle": "Self-hosted Configuration",
"popupSettingsOnboardingStoragePath": "Account Data Location",
@ -882,8 +984,10 @@
"popupInviteInviteConfirmCancel": "Manage spaces",
"popupInviteConfirmTitle": "%s requested to join %s",
"popupInviteConfirmButtonConfirmReader": "Grant read access",
"popupInviteConfirmButtonConfirmEditor": "Grant edit access",
"popupInviteConfirmButtonReader": "Grant read access",
"popupInviteConfirmButtonReaderLimit": "✦ Add more readers",
"popupInviteConfirmButtonEditor": "Grant edit access",
"popupInviteConfirmButtonEditorLimit": "✦ Add more editors",
"popupInviteConfirmButtonReject": "Reject",
"popupInviteQrTitle": "QR code for joing a Space",

5
src/json/url.json
View file

@ -12,9 +12,12 @@
"download": "https://download.anytype.io/?utm_campaign=add_device&utm_source=app&utm_medium=qr",
"terms": "https://anytype.io/terms_of_use/",
"privacy": "https://anytype.io/app_privacy/",
"vision": "https://anytype.io/why",
"pricing": "https://anytype.io/pricing",
"contact": "mailto:support@anytype.io?subject=Support%20request%2C%20account%20%25accountId%25&body=%0A%0ATechnical%20information%0A----------------------------------------------%0AOS%20version%3A%20%25os%25%0AApp%20version%3A%20%25version%25%0ABuild%20number%3A%20%25build%25%0ALibrary%20version%3A%20%25middleware%25%0AAccount%20ID%3A%20%25accountId%25%0AAnalytics%20ID%3A%20%25analyticsId%25%0ADevice%20ID%3A%20%25deviceId%25",
"extendStorage": "mailto:storage@anytype.io?subject=Get%20more%20storage%2C%20account%20%25accountId%25&body=Hi%2C%20Anytype%20team.%20I%20am%20reaching%20out%20to%20request%20an%20increase%20in%20my%20file%20storage%20capacity%20as%20I%20have%20run%20out%20of%20storage.%20My%20current%20limit%20is%20%25storageLimit%25.%20My%20account%20id%20is%20%25accountId%25.%20Cheers%2C%20%25spaceName%25",
"gallery": "https://gallery.any.coop",
"cdn": "https://anytype-static.fra1.cdn.digitaloceanspaces.com",
"webclipper": "https://chromewebstore.google.com/detail/anytype-web-clipper/jbnammhjiplhpjfncnlejjjejghimdkf?hl=en"
"webclipper": "https://chromewebstore.google.com/detail/anytype-web-clipper/jbnammhjiplhpjfncnlejjjejghimdkf?hl=en",
"membershipSpecial": "mailto:support@anytype.io?subject=Special%20Pricing%20Request%20AnytypeId%20%25accountId%25&body=Please%20specify%20your%20request%3A%0A-%20highlight%20if%20you%20represent%20an%20educational%2C%20governmental%2C%20or%20non-profit%20organization%0A-%20tell%20us%20more%20about%20your%20organization%3A%20number%20of%20employees%20and%20future%20Anytype%20users%2C%20markets%20you%27re%20working%20on%2C%20etc.%2C%0A-%20provide%20additional%20details%20about%20how%20your%20organization%20uses%20Anytype"
}

1
src/scss/component/icon.scss
View file

@ -52,6 +52,7 @@
.icon.settings-import { background-image: url('~img/icon/popup/settings/import.svg'); }
.icon.settings-export { background-image: url('~img/icon/popup/settings/export.svg'); }
.icon.settings-logout { background-image: url('~img/icon/popup/settings/logout.svg'); }
.icon.settings-membership { background-image: url('~img/icon/popup/settings/membership.svg'); }
.icon.import-notion { background-image: url('~img/icon/import/notion.svg'); }
.icon.import-markdown { background-image: url('~img/icon/import/markdown.svg'); }

7
src/scss/font.scss
View file

@ -46,4 +46,9 @@
@font-face {
font-family: 'Inter'; font-style: italic; font-weight: 700;
src: url('~font/inter/bolditalic.woff2') format('woff2');
}
}
@font-face {
font-family: 'RiccioneExtraLight'; font-style: normal; font-weight: 400;
src: url('~font/riccione/extralight.otf') format('opentype');
}

4
src/scss/form/button.scss
View file

@ -53,4 +53,6 @@ input.button { line-height: 1; }
}
.button.simple { height: auto; padding: 0px; color: var(--color-control-active); font-weight: bold; line-height: 1.43; letter-spacing: 0.1px; }
.button.simple:hover, .button.simple.hover { color: var(--color-text-primary); }
.button.simple:hover, .button.simple.hover { color: var(--color-text-primary); }
.button.payment { height: 22px; border-radius: 11px; @include text-small; }

3
src/scss/page/common.scss
View file

@ -15,4 +15,5 @@
@import "./main/block.scss";
@import "./main/empty.scss";
@import "./main/import.scss";
@import "./main/invite.scss";
@import "./main/invite.scss";
@import "./main/membership.scss";

10
src/scss/page/main/membership.scss Normal file
View file

@ -0,0 +1,10 @@
@import "~scss/_vars";
.pageMainMembership { user-select: none; }
.pageMainMembership {
.wrapper { width: 704px; margin: 0px auto; }
.wrapper {
.frame { position: absolute; text-align: center; }
.title { @include text-header3; }
}
}

3
src/scss/popup/common.scss
View file

@ -47,4 +47,5 @@ html.platformWindows {
@import "./objectManager.scss";
@import "./usecase.scss";
@import "./about.scss";
@import "./invite.scss";
@import "./membership.scss";
@import "./invite.scss";

120
src/scss/popup/membership.scss Normal file
View file

@ -0,0 +1,120 @@
@import "~scss/_vars";
.popups {
.popup.popupMembership {
.sides { display: flex; flex-wrap: nowrap; width: 706px; height: 480px; }
.sides {
.side { width: 50%; flex-shrink: 0; }
.side.left { padding: 32px; }
.side.left {
.icon { width: 80px; height: 80px; margin-bottom: 14px; background-size: 80px 80px; }
.icon.tier1 { background-image: url('~img/icon/payment/tier1.svg'); }
.icon.tier2 { background-image: url('~img/icon/payment/tier2.svg'); }
.icon.tier3 { background-image: url('~img/icon/payment/tier3.svg'); }
.title { @include text-header2; margin-bottom: 8px; }
.label { margin-bottom: 20px; }
.contentList {
.label { color: var(--color-text-secondary); margin-bottom: 8px; }
ul { list-style-type: none; }
li { position: relative; margin-bottom: 8px; padding-left: 20px; }
li::before { position: absolute; content: ''; background-image: url('~img/icon/payment/tick.svg'); left: 0; top: 5px; width: 12px; height: 11px; }
}
}
.side.right { padding: 28px 32px; }
.side.right {
.back {
color: var(--color-text-secondary); display: inline-flex; gap: 0px 6px; align-items: center; padding: 2px 8px 2px 6px;
border-radius: 6px; margin-left: -6px; margin-bottom: 16px;
}
.back:hover { background: var(--color-shape-highlight-medium); }
.back {
.icon { width: 8px; height: 8px; background-image: url('~img/icon/popup/settings/back.svg'); }
}
.title { @include text-paragraph; margin-bottom: 8px; }
.label { margin-bottom: 14px; }
.inputWrapper { display: flex; padding: 0px 12px; align-items: center; height: 36px; margin-bottom: 6px; border-radius: 7px; border: 1px solid var(--color-shape-secondary); }
.inputWrapper {
.input { @include text-common; border: 0; height: 36px; padding: 6px 0px; }
.ns { flex-shrink: 0; width: 27px; }
}
.check { display: flex; gap: 8px; margin-bottom: 16px; @include text-small; }
.check {
.icon { width: 18px; height: 18px; }
}
.statusBar { @include text-small; min-height: 18px; margin: 0px 0px 4px; color: var(--color-text-secondary); }
.statusBar.error { color: var(--color-red); }
.statusBar.ok { color: var(--color-green); }
.priceWrapper { margin-bottom: 14px; }
.priceWrapper {
.price { @include text-header2; display: inline-block; padding-right: 6px; }
}
.button { width: 100%; margin-bottom: 10px; }
.pin { margin: 26px 0px 6px; }
.pin {
.input { @include text-header1; width: 48px; height: 64px; border-radius: 7px; border-color: var(--color-shape-secondary); }
}
.resend { font-weight: 500; color: var(--color-text-secondary); }
.resend.countdown { color: var(--color-text-primary); }
.resend:not(.countdown):hover { color: var(--color-control-active); }
.currentMembership { text-align: center; }
.currentMembership {
.title { @include text-paragraph; font-weight: 700; margin-bottom: 14px; }
.valid { display: flex; flex-direction: column; justify-content: space-between; height: 152px; padding: 43px 0 10px; margin-bottom: 20px; border-radius: 8px; background: var(--color-shape-highlight-light-solid); }
.valid {
.label { @include text-small; margin-bottom: 1px; }
.label.date { @include text-header2; }
.label.paymentMethod { color: var(--color-text-secondary); }
}
}
}
}
.sides.success { width: 424px; height: 384px; }
.sides.success {
.side.left { display: none; }
.side.right { width: 100%; text-align: center; align-items: center; display: flex; flex-direction: column; gap: 26px 0px; padding: 30px 32px 32px; }
.side.right {
.title { @include text-header1; margin-bottom: 0; }
.label { @include text-paragraph; margin-bottom: 0; }
.icon { width: 120px; height: 120px; }
.icon.tier1 { background-image: url('~img/icon/payment/tier1.svg'); }
.icon.tier2 { background-image: url('~img/icon/payment/tier2.svg'); }
.icon.tier3 { background-image: url('~img/icon/payment/tier3.svg'); }
.button { margin-bottom: 0; }
}
}
.sides.tier1 {
.side.left { background: linear-gradient(180deg, #d7fbff 0%, #f6f6f6 23.05%); }
.side.left {
> .icon { background-image: url('~img/icon/payment/tier1.svg'); }
}
.side.right {
.inputWrapper { margin-bottom: 20px; }
}
}
.sides.tier2 {
.side.left { background: linear-gradient(180deg, #eceeff 0%, #f6f6f6 23.05%); }
.side.left {
.icon { background-image: url('~img/icon/payment/tier2.svg'); }
}
}
.sides.tier3 {
.side.left { background: linear-gradient(180deg, #ffebeb 0%, #f6f6f6 23.05%); }
.side.left {
.icon { background-image: url('~img/icon/payment/tier3.svg'); }
}
}
}
}

82
src/scss/popup/settings.scss
View file

@ -45,11 +45,14 @@
.items { display: flex; flex-direction: column; }
.item { display: flex; align-items: center; flex-direction: row; gap: 0px 10px; padding: 4px 8px; border-radius: 8px; transition: $transitionAllCommon; }
.item { display: flex; position: relative; align-items: center; flex-direction: row; gap: 0px 10px; padding: 4px 8px; border-radius: 8px; transition: $transitionAllCommon; }
.item:hover, .item.active { background: var(--color-shape-highlight-medium); }
.item {
.icon { width: 24px; height: 24px; flex-shrink: 0; }
.icon.logout { width: 22px; height: 22px; background-image: url('~img/icon/popup/settings/logout.svg'); }
.caption { position: absolute; right: 8px; top: 5px; color: var(--color-text-secondary); }
.caption.join { font-weight: 500; padding: 2px 8px; border-radius: 4px; @include text-small; background: var(--color-control-accent); color: var(--color-bg-primary); }
}
.item.itemAccount { padding: 8px; gap: 0px 14px; align-items: center; }
@ -708,6 +711,83 @@
.actionItems { margin: 32px 0px 24px 0px; }
}
.side.right.tabMembership { display: flex; flex-direction: column; padding: 48px 32px !important; }
.side.right.tabMembership {
.membershipTitle { font-family: 'RiccioneExtraLight', 'Inter'; text-align: center; font-size: 48px; line-height: 48px; font-weight: 300; letter-spacing: -0.518px; margin-bottom: 0px; }
.description { text-align: center; }
.swiper { margin-bottom: 8px; margin-left: -31px; width: calc(100% + 62px); }
.swiper {
.swiper-wrapper { margin-bottom: 10px; }
.swiper-slide { width: calc(100% - 62px); }
}
.slide { display: flex; flex-direction: column; justify-content: space-between; align-items: center; text-align: center; padding: 32px 0px 24px; width: 100%; height: 288px; border-radius: 12px; flex-shrink: 0; }
.slide {
.title { @include text-header3; margin-bottom: 4px; }
.label { width: 360px; }
.label {
a { font-weight: 600; }
}
.illustration { width: 320px; height: 104px; }
.illustration.slide0 { background: url('~img/icon/payment/slide0.svg'); }
.illustration.slide1 { background: url('~img/icon/payment/slide1.svg'); }
.illustration.slide2 { background: url('~img/icon/payment/slide2.svg'); }
.illustration.slide3 { background: url('~img/icon/payment/slide3.svg'); }
}
.slide.slide0 { background: linear-gradient(180deg, #cff5ce 0%, #f6f6f6 50%); }
.slide.slide1 { background: linear-gradient(180deg, #fef2c6 0%, #f6f6f6 50%); }
.slide.slide2 { background: linear-gradient(180deg, #ffebeb 0%, #f6f6f6 50%); }
.slide.slide3 { background: linear-gradient(180deg, #ebedfe 0%, #f6f6f6 50%); }
.swiper-pagination { display: flex; height: 8px; flex-wrap: nowrap; gap: 0px 10px; justify-content: center; }
.swiper-pagination {
.swiper-pagination-bullet { width: 6px; height: 6px; border-radius: 50%; background-color: var(--color-control-inactive); }
.swiper-pagination-bullet:hover { background-color: var(--color-control-active); }
.swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: var(--color-control-accent) !important; box-shadow: 0 0 0 1px var(--color-control-accent); }
}
.tiers { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 16px; padding-top: 18px; margin-bottom: 48px; }
.tiers {
.tier { position: relative; display: flex; flex-direction: column; justify-content: space-between; height: 296px; flex-shrink: 0; text-align: left; border-radius: 16px; padding: 16px 16px 20px; }
.tier {
.currentLabel { position: absolute; top: 16px; right: 16px; border: 1px solid var(--color-control-accent); border-radius: 10px; @include text-small; font-weight: 500; height: 20px; padding: 0px 8px; }
.icon { width: 64px; height: 64px; background-size: 64px 64px; margin-bottom: 10px; }
.icon.tier1 { background-image: url('~img/icon/payment/tier1.svg'); }
.icon.tier2 { background-image: url('~img/icon/payment/tier2.svg'); width: 60px; height: 60px; margin: 2px 0px 12px; background-size: 60px 60px; }
.icon.tier3 { background-image: url('~img/icon/payment/tier3.svg'); }
.title { @include text-paragraph; margin-bottom: 4px; }
.label { @include text-small; }
.priceWrapper { margin-bottom: 10px; @include text-small; }
.priceWrapper {
.price { @include text-paragraph; font-weight: 600; display: inline-block; padding-right: 4px; }
}
.button { width: 100%; }
}
.tier.tier1 { background: linear-gradient(180deg, #d7faff 0%, #f3f3f3 25.64%); }
.tier.tier2 { background: linear-gradient(180deg, #eaecfe 0%, #f3f3f3 25.64%); }
.tier.tier3 { background: linear-gradient(180deg, #ffebeb 0%, #f3f3f3 25.64%); }
.tier.current {
.priceWrapper {
.price { display: none; }
}
};
}
.actionItems { margin-bottom: 28px; }
.actionItems {
.icon { width: 16px; height: 16px; background: url('~img/icon/payment/hyperlink.svg'); }
}
.special {}
}
}
.popupSettings.isSpace {

13
src/scss/theme/dark/common.scss
View file

@ -136,8 +136,8 @@ html.themeDark {
/* Button */
.button.black { background: var(--color-control-accent); color: var(--color-text-inversion); }
.button.black:hover,
.button.black.hover { background: var(--color-control-active); }
.button.black:not(.disabled):hover,
.button.black:not(.disabled).hover { background: var(--color-control-active); }
.button.black {
.arrow { background-image: url('~img/arrow/button/black.svg'); }
}
@ -148,10 +148,11 @@ html.themeDark {
.button.red,
.button.red.blank { background: none; }
.button.red:hover,
.button.red.hover,
.button.red.blank:hover,
.button.red.blank.hover { border-color: #581f0c; background: #311107; }
.button.red:not(.disabled):hover,
.button.red:not(.disabled).hover,
.button.red.blank:not(.disabled):hover,
.button.red.blank:not(.disabled).hover { border-color: #581f0c; background: #311107; }
.filter {
.icon.clear { background-image: url('#{$themePath}/icon/clear0.svg') !important; }

29
src/scss/theme/dark/popup.scss
View file

@ -89,6 +89,22 @@
.side.right.tabExportIndex {
.item:hover { border-color: var(--color-shape-primary); }
}
.side.right.tabMembership {
.slide { background: var(--color-shape-tertiary) !important; }
.slide {
.illustration.slide0 { background-image: url('#{$themePath}/icon/payment/slide0.svg'); }
.illustration.slide1 { background-image: url('#{$themePath}/icon/payment/slide1.svg'); }
.illustration.slide2 { background-image: url('#{$themePath}/icon/payment/slide2.svg'); }
.illustration.slide3 { background-image: url('#{$themePath}/icon/payment/slide3.svg'); }
}
.tiers {
.tier { background: var(--color-shape-tertiary) !important; }
}
.actionItems {
.icon { background-image: url('#{$themePath}/icon/payment/hyperlink.svg'); }
}
}
}
/* PopupHelp */
@ -159,4 +175,17 @@
.iconWrapper { background: none; }
.icon { background-image: url('#{$themePath}/icon/popup/space/invite.svg'); }
}
/* PopupMembership */
.popup.popupMembership {
.sides {
.side.left { background: var(--color-shape-tertiary) !important; }
.side.left {
.contentList {
li::before { background-image: url('#{$themePath}/icon/payment/tick.svg'); }
}
}
}
}
}

3
src/ts/app.tsx
View file

@ -12,7 +12,7 @@ import { Page, SelectionProvider, DragProvider, Progress, Toast, Preview as Prev
import { commonStore, authStore, blockStore, detailStore, dbStore, menuStore, popupStore, notificationStore } from 'Store';
import {
I, C, UtilCommon, UtilRouter, UtilFile, UtilData, UtilObject, UtilMenu, keyboard, Storage, analytics, dispatcher, translate, Renderer,
focus, Preview, Mark, Animation, Onboarding, Survey, UtilDate, UtilSmile, Encode, Decode,
focus, Preview, Mark, Animation, Onboarding, Survey, UtilDate, UtilSmile, Encode, Decode, UtilSpace,
} from 'Lib';
require('pdfjs-dist/build/pdf.worker.entry.js');
@ -101,6 +101,7 @@ if (!UtilCommon.getElectron().isPackaged) {
UtilRouter,
UtilSmile,
UtilDate,
UtilSpace,
analytics,
dispatcher,
keyboard,

6
src/ts/component/block/dataview.tsx
View file

@ -692,7 +692,7 @@ const BlockDataview = observer(class BlockDataview extends React.Component<Props
};
};
onRecordAdd (e: any, dir: number, groupId?: string) {
onRecordAdd (e: any, dir: number, groupId?: string, menuParam?: any) {
if (e.persist) {
e.persist();
};
@ -701,7 +701,7 @@ const BlockDataview = observer(class BlockDataview extends React.Component<Props
const type = dbStore.getTypeById(typeId);
if (type && (type.uniqueKey == Constant.typeKey.bookmark)) {
this.onBookmarkMenu(e, dir, groupId);
this.onBookmarkMenu(e, dir, groupId, menuParam);
} else {
this.recordCreate(e, { id: this.getDefaultTemplateId() }, dir, groupId);
};
@ -1138,7 +1138,7 @@ const BlockDataview = observer(class BlockDataview extends React.Component<Props
if (this.isAllowedObject()) {
emptyProps.description = translate('blockDataviewEmptyViewDescription');
emptyProps.button = translate('blockDataviewEmptyViewButton');
emptyProps.onClick = e => this.onRecordAdd(e, 1);
emptyProps.onClick = e => this.onRecordAdd(e, 1, '', { horizontal: I.MenuDirection.Center });
};
break;
};

35
src/ts/component/form/button.tsx
View file

@ -26,6 +26,8 @@ class Button extends React.Component<I.ButtonComponent, State> {
this.onMouseEnter = this.onMouseEnter.bind(this);
this.onMouseLeave = this.onMouseLeave.bind(this);
this.onClick = this.onClick.bind(this);
this.onMouseDown = this.onMouseDown.bind(this);
};
render () {
@ -47,8 +49,8 @@ class Button extends React.Component<I.ButtonComponent, State> {
ref={node => this.node = node}
id={id}
className={cn.join(' ')}
onClick={onClick}
onMouseDown={onMouseDown}
onClick={this.onClick}
onMouseDown={this.onMouseDown}
onMouseEnter={this.onMouseEnter}
onMouseLeave={this.onMouseLeave}
{...UtilCommon.dataProps(dataset)}
@ -98,6 +100,32 @@ class Button extends React.Component<I.ButtonComponent, State> {
Preview.tooltipHide(false);
};
onClick (e: any) {
const { onClick } = this.props;
const node = $(this.node);
if (node.hasClass('disabled')) {
return;
};
if (onClick) {
onClick(e);
};
};
onMouseDown (e: any) {
const { onMouseDown } = this.props;
const node = $(this.node);
if (node.hasClass('disabled')) {
return;
};
if (onMouseDown) {
onMouseDown(e);
};
};
setLoading (v: boolean) {
this.setState({ isLoading: v });
};
@ -106,7 +134,6 @@ class Button extends React.Component<I.ButtonComponent, State> {
const node = $(this.node);
v ? node.addClass('disabled') : node.removeClass('disabled');
};
};
export default Button;
export default Button;

7
src/ts/component/form/checkbox.tsx
View file

@ -84,7 +84,10 @@ class Checkbox extends React.Component<Props, State> {
getValue () {
return this.state.value;
};
toggle () {
this.setValue(!this.getValue());
};
};
export default Checkbox;
export default Checkbox;

30
src/ts/component/form/pin.tsx
View file

@ -15,6 +15,8 @@ interface Props {
onSuccess?: (value: string) => void;
/** callback when the pin is entered (and does not match expectedPin if provided)*/
onError?: () => void;
/** if true, input will not turn to type password after filled*/
isVisible?: boolean;
};
type State = {
@ -34,6 +36,7 @@ class Pin extends React.Component<Props, State> {
pinLength: Constant.pinLength,
expectedPin: null,
focusOnMount: true,
isVisible: false,
};
state = {
@ -47,7 +50,6 @@ class Pin extends React.Component<Props, State> {
render () {
const { pinLength } = this.props;
const { index } = this.state;
return (
<div className="pin" onClick={this.onClick}>
@ -56,6 +58,7 @@ class Pin extends React.Component<Props, State> {
ref={ref => this.inputRefs[i] = ref}
maxLength={1}
key={i}
onPaste={e => this.onPaste(e, i)}
onFocus={() => this.onInputFocus(i)}
onKeyUp={this.onInputKeyUp}
onKeyDown={e => this.onInputKeyDown(e, i)}
@ -154,6 +157,7 @@ class Pin extends React.Component<Props, State> {
};
onInputChange = (index: number, value: string) => {
const { isVisible } = this.props;
const input = this.inputRefs[index];
const next = this.inputRefs[index + 1];
@ -166,9 +170,31 @@ class Pin extends React.Component<Props, State> {
next.focus();
};
if (isVisible) {
return;
};
this.timeout = window.setTimeout(() => input.setType('password'), TIMEOUT_DURATION);
};
onPaste (e, index: number) {
e.preventDefault();
const { pinLength } = this.props;
const data = e.clipboardData;
const value = String(data.getData('text/plain') || '').split('');
for (let i = index; i < pinLength; i++) {
const input = this.inputRefs[i];
const char = value[i - index] || '';
input.setValue(char);
};
this.inputRefs[pinLength - 1].focus();
this.check();
};
};
export default Pin;
export default Pin;

5
src/ts/component/page/auth/login.tsx
View file

@ -138,7 +138,10 @@ const PageAuthLogin = observer(class PageAuthLogin extends React.Component<I.Pag
commonStore.configSet(message.account.config, false);
UtilData.onInfo(message.account.info);
Animation.from(() => UtilData.onAuth());
Animation.from(() => {
UtilData.onAuth();
UtilData.onAuthOnce();
});
analytics.event('SelectAccount', { middleTime: message.middleTime });
});
};

2
src/ts/component/page/auth/setup.tsx
View file

@ -142,7 +142,6 @@ const PageAuthSetup = observer(class PageAuthSetup extends React.Component<I.Pag
} else {
UtilRouter.go('/auth/select', { replace: true });
};
});
});
};
@ -168,6 +167,7 @@ const PageAuthSetup = observer(class PageAuthSetup extends React.Component<I.Pag
UtilData.onAuth({ routeParam: { animate } });
};
UtilData.onAuthOnce();
analytics.event('SelectAccount', { middleTime: message.middleTime });
});
};

5
src/ts/component/page/index.tsx
View file

@ -30,6 +30,7 @@ import PageMainArchive from './main/archive';
import PageMainBlock from './main/block';
import PageMainImport from './main/import';
import PageMainInvite from './main/invite';
import PageMainMembership from './main/membership';
import PageMainObject from './main/object';
const Components = {
@ -58,7 +59,7 @@ const Components = {
'main/block': PageMainBlock,
'main/import': PageMainImport,
'main/invite': PageMainInvite,
'main/membership': PageMainMembership,
'main/object': PageMainObject,
};
@ -396,4 +397,4 @@ const Page = observer(class Page extends React.Component<I.PageComponent> {
});
export default Page;
export default Page;

4
src/ts/component/page/main/invite.tsx
View file

@ -7,7 +7,7 @@ interface State {
error: string;
};
class PageMainImport extends React.Component<I.PageComponent, State> {
class PageMainInvite extends React.Component<I.PageComponent, State> {
state = {
error: '',
@ -97,4 +97,4 @@ class PageMainImport extends React.Component<I.PageComponent, State> {
};
export default PageMainImport;
export default PageMainInvite;

84
src/ts/component/page/main/membership.tsx Normal file
View file

@ -0,0 +1,84 @@
import * as React from 'react';
import { Loader, Frame, Title, Error, Button } from 'Component';
import { I, UtilCommon, UtilSpace, UtilData, translate, keyboard } from 'Lib';
import { popupStore } from 'Store';
interface State {
error: string;
};
class PageMainMembership extends React.Component<I.PageComponent, State> {
state = {
error: '',
};
node = null;
render () {
const { error } = this.state;
return (
<div
ref={ref => this.node = ref}
className="wrapper"
>
<Frame>
<Title text={translate('pageMainMembershipTitle')} />
<Loader />
<Error text={error} />
{error ? (
<div className="buttons">
<Button text={translate('commonBack')} className="c28" onClick={() => keyboard.onBack()} />
</div>
) : ''}
</Frame>
</div>
);
};
componentDidMount (): void {
UtilData.getMembershipData(true, (membership) => {
if (membership.tier == I.MembershipTier.None) {
this.setState({ error: translate('pageMainMembershipError') });
return;
};
UtilSpace.openDashboard('route');
popupStore.closeAll(null, () => {
popupStore.open('membership', {
onClose: () => {
window.setTimeout(() => {
popupStore.open('settings', { data: { page: 'membership' } });
}, popupStore.getTimeout());
},
data: {
tier: membership.tier,
success: true,
},
});
});
});
this.resize();
};
resize () {
const { isPopup } = this.props;
const win = $(window);
const obj = UtilCommon.getPageContainer(isPopup);
const node = $(this.node);
const wrapper = obj.find('.wrapper');
const oh = obj.height();
const header = node.find('#header');
const hh = header.height();
const wh = isPopup ? oh - hh : win.height();
wrapper.css({ height: wh, paddingTop: isPopup ? 0 : hh });
};
};
export default PageMainMembership;

2
src/ts/component/popup/index.tsx
View file

@ -25,6 +25,7 @@ import PopupAbout from './about';
import PopupInviteRequest from './invite/request';
import PopupInviteConfirm from './invite/confirm';
import PopupInviteQr from './invite/qr';
import PopupMembership from './membership';
class Popup extends React.Component<I.Popup> {
@ -66,6 +67,7 @@ class Popup extends React.Component<I.Popup> {
inviteRequest: PopupInviteRequest,
inviteConfirm: PopupInviteConfirm,
inviteQr: PopupInviteQr,
membership: PopupMembership,
};
const popupId = this.getId();

79
src/ts/component/popup/invite/confirm.tsx
View file

@ -1,7 +1,8 @@
import * as React from 'react';
import { Title, Button, Error, IconObject } from 'Component';
import { I, C, translate, UtilCommon, UtilSpace } from 'Lib';
import { observer } from 'mobx-react';
import { Title, Button, Error, IconObject } from 'Component';
import { I, C, translate, UtilCommon, UtilSpace, UtilData } from 'Lib';
import { authStore } from 'Store';
interface State {
error: string;
@ -13,6 +14,8 @@ const PopupInviteConfirm = observer(class PopupInviteConfirm extends React.Compo
error: '',
};
participants = [];
constructor (props: I.Popup) {
super(props);
@ -24,7 +27,9 @@ const PopupInviteConfirm = observer(class PopupInviteConfirm extends React.Compo
const { error } = this.state;
const { param } = this.props;
const { data } = param;
const { icon, spaceId } = data;
const { icon } = data;
const { membership } = authStore;
const spaceId = this.getSpaceId();
const space = UtilSpace.getSpaceviewBySpaceId(spaceId);
const name = UtilCommon.shorten(String(data.name || translate('defaultNamePage')), 32);
@ -32,6 +37,17 @@ const PopupInviteConfirm = observer(class PopupInviteConfirm extends React.Compo
return null;
};
let readerButton = translate('popupInviteConfirmButtonReader');
let writerButton = translate('popupInviteConfirmButtonEditor');
if (!this.getWriterLimit()) {
writerButton = translate('popupInviteConfirmButtonEditorLimit');
} else
if (!this.getReaderLimit() && (membership.tier == I.MembershipTier.Explorer)) {
readerButton = translate('popupInviteConfirmButtonReaderLimit');
writerButton = translate('popupInviteConfirmButtonEditorLimit');
};
return (
<React.Fragment>
<div className="iconWrapper">
@ -42,8 +58,8 @@ const PopupInviteConfirm = observer(class PopupInviteConfirm extends React.Compo
<div className="buttons">
<div className="sides">
<Button onClick={() => this.onConfirm(I.ParticipantPermissions.Reader)} text={translate('popupInviteConfirmButtonConfirmReader')} className="c36" />
<Button onClick={() => this.onConfirm(I.ParticipantPermissions.Writer)} text={translate('popupInviteConfirmButtonConfirmEditor')} className="c36" />
<Button onClick={() => this.onConfirm(I.ParticipantPermissions.Reader)} text={readerButton} className="c36" />
<Button onClick={() => this.onConfirm(I.ParticipantPermissions.Writer)} text={writerButton} className="c36" />
</div>
<Button onClick={this.onReject} text={translate('popupInviteConfirmButtonReject')} className="c36" color="red" />
@ -54,10 +70,15 @@ const PopupInviteConfirm = observer(class PopupInviteConfirm extends React.Compo
);
};
componentDidMount(): void {
this.load();
};
onConfirm (permissions: I.ParticipantPermissions) {
const { param, close } = this.props;
const { data } = param;
const { spaceId, identity } = data;
const { identity } = data;
const spaceId = this.getSpaceId();
if (!spaceId || !identity) {
return;
@ -92,6 +113,52 @@ const PopupInviteConfirm = observer(class PopupInviteConfirm extends React.Compo
});
};
load () {
const { param } = this.props;
const { data } = param;
const { spaceId } = data;
UtilData.search({
keys: UtilData.participantRelationKeys(),
filters: [
{ operator: I.FilterOperator.And, relationKey: 'layout', condition: I.FilterCondition.Equal, value: I.ObjectLayout.Participant },
{ operator: I.FilterOperator.And, relationKey: 'spaceId', condition: I.FilterCondition.Equal, value: spaceId },
],
ignoreWorkspace: true,
ignoreDeleted: true,
noDeps: true,
}, (message: any) => {
this.participants = message.records || [];
this.forceUpdate();
});
};
getSpaceId () {
return this.props.param.data.spaceId;
};
getReaderLimit () {
const space = UtilSpace.getSpaceviewBySpaceId(this.getSpaceId());
if (!space) {
return 0;
};
const participants = this.participants.filter(it => [ I.ParticipantStatus.Active ].includes(it.status));
return space.readersLimit - participants.length;
};
getWriterLimit () {
const space = UtilSpace.getSpaceviewBySpaceId(this.getSpaceId());
if (!space) {
return 0;
};
const participants = this.participants.filter(it =>
[ I.ParticipantStatus.Active ].includes(it.status) &&
[ I.ParticipantPermissions.Writer, I.ParticipantPermissions.Owner ].includes(it.permissions));
return space.writersLimit - participants.length;
};
});
export default PopupInviteConfirm;

2
src/ts/component/popup/invite/qr.tsx
View file

@ -42,7 +42,7 @@ class PopupInviteQr extends React.Component<I.Popup> {
const canvas = node.find('canvas').get(0);
const image = canvas.toDataURL('image/png');
Renderer.send('download', image, { filename: 'Invite QR code.png' });
Renderer.send('download', image, { saveAs: true });
};
};

115
src/ts/component/popup/membership.tsx Normal file
View file

@ -0,0 +1,115 @@
import * as React from 'react';
import { observer } from 'mobx-react';
import { Title, Icon, Label } from 'Component';
import { I, translate, UtilData } from 'Lib';
import { authStore } from 'Store';
import PageFree from './page/membership/free';
import PagePaid from './page/membership/paid';
import PageCurrent from './page/membership/current';
import PageSuccess from './page/membership/success';
interface State {
isEditing: boolean;
};
const PopupMembership = observer(class PopupMembership extends React.Component<I.Popup, State> {
state = {
isEditing: false,
};
constructor (props: I.Popup) {
super(props);
this.onChangeEmail = this.onChangeEmail.bind(this);
};
render () {
const { membership } = authStore;
const { isEditing } = this.state;
const { param } = this.props;
const { data } = param;
const { tier, success } = data;
const tierContent = this.getTierContent(tier);
const tierItem = UtilData.getMembershipTier(tier);
const suffix = tierItem.idx;
const cn = [ 'sides', `tier${suffix}` ];
let content: any = null;
if (success) {
cn.push('success');
content = <PageSuccess {...this.props} />;
} else
if (!isEditing && (membership.tier == tier)) {
content = <PageCurrent {...this.props} onChangeEmail={this.onChangeEmail} />;
} else
if (tier == I.MembershipTier.Explorer) {
content = <PageFree {...this.props} />;
} else {
content = <PagePaid {...this.props} />;
};
return (
<div className={cn.join(' ')}>
<div className="side left">
<Icon />
<Title text={translate(`popupSettingsMembershipTier${suffix}Title`)} />
<Label text={translate(`popupSettingsMembershipTier${suffix}Text`)} />
<div className="contentList">
<Label text={translate('popupMembershipWhatsIncluded')} />
<ul>
{tierContent.map((text, idx) => (
<li key={idx}>{translate(text)}</li>
))}
</ul>
</div>
</div>
<div className="side right">{content}</div>
</div>
);
};
getTierContent (tier: I.MembershipTier): string[] {
switch (tier) {
case I.MembershipTier.Explorer: {
return [
'popupMembershipTier1Content1',
'popupMembershipTier1Content2',
'popupMembershipTier1Content3',
];
};
case I.MembershipTier.BuilderTest:
case I.MembershipTier.Builder: {
return [
'popupMembershipTier2Content1',
'popupMembershipTier2Content2',
'popupMembershipTier2Content3',
'popupMembershipTier2Content4',
];
};
case I.MembershipTier.CoCreatorTest:
case I.MembershipTier.CoCreator: {
return [
'popupMembershipTier3Content1',
'popupMembershipTier3Content2',
'popupMembershipTier3Content3',
'popupMembershipTier3Content4',
'popupMembershipTier3Content5',
];
};
};
};
onChangeEmail () {
this.setState({ isEditing: true });
};
});
export default PopupMembership;

80
src/ts/component/popup/page/membership/current.tsx Normal file
View file

@ -0,0 +1,80 @@
import * as React from 'react';
import { observer } from 'mobx-react';
import { Title, Label, Button } from 'Component';
import { I, C, translate, UtilCommon, UtilDate } from 'Lib';
import { authStore } from 'Store';
interface Props {
onChangeEmail: () => void;
};
const PopupMembershipPageCurrent = observer(class PopupMembershipPageCurrent extends React.Component<Props> {
constructor (props: Props) {
super(props);
this.onButton = this.onButton.bind(this);
};
render() {
const { membership } = authStore;
const { tier, dateEnds, paymentMethod } = membership;
let dateText: string = '';
let paidText: string = '';
let buttonText: string = '';
if (tier == I.MembershipTier.Explorer) {
dateText = translate('popupMembershipForever');
buttonText = translate('popupMembershipChangeEmail');
} else {
dateText = `${UtilDate.date('d F Y', dateEnds)}`;
paidText = UtilCommon.sprintf(translate('popupMembershipPaidBy'), translate(`popupMembershipPaymentMethod${paymentMethod}`));
if (paymentMethod == I.PaymentMethod.Crypto) {
buttonText = translate('popupMembershipWriteToAnyteam');
} else {
buttonText = translate('popupMembershipManagePayment');
};
};
return (
<div className="currentMembership">
<Title text={translate('popupMembershipCurrentStatus')} />
<div className="valid">
<div>
<Label text={translate('popupMembershipValidUntil')} />
<Label className="date" text={dateText} />
</div>
<Label className="paymentMethod" text={paidText} />
</div>
<Button onClick={this.onButton} text={buttonText} className="c36" color="blank" />
</div>
);
};
onButton () {
const { membership } = authStore;
const { onChangeEmail } = this.props;
const { tier, paymentMethod } = membership;
if (tier == I.MembershipTier.Explorer) {
onChangeEmail();
} else {
if (paymentMethod == I.PaymentMethod.Crypto) {
// message to Anyteam
} else {
C.MembershipGetPortalLinkUrl((message: any) => {
if (message.url) {
UtilCommon.onUrl(message.url);
};
});
};
};
};
});
export default PopupMembershipPageCurrent;

195
src/ts/component/popup/page/membership/free.tsx Normal file
View file

@ -0,0 +1,195 @@
import * as React from 'react';
import { observer } from 'mobx-react';
import { Title, Icon, Label, Input, Button, Checkbox, Pin } from 'Component';
import { I, C, translate, UtilCommon, UtilRouter } from 'Lib';
interface State {
verificationStep: number;
countdown: number;
status: string;
statusText: string;
};
const PopupMembershipPageFree = observer(class PopupMembershipPageFree extends React.Component<I.Popup, State> {
state = {
verificationStep: 1,
countdown: 60,
status: '',
statusText: '',
};
refCheckbox: any = null;
refEmail: any = null;
refButton: any = null;
refCode: any = null;
interval: any = null;
timeout: any = null;
email: string = '';
constructor (props: I.Popup) {
super(props);
this.onCheck = this.onCheck.bind(this);
this.onVerifyEmail = this.onVerifyEmail.bind(this);
this.onConfirmEmailCode = this.onConfirmEmailCode.bind(this);
this.onResend = this.onResend.bind(this);
this.validateEmail = this.validateEmail.bind(this);
};
render () {
const { verificationStep, countdown, status, statusText } = this.state;
let content: any = null;
switch (verificationStep) {
case 1: {
content = (
<form onSubmit={this.onVerifyEmail}>
<Title text={translate(`popupMembershipFreeTitleStep1`)} />
<Label text={translate(`popupMembershipFreeText`)} />
<div className="inputWrapper">
<Input ref={ref => this.refEmail = ref} onKeyUp={this.validateEmail} placeholder={translate(`commonEmail`)} />
</div>
<div className="check" onClick={this.onCheck}>
<Checkbox ref={ref => this.refCheckbox = ref} value={true} /> {translate('popupMembershipFreeCheckboxText')}
</div>
<div className={[ 'statusBar', status ].join(' ')}>{statusText}</div>
<Button ref={ref => this.refButton = ref} onClick={this.onVerifyEmail} className="c36" text={translate('commonSubmit')} />
</form>
);
break;
};
case 2: {
content = (
<React.Fragment>
<div onClick={() => this.setState({ verificationStep: 1 })} className="back"><Icon />{translate('commonBack')}</div>
<Title text={translate(`popupMembershipFreeTitleStep2`)} />
<Pin
ref={ref => this.refCode = ref}
pinLength={4}
isVisible={true}
onSuccess={this.onConfirmEmailCode}
/>
<div className={[ 'statusBar', status ].join(' ')}>{statusText}</div>
<div onClick={this.onResend} className={[ 'resend', (countdown ? 'countdown' : '') ].join(' ')}>
{translate('popupMembershipResend')}
{countdown ? UtilCommon.sprintf(translate('popupMembershipCountdown'), countdown) : ''}
</div>
</React.Fragment>
);
break;
};
};
return content;
};
componentDidMount () {
this.validateEmail();
};
componentWillUnmount () {
if (this.interval) {
window.clearInterval(this.interval);
};
if (this.timeout) {
window.clearTimeout(this.timeout);
};
};
onCheck () {
this.refCheckbox.toggle();
};
onVerifyEmail (e: any) {
e.preventDefault();
this.refButton?.setLoading(true);
C.MembershipGetVerificationEmail(this.email, this.refCheckbox?.getValue(), (message) => {
this.refButton?.setLoading(false);
if (message.error.code) {
this.setStatus('error', message.error.description);
return;
};
this.setState({ verificationStep: 2 });
this.startCountdown();
});
};
onConfirmEmailCode () {
const code = this.refCode.getValue();
C.MembershipVerifyEmailCode(code, (message) => {
if (message.error.code) {
this.setStatus('error', message.error.description);
this.refCode.reset();
return;
};
UtilRouter.go('/main/membership', {});
});
};
onResend (e: any) {
if (!this.state.countdown) {
this.onVerifyEmail(e);
};
};
setStatus (status: string, statusText: string) {
this.setState({ status, statusText });
window.clearTimeout(this.timeout);
this.timeout = window.setTimeout(() => this.clearStatus(), 4000);
};
clearStatus () {
this.setState({ status: '', statusText: '' });
};
validateEmail () {
if (!this.refButton || !this.refEmail) {
return;
};
const email = this.refEmail.getValue();
const valid = UtilCommon.emailCheck(email);
if (valid) {
this.email = email;
};
this.refButton.setDisabled(!valid);
};
startCountdown () {
this.setState({ countdown: 60 });
this.interval = window.setInterval(() => {
let { countdown } = this.state;
countdown--;
this.setState({ countdown });
if (!countdown) {
window.clearInterval(this.interval);
this.interval = null;
};
}, 1000);
};
});
export default PopupMembershipPageFree;

162
src/ts/component/popup/page/membership/paid.tsx Normal file
View file

@ -0,0 +1,162 @@
import * as React from 'react';
import { observer } from 'mobx-react';
import { Title, Label, Input, Button } from 'Component';
import { I, C, translate, UtilCommon, UtilData } from 'Lib';
import { authStore } from 'Store';
import Constant from 'json/constant.json';
interface State {
status: string,
statusText: string
};
const PopupMembershipPagePaid = observer(class PopupMembershipPagePaid extends React.Component<I.Popup, State> {
state = {
status: '',
statusText: '',
};
refName: any = null;
refButtonCard: any = null;
refButtonCrypto: any = null;
timeout: any = null;
constructor (props: I.Popup) {
super(props);
this.onKeyUp = this.onKeyUp.bind(this);
this.onPay = this.onPay.bind(this);
};
render() {
const { param } = this.props;
const { data } = param;
const { tier } = data;
const globalName = this.getName();
const { status, statusText } = this.state;
const tierItem = UtilData.getMembershipTier(tier);
const period = tierItem.period == I.MembershipPeriod.Period1Year ?
translate('popupSettingsMembershipPerYear') :
UtilCommon.sprintf(translate('popupSettingsMembershipPerYears'), tierItem.period);
return (
<React.Fragment>
<Title text={translate(`popupMembershipPaidTitle`)} />
<Label text={translate(`popupMembershipPaidText`)} />
<div className="inputWrapper">
<Input
ref={ref => this.refName = ref}
value={globalName}
onKeyUp={this.onKeyUp}
readonly={globalName ? true : false}
placeholder={translate(`popupMembershipPaidPlaceholder`)}
/>
<div className="ns">{Constant.anyNameSpace}</div>
</div>
<div className={[ 'statusBar', status ].join(' ')}>{statusText}</div>
<div className="priceWrapper">
<span className="price">{`$${tierItem.price}`}</span>{period}
</div>
<Button onClick={() => this.onPay(I.PaymentMethod.Card)} ref={ref => this.refButtonCard = ref} className="c36" text={translate('popupMembershipPayByCard')} />
<Button onClick={() => this.onPay(I.PaymentMethod.Crypto)} ref={ref => this.refButtonCrypto = ref} className="c36" text={translate('popupMembershipPayByCrypto')} />
</React.Fragment>
);
};
componentDidMount () {
const globalName = this.getName();
if (!globalName) {
this.disableButtons(true);
};
};
componentWillUnmount () {
if (this.timeout) {
window.clearTimeout(this.timeout);
};
};
onKeyUp () {
const { param } = this.props;
const { data } = param;
const { tier } = data;
const name = this.refName.getValue();
this.disableButtons(true);
this.setState({ statusText: '', status: '' });
window.clearTimeout(this.timeout);
if (!name.length) {
return;
};
this.timeout = window.setTimeout(() => {
C.MembershipIsNameValid(tier, name + Constant.anyNameSpace, (message: any) => {
if (message.error.code) {
this.setState({ status: 'error', statusText: translate(`popupMembershipCode${message.error.code}`) });
return;
};
this.setState({ statusText: translate('popupMembershipStatusWaitASecond') });
C.NameServiceResolveName(name + Constant.anyNameSpace, (message: any) => {
let error = '';
if (message.error.code) {
error = message.error.description;
} else
if (!message.available) {
error = translate('popupMembershipStatusNameNotAvailable');
};
if (error) {
this.setState({ status: 'error', statusText: error });
} else {
this.disableButtons(false);
this.setState({ status: 'ok', statusText: translate('popupMembershipStatusNameAvailable') });
};
});
});
}, Constant.delay.keyboard);
};
disableButtons (v: boolean) {
this.refButtonCard?.setDisabled(v);
this.refButtonCrypto?.setDisabled(v);
};
onPay (method: I.PaymentMethod) {
const { param } = this.props;
const { data } = param;
const { tier } = data;
const globalName = this.getName();
const name = globalName ? '' : this.refName.getValue() + Constant.anyNameSpace;
const refButton = method == I.PaymentMethod.Card ? this.refButtonCard : this.refButtonCrypto;
refButton.setLoading(true);
C.MembershipGetPaymentUrl(tier, method, name, (message) => {
refButton.setLoading(false);
if (message.error.code) {
this.setState({ status: 'error', statusText: message.error.description });
return;
};
if (message.url) {
UtilCommon.onUrl(message.url);
};
});
};
getName () {
return String(authStore.membership?.requestedAnyName || '');
};
});
export default PopupMembershipPagePaid;

27
src/ts/component/popup/page/membership/success.tsx Normal file
View file

@ -0,0 +1,27 @@
import * as React from 'react';
import { observer } from 'mobx-react';
import { Title, Label, Icon, Button } from 'Component';
import { I, translate, UtilCommon } from 'Lib';
const PopupMembershipPageSuccess = observer(class PopupMembershipPageSuccess extends React.Component<I.Popup> {
render () {
const { param, close } = this.props;
const { data } = param;
const { tier } = data;
const text = tier == I.MembershipTier.Explorer ? translate('popupMembershipSuccessTextCuriosity') : translate('popupMembershipSuccessTextSupport');
return (
<React.Fragment>
<Title text={UtilCommon.sprintf(translate(`popupMembershipSuccessTitle`), translate(`popupSettingsMembershipTier${tier}Title`))} />
<Icon className={`tier${tier}`} />
<Label text={text} />
<Button onClick={() => close()} className="c36" color="blank" text={translate('commonContinue')} />
</React.Fragment>
);
};
});
export default PopupMembershipPageSuccess;

5
src/ts/component/popup/page/settings/delete.tsx
View file

@ -74,10 +74,7 @@ const PopupSettingsPageDelete = observer(class PopupSettingsPageDelete extends R
};
onCheck () {
const value = !this.refCheckbox.getValue();
this.refCheckbox.setValue(value);
this.refButton.setDisabled(!value);
this.refCheckbox.toggle();
};
});

161
src/ts/component/popup/page/settings/membership.tsx Normal file
View file

@ -0,0 +1,161 @@
import * as React from 'react';
import { observer } from 'mobx-react';
import { Title, Label, Button, Icon, Loader } from 'Component';
import { I, translate, UtilCommon, UtilDate, UtilData } from 'Lib';
import { popupStore, authStore } from 'Store';
import { Swiper, SwiperSlide } from 'swiper/react';
import { Pagination, Autoplay } from 'swiper/modules';
import arrayMove from 'array-move';
import Url from 'json/url.json';
const PopupSettingsPageMembership = observer(class PopupSettingsPageMembership extends React.Component<I.PopupSettings> {
state = {
loading: false,
};
node: any = null;
swiper: any = null;
render () {
const { membership, account } = authStore;
const { loading } = this.state;
const hasTier = membership.tier != I.MembershipTier.None;
const url = Url.membershipSpecial.replace(/\%25accountId\%25/g, account.id);
const tiers = UtilData.getMembershipTiers().filter(it => it.id >= membership.tier);
const links = [
{ url: Url.pricing, name: translate('popupSettingsMembershipLevelsDetails') },
{ url: Url.privacy, name: translate('popupSettingsMembershipPrivacyPolicy') },
{ url: Url.terms, name: translate('popupSettingsMembershipTermsAndConditions') },
];
let slides = [];
for (let i = 0; i < 4; i++) {
slides.push({ idx: i, title: translate(`popupSettingsMembershipSlide${i}Title`), text: translate(`popupSettingsMembershipSlide${i}Text`) });
};
// swiper has weird bug with setting initial slide to 0 with autoplay and loop enabled
// so in order to keep the flow as it was designed we move last element to position 0
slides = arrayMove(slides, 3, 0);
const SlideItem = (slide) => (
<div className={[ 'slide', `slide${slide.idx}` ].join(' ')}>
<div className={[ 'illustration', `slide${slide.idx}` ].join(' ')} />
<div className="text">
<Title text={slide.title} />
<Label text={slide.text} />
</div>
</div>
);
const TierItem = (item: any) => {
const isCurrent = item.id == membership.tier;
const price = item.price ? `$${item.price}` : translate('popupSettingsMembershipJustEmail');
let period = '';
let currentLabel = null;
let buttonText = translate('popupSettingsMembershipLearnMore');
if (isCurrent) {
if (item.period && membership.dateEnds) {
period = UtilCommon.sprintf(translate('popupSettingsMembershipValidUntil'), UtilDate.date('d M Y', membership.dateEnds))
} else {
period = translate('popupSettingsMembershipForeverFree');
};
currentLabel = <div className="currentLabel">{translate('popupSettingsMembershipCurrent')}</div>;
buttonText = translate('popupSettingsMembershipManage');
} else
if (item.period) {
period = item.period == I.MembershipPeriod.Period1Year ?
translate('popupSettingsMembershipPerYear') :
UtilCommon.sprintf(translate('popupSettingsMembershipPerYears'), item.period);
};
return (
<div
className={[ 'tier', `tier${item.idx}`, isCurrent ? 'current' : '' ].join(' ')}
onClick={() => popupStore.open('membership', { data: { tier: item.id } })}
>
<div className="top">
{currentLabel}
<div className={[ 'icon', `tier${item.idx}` ].join(' ')} />
<Title text={translate(`popupSettingsMembershipTier${item.idx}Title`)} />
<Label text={translate(`popupSettingsMembershipTier${item.idx}Text`)} />
</div>
<div className="bottom">
<div className="priceWrapper">
<span className="price">{price}</span>{period}
</div>
<Button className="c28" text={buttonText} />
</div>
</div>
);
};
return (
<div ref={node => this.node = node}>
<div className="membershipTitle">{hasTier ? translate('popupSettingsMembershipTitle1') : translate('popupSettingsMembershipTitle2')}</div>
{loading ? <Loader/> : ''}
{hasTier ? '' : (
<React.Fragment>
<Label className="description" text={translate('popupSettingsMembershipText')} />
<Swiper
spaceBetween={16}
slidesPerView={'auto'}
initialSlide={1}
pagination={{
clickable: true,
}}
autoplay={{
waitForTransition: true,
delay: 4000,
disableOnInteraction: true,
}}
modules={[Pagination, Autoplay]}
centeredSlides={true}
loop={true}
onSwiper={swiper => this.onSwiper(swiper)}
>
{slides.map((slide: any, idx: number) => (
<SwiperSlide key={idx}>
<SlideItem key={idx} {...slide} />
</SwiperSlide>
))}
</Swiper>
</React.Fragment>
)}
<div className="tiers">
{tiers.map((tier, idx) => (
<TierItem key={idx} {...tier} />
))}
</div>
<div className="actionItems">
{links.map((item, i) => (
<div key={i} onClick={() => UtilCommon.onUrl(item.url)} className="item">
<Label text={item.name} />
<Icon />
</div>
))}
</div>
<Label className="special" text={UtilCommon.sprintf(translate('popupSettingsMembershipSpecial'), url)} />
</div>
);
};
componentDidMount(): void {
UtilCommon.renderLinks($(this.node));
};
onSwiper (swiper) {
this.swiper = swiper;
};
});
export default PopupSettingsPageMembership;

2
src/ts/component/popup/page/settings/space/index.tsx
View file

@ -41,7 +41,7 @@ const PopupSettingsSpaceIndex = observer(class PopupSettingsSpaceIndex extends R
const isOwner = UtilSpace.isOwner();
const isShared = space.spaceAccessType == I.SpaceType.Shared;
const requestCnt = this.getRequestCnt();
const sharedCnt = spaces.filter(it => (it.spaceAccessType == I.SpaceType.Shared) && ((it.creator == UtilSpace.getParticipantId(it.targetSpaceId, account.id)) || !it.creator)).length;
const sharedCnt = this.getSharedCnt();
const canWrite = UtilSpace.canParticipantWrite();
const canDelete = space.targetSpaceId != accountSpaceId;
const isShareActive = UtilSpace.isShareActive();

78
src/ts/component/popup/page/settings/space/share.tsx
View file

@ -3,7 +3,7 @@ import $ from 'jquery';
import { observer } from 'mobx-react';
import { Title, Label, Icon, Input, Button, IconObject, ObjectName, Select, Tag, Error, Loader } from 'Component';
import { I, C, translate, UtilCommon, UtilSpace, Preview, Action } from 'Lib';
import { dbStore, detailStore, popupStore, commonStore, menuStore } from 'Store';
import { authStore, popupStore, commonStore, menuStore } from 'Store';
import { AutoSizer, WindowScroller, CellMeasurer, CellMeasurerCache, List } from 'react-virtualized';
import Head from '../head';
import Constant from 'json/constant.json';
@ -54,18 +54,33 @@ const PopupSettingsSpaceShare = observer(class PopupSettingsSpaceShare extends R
return <Loader id="loader" />;
};
const { onPage } = this.props;
const { membership } = authStore;
const hasLink = cid && key;
const space = UtilSpace.getSpaceview();
const { readersLimit, writersLimit } = space;
const isShared = space.spaceAccessType == I.SpaceType.Shared;
const participant = UtilSpace.getParticipant();
const members = this.getMembers();
const memberOptions = this.getMemberOptions();
const members = this.getParticipantList();
const memberOptions = this.getParticipantOptions();
const length = members.length;
const isShareActive = UtilSpace.isShareActive();
const readersLimitText = UtilCommon.plural(readersLimit, translate('pluralReader'));
const writersLimitText = UtilCommon.plural(writersLimit, translate('pluralWriter'));
let limitLabel = '';
let limitButton = '';
let showLimit = false;
if (isShared) {
if (!UtilSpace.getWriterLimit()) {
limitLabel = translate('popupSettingsSpaceShareInvitesWriterLimitReachedLabel');
limitButton = translate('popupSettingsSpaceShareInvitesWriterLimitReachedButton');
showLimit = true;
} else
if (!UtilSpace.getReaderLimit() && (membership.tier == I.MembershipTier.Explorer)) {
limitLabel = translate('popupSettingsSpaceShareInvitesWriterLimitReachedLabel');
limitButton = translate('popupSettingsSpaceShareInvitesWriterLimitReachedButton');
showLimit = true;
};
};
const Member = (item: any) => {
const isActive = item.id == participant.id;
@ -167,19 +182,13 @@ const PopupSettingsSpaceShare = observer(class PopupSettingsSpaceShare extends R
<Label text={translate('popupSettingsSpaceShareInviteLinkLabel')} />
{hasLink ? (
<React.Fragment>
<div className="inviteLinkWrapper">
<div className="inputWrapper">
<Input ref={ref => this.refInput = ref} readonly={true} value={this.getLink()} onClick={() => this.refInput?.select()} />
<Icon id="button-more-link" className="more" onClick={this.onMoreLink} />
</div>
<Button ref={ref => this.refCopy = ref} onClick={this.onCopy} className="c40" color="blank" text={translate('commonCopyLink')} />
<div className="inviteLinkWrapper">
<div className="inputWrapper">
<Input ref={ref => this.refInput = ref} readonly={true} value={this.getLink()} onClick={() => this.refInput?.select()} />
<Icon id="button-more-link" className="more" onClick={this.onMoreLink} />
</div>
{/*<div className="invitesLimit">*/}
{/* {UtilCommon.sprintf(translate('popupSettingsSpaceShareInvitesLimit'), readersLimit, readersLimitText, writersLimit, writersLimitText)}*/}
{/*</div>*/}
</React.Fragment>
<Button ref={ref => this.refCopy = ref} onClick={this.onCopy} className="c40" color="blank" text={translate('commonCopyLink')} />
</div>
) : (
<div className="buttons">
<Button
@ -195,6 +204,12 @@ const PopupSettingsSpaceShare = observer(class PopupSettingsSpaceShare extends R
<div id="sectionMembers" className="section sectionMembers">
<Title text={translate('popupSettingsSpaceShareMembersTitle')} />
{showLimit ? (
<div className="row">
<Label text={limitLabel} />
<Button className="payment" text={limitButton} onClick={() => onPage('membership')} />
</div>
) : ''}
{this.cache ? (
<div id="list" className="rows">
@ -229,7 +244,14 @@ const PopupSettingsSpaceShare = observer(class PopupSettingsSpaceShare extends R
};
componentDidMount () {
this.updateCache();
const items = this.getParticipantList();
this.cache = new CellMeasurerCache({
fixedWidth: true,
defaultHeight: HEIGHT,
keyMapper: i => (items[i] || {}).id,
});
this.setState({ isLoading: true });
C.SpaceInviteGetCurrent(commonStore.space, (message: any) => {
@ -249,28 +271,16 @@ const PopupSettingsSpaceShare = observer(class PopupSettingsSpaceShare extends R
this.setState({ cid, key });
};
updateCache () {
const members = this.getMembers();
this.cache = new CellMeasurerCache({
fixedWidth: true,
defaultHeight: HEIGHT,
keyMapper: i => (members[i] || {}).id,
});
this.forceUpdate();
};
onScroll ({ scrollTop }) {
if (scrollTop) {
this.top = scrollTop;
};
};
getMembers () {
const subId = Constant.subId.participant;
getParticipantList () {
const requestStatuses = [ I.ParticipantStatus.Joining, I.ParticipantStatus.Removing ];
const allowedStatuses = requestStatuses.concat(I.ParticipantStatus.Active);
const records = dbStore.getRecords(subId, '').map(id => detailStore.get(subId, id)).filter(it => allowedStatuses.includes(it.status));
const records = UtilSpace.getParticipantsList(allowedStatuses);
return records.sort((c1, c2) => {
const isRequest1 = requestStatuses.includes(c1.status);
@ -348,7 +358,7 @@ const PopupSettingsSpaceShare = observer(class PopupSettingsSpaceShare extends R
});
};
getMemberOptions () {
getParticipantOptions () {
let items: any[] = ([
{ id: I.ParticipantPermissions.Reader },
{ id: I.ParticipantPermissions.Writer },

45
src/ts/component/popup/settings.tsx
View file

@ -2,8 +2,9 @@ import * as React from 'react';
import $ from 'jquery';
import { observer } from 'mobx-react';
import { Loader, IconObject, Icon, Label } from 'Component';
import { I, UtilCommon, UtilSpace, analytics, Action, keyboard, translate, Preview } from 'Lib';
import { popupStore, commonStore } from 'Store';
import { I, UtilCommon, UtilSpace, analytics, Action, keyboard, translate, Preview, UtilData } from 'Lib';
import { popupStore, commonStore, authStore } from 'Store';
import Constant from 'json/constant.json';
import PageAccount from './page/settings/account';
import PageDataManagement from './page/settings/data';
@ -34,6 +35,8 @@ import PageSpaceShare from './page/settings/space/share';
import PageSpaceMembers from './page/settings/space/members';
import PageSpaceList from './page/settings/space/list';
import PageMembership from './page/settings/membership';
interface State {
loading: boolean;
};
@ -45,6 +48,7 @@ const Components: any = {
personal: PagePersonal,
appearance: PageAppearance,
phrase: PagePhrase,
membership: PageMembership,
logout: PageLogout,
pinIndex: PagePinIndex,
@ -97,6 +101,7 @@ const PopupSettings = observer(class PopupSettings extends React.Component<I.Pop
const { data } = param;
const { page } = data;
const { loading } = this.state;
const { membership } = authStore;
const sections = this.getSections().filter(it => !it.isHidden);
const participant = UtilSpace.getParticipant();
const cnr = [ 'side', 'right', UtilCommon.toCamelCase('tab-' + page) ];
@ -135,6 +140,7 @@ const PopupSettings = observer(class PopupSettings extends React.Component<I.Pop
let icon = null;
let name = null;
let caption = null;
if (action.id == 'account') {
icon = <IconObject object={participant} size={36} iconSize={36} forceLetter={true} />;
@ -146,6 +152,17 @@ const PopupSettings = observer(class PopupSettings extends React.Component<I.Pop
name = action.name;
};
if (action.id == 'membership') {
if (membership.tier != I.MembershipTier.None) {
const tierItem = UtilData.getMembershipTier(membership.tier);
if (tierItem) {
caption = <div className="caption">{translate(`popupSettingsMembershipTier${tierItem.idx}Title`)}</div>;
};
} else {
caption = <div className="caption join">{translate(`commonJoin`)}</div>;
};
};
return (
<div
id={`item-${action.id}`}
@ -154,6 +171,8 @@ const PopupSettings = observer(class PopupSettings extends React.Component<I.Pop
>
{icon}
<div className="name">{name}</div>
{caption}
</div>
);
};
@ -240,6 +259,7 @@ const PopupSettings = observer(class PopupSettings extends React.Component<I.Pop
const { param } = this.props;
const { data } = param;
const { isSpace } = data;
const { config } = commonStore;
if (isSpace) {
return [
@ -260,6 +280,15 @@ const PopupSettings = observer(class PopupSettings extends React.Component<I.Pop
},
];
} else {
const settingsVoid = [
{ id: 'spaceList', name: translate('popupSettingsSpacesListTitle'), icon: 'spaces' },
{ id: 'dataManagement', name: translate('popupSettingsDataManagementTitle'), icon: 'storage', subPages: [ 'delete' ] },
{ id: 'phrase', name: translate('popupSettingsPhraseTitle') },
];
if (UtilData.isAnytypeNetwork() && config.experimental) {
settingsVoid.push({ id: 'membership', icon: 'membership', name: translate('popupSettingsMembershipTitle1') })
};
return [
{ id: 'account', children: [ { id: 'account', name: translate('popupSettingsProfileTitle') } ] },
{
@ -270,11 +299,7 @@ const PopupSettings = observer(class PopupSettings extends React.Component<I.Pop
]
},
{
name: translate('popupSettingsVoidTitle'), children: [
{ id: 'spaceList', name: translate('popupSettingsSpacesListTitle'), icon: 'spaces' },
{ id: 'dataManagement', name: translate('popupSettingsDataManagementTitle'), icon: 'storage', subPages: [ 'delete' ] },
{ id: 'phrase', name: translate('popupSettingsPhraseTitle') },
]
name: translate('popupSettingsVoidTitle'), children: settingsVoid
}
];
};
@ -304,14 +329,16 @@ const PopupSettings = observer(class PopupSettings extends React.Component<I.Pop
this.setState({ loading: v });
};
onPage (id: string) {
onPage (id: string, additional?: any) {
additional = additional || {};
const { param } = this.props;
const { data } = param;
const { page } = data || {};
this.prevPage = page;
popupStore.updateData(this.props.id, { page: id });
popupStore.updateData(this.props.id, { page: id, ...additional });
analytics.event('settings', { params: { id } });
};

9
src/ts/interface/index.ts
View file

@ -75,6 +75,7 @@ import { ContentRelation } from './block/relation';
import { EmbedProcessor, ContentEmbed } from './block/embed';
import { BlockComponentTable, ContentTableRow } from './block/table';
import { WidgetLayout, WidgetTreeItem, WidgetTreeDetails, ContentWidget, WidgetComponent } from './block/widget';
import { MembershipTier, Membership, MembershipTierItem, MembershipStatus, PaymentMethod, MembershipPrice, MembershipPeriod } from './payment';
export {
Account,
@ -239,4 +240,12 @@ export {
WidgetTreeDetails,
WidgetComponent,
ContentWidget,
MembershipTier,
Membership,
MembershipTierItem,
MembershipStatus,
PaymentMethod,
MembershipPrice,
MembershipPeriod,
};

55
src/ts/interface/payment.ts Normal file
View file

@ -0,0 +1,55 @@
export enum MembershipTier {
None = 0,
Explorer = 1,
BuilderTest = 2,
CoCreatorTest = 3,
Builder = 4,
CoCreator = 5,
};
export enum MembershipStatus {
Unknown = 0,
Pending = 1,
Active = 2,
Finalization = 3,
};
export enum PaymentMethod {
Card = 0,
Crypto = 1,
ApplePay = 2,
GooglePay = 3,
AppleInapp = 4,
GoogleInapp = 5,
};
export enum MembershipPrice {
Price1Year = 99,
Price5Years = 399,
};
export enum MembershipPeriod {
Period1Year = 1,
Period5Years = 5,
};
export interface Membership {
tier?: MembershipTier;
status?: MembershipStatus;
dateStarted?: number;
dateEnds?: number;
isAutoRenew?: boolean;
nextTier?: MembershipTier;
nextTierEnds?: number;
paymentMethod?: PaymentMethod,
requestedAnyName?: string;
userEmail?: string;
subscribeToNewsletter?: boolean;
};
export interface MembershipTierItem {
id?: MembershipTier;
idx?: number;
price?: MembershipPrice;
period?: MembershipPeriod;
};

2
src/ts/interface/popup.ts
View file

@ -20,7 +20,7 @@ export interface Popup {
export interface PopupSettings extends Popup {
prevPage: string;
onPage: (id: string) => void;
onPage: (id: string, data?: any) => void;
setConfirmPin: (v: () => void) => void;
setPinConfirmed: (v: boolean) => void;
onConfirmPin: () => void;

93
src/ts/lib/api/command.ts
View file

@ -3,6 +3,7 @@ import Model from 'dist/lib/pkg/lib/pb/model/protos/models_pb';
import { detailStore } from 'Store';
import { I, UtilCommon, Mark, Storage, dispatcher, Encode, Mapper } from 'Lib';
import Constant from 'json/constant.json';
import { MembershipTier } from 'Interface';
const Rpc = Commands.Rpc;
@ -1240,7 +1241,7 @@ export const ObjectCreateFromUrl = (details: any, spaceId: string, typeKey: stri
request.setSpaceid(spaceId);
request.setObjecttypeuniquekey(typeKey);
request.setUrl(url);
request.setAddpagecontent(withContent);
//request.setAddpagecontent(withContent);
dispatcher.request(ObjectCreateFromUrl.name, request, callBack);
};
@ -1864,6 +1865,88 @@ export const NotificationReply = (ids: string[], action: I.NotificationAction, c
dispatcher.request(NotificationReply.name, request, callBack);
};
// ---------------------- NAME SERVICE ---------------------- //
export const NameServiceResolveName = (name: string, callBack?: (message: any) => void) => {
const request = new Rpc.NameService.ResolveName.Request();
request.setFullname(name);
dispatcher.request(NameServiceResolveName.name, request, callBack);
};
export const NameServiceResolveAnyId = (id: string, callBack?: (message: any) => void) => {
const request = new Rpc.NameService.ResolveAnyId.Request();
request.setAnyid(id);
dispatcher.request(NameServiceResolveAnyId.name, request, callBack);
};
export const NameServiceResolveSpaceId = (id: string, callBack?: (message: any) => void) => {
const request = new Rpc.NameService.ResolveSpaceId.Request();
request.setSpaceid(id);
dispatcher.request(NameServiceResolveSpaceId.name, request, callBack);
};
export const NameServiceUserAccountGet = (callBack?: (message: any) => void) => {
const request = new Commands.Empty();
dispatcher.request(NameServiceUserAccountGet.name, request, callBack);
};
// ---------------------- PAYMENTS ---------------------- //
export const MembershipGetStatus = (noCache: boolean, callBack?: (message: any) => void) => {
const request = new Rpc.Membership.GetStatus.Request();
request.setNocache(noCache);
dispatcher.request(MembershipGetStatus.name, request, callBack);
};
export const MembershipIsNameValid = (tier: I.MembershipTier, name: string, callBack?: (message: any) => void) => {
const request = new Rpc.Membership.IsNameValid.Request();
request.setRequestedtier(tier as number);
request.setRequestedanyname(name);
dispatcher.request(MembershipIsNameValid.name, request, callBack);
};
export const MembershipGetPaymentUrl = (tier: I.MembershipTier, method: I.PaymentMethod, name: string, callBack?: (message: any) => void) => {
const request = new Rpc.Membership.GetPaymentUrl.Request();
request.setRequestedtier(tier as number);
request.setPaymentmethod(method as number);
request.setRequestedanyname(name);
dispatcher.request(MembershipGetPaymentUrl.name, request, callBack);
};
export const MembershipGetPortalLinkUrl = (callBack?: (message: any) => void) => {
const request = new Commands.Empty();
dispatcher.request(MembershipGetPortalLinkUrl.name, request, callBack);
};
export const MembershipGetVerificationEmail = (email: string, isSubscribed: boolean, callBack?: (message: any) => void) => {
const request = new Rpc.Membership.GetVerificationEmail.Request();
request.setEmail(email);
request.setSubscribetonewsletter(isSubscribed);
dispatcher.request(MembershipGetVerificationEmail.name, request, callBack);
};
export const MembershipVerifyEmailCode = (code: string, callBack?: (message: any) => void) => {
const request = new Rpc.Membership.VerifyEmailCode.Request();
request.setCode(code);
dispatcher.request(MembershipVerifyEmailCode.name, request, callBack);
};
// ---------------------- SPACE ---------------------- //
export const SpaceInviteGenerate = (spaceId: string, callBack?: (message: any) => void) => {
@ -1892,11 +1975,11 @@ export const SpaceInviteRevoke = (spaceId: string, callBack?: (message: any) =>
};
export const SpaceStopSharing = (spaceId: string, callBack?: (message: any) => void) => {
const request = new Rpc.Space.StopSharing.Request();
//const request = new Rpc.Space.StopSharing.Request();
request.setSpaceid(spaceId);
//request.setSpaceid(spaceId);
dispatcher.request(SpaceStopSharing.name, request, callBack);
//dispatcher.request(SpaceStopSharing.name, request, callBack);
};
export const SpaceInviteGetCurrent = (spaceId: string, callBack?: (message: any) => void) => {
@ -1980,4 +2063,4 @@ export const BroadcastPayloadEvent = (payload: any, callBack?: (message: any) =>
request.setPayload(JSON.stringify(payload, null, 3));
dispatcher.request(BroadcastPayloadEvent.name, request, callBack);
};
};

8
src/ts/lib/api/dispatcher.ts
View file

@ -23,7 +23,7 @@ const SORT_IDS = [
'blockDataviewViewDelete',
];
const SKIP_IDS = [ 'BlockSetCarriage' ];
const SKIP_SENTRY_ERRORS = [ 'LinkPreview', 'BlockTextSetText', 'FileSpaceUsage' ];
const SKIP_SENTRY_ERRORS = [ 'LinkPreview', 'BlockTextSetText', 'FileSpaceUsage', 'SpaceInviteGetCurrent' ];
class Dispatcher {
@ -155,6 +155,8 @@ class Dispatcher {
if (v == V.NOTIFICATIONSEND) t = 'notificationSend';
if (v == V.NOTIFICATIONUPDATE) t = 'notificationUpdate';
if (v == V.PAYLOADBROADCAST) t = 'payloadBroadcast';
if (v == V.MEMBERSHIPUPDATE) t = 'membershipUpdate';
return t;
};
@ -1011,6 +1013,10 @@ class Dispatcher {
break;
};
case 'membershipUpdate':
authStore.membershipSet(Mapper.From.Membership(data.getData()));
break;
case 'processNew':
case 'processUpdate':
case 'processDone': {

14
src/ts/lib/api/mapper.ts
View file

@ -579,6 +579,20 @@ export const Mapper = {
};
},
Membership: (obj: Model.Membership): I.Membership => {
return {
tier: obj.getTier(),
status: obj.getStatus() as number,
dateStarted: obj.getDatestarted(),
dateEnds: obj.getDateends(),
isAutoRenew: obj.getIsautorenew(),
paymentMethod: obj.getPaymentmethod() as number,
requestedAnyName: obj.getRequestedanyname(),
userEmail: obj.getUseremail(),
subscribeToNewsletter: obj.getSubscribetonewsletter(),
};
},
},
//------------------------------------------------------------

53
src/ts/lib/api/response.ts
View file

@ -456,6 +456,57 @@ export const NotificationList = (response: Rpc.Notification.List.Response) => {
};
};
export const NameServiceResolveName = (response: Rpc.NameService.ResolveName.Response) => {
return {
available: response.getAvailable(),
ownerScwEthAddress: response.getOwnerscwethaddress(),
ownerEtherAddress: response.getOwnerethaddress(),
ownerAnyAddress: response.getOwneranyaddress(),
spaceId: response.getSpaceid(),
nameExpires: response.getNameexpires(),
};
};
export const NameServiceResolveAnyId = (response: Rpc.NameService.ResolveAnyId.Response) => {
return {
found: response.getFound(),
fullName: response.getFullname(),
};
};
export const NameServiceResolveSpaceId = (response: Rpc.NameService.ResolveSpaceId.Response) => {
return {
found: response.getFound(),
fullName: response.getFullname(),
};
};
export const NameServiceUserAccountGet = (response: Rpc.NameService.UserAccount.Get.Response) => {
return {
anyNameAttached: response.getAnynameattached(),
namesCountLeft: response.getNamescountleft(),
operationsCountLeft: response.getOperationscountleft(),
};
};
export const MembershipGetStatus = (response: Rpc.Membership.GetStatus.Response) => {
return {
membership: Mapper.From.Membership(response.getData()),
};
};
export const MembershipGetPaymentUrl = (response: Rpc.Membership.GetPaymentUrl.Response) => {
return {
url: response.getPaymenturl(),
};
};
export const MembershipGetPortalLinkUrl = (response: Rpc.Membership.GetPortalLinkUrl.Response) => {
return {
url: response.getPortalurl(),
};
};
export const SpaceInviteGenerate = (response: Rpc.Space.InviteGenerate.Response) => {
return {
inviteCid: response.getInvitecid(),
@ -476,4 +527,4 @@ export const SpaceInviteView = (response: Rpc.Space.InviteView.Response) => {
creatorName: response.getCreatorname(),
spaceId: response.getSpaceid(),
};
};
};

71
src/ts/lib/util/data.ts
View file

@ -245,18 +245,6 @@ class UtilData {
C.ObjectOpen(widgets, '', space, () => {
this.createSubscriptions(() => {
C.NotificationList(false, Constant.limit.notification, (message: any) => {
if (!message.error.code) {
notificationStore.set(message.list);
};
});
C.FileNodeUsage((message: any) => {
if (!message.error.code) {
commonStore.spaceStorageSet(message);
};
});
// Redirect
if (pin && !keyboard.isPinChecked) {
UtilRouter.go('/auth/pin-check', routeParam);
@ -285,6 +273,22 @@ class UtilData {
});
};
onAuthOnce () {
C.NotificationList(false, Constant.limit.notification, (message: any) => {
if (!message.error.code) {
notificationStore.set(message.list);
};
});
C.FileNodeUsage((message: any) => {
if (!message.error.code) {
commonStore.spaceStorageSet(message);
};
});
this.getMembershipData(true);
};
createSubscriptions (callBack?: () => void): void {
const { space } = commonStore;
const { account } = authStore;
@ -985,6 +989,49 @@ class UtilData {
return ret;
};
getMembershipData (noCache: boolean, callBack?: (message: any) => void) {
C.MembershipGetStatus(noCache, (message) => {
if (message.error.code) {
return;
};
authStore.membershipSet(message.membership);
if (callBack) {
callBack(message.membership);
};
});
};
getMembershipTiers (): I.MembershipTierItem[] {
const { config } = commonStore;
const { testPayment } = config;
return [
{
id: I.MembershipTier.Explorer,
idx: 1
},
{
id: testPayment ? I.MembershipTier.BuilderTest : I.MembershipTier.Builder,
idx: 2,
price: I.MembershipPrice.Price1Year,
period: I.MembershipPeriod.Period1Year,
},
{
id: testPayment ? I.MembershipTier.CoCreatorTest : I.MembershipTier.CoCreator,
idx: 3,
price: I.MembershipPrice.Price5Years,
period: I.MembershipPeriod.Period5Years,
}
];
};
getMembershipTier (id: I.MembershipTier): I.MembershipTierItem {
const tiers = this.getMembershipTiers();
return tiers.find(it => it.id == id) || {};
};
isAnytypeNetwork (): boolean {
return Object.values(Constant.networkId).includes(authStore.account?.info?.networkId);
};

20
src/ts/lib/util/space.ts
View file

@ -132,6 +132,26 @@ class UtilSpace {
return commonStore.isOnline && UtilData.isAnytypeNetwork();
};
getReaderLimit () {
const space = this.getSpaceview();
if (!space) {
return 0;
};
const participants = this.getParticipantsList([ I.ParticipantStatus.Active ]);
return space.readersLimit - participants.length;
};
getWriterLimit () {
const space = this.getSpaceview();
if (!space) {
return 0;
};
const participants = this.getParticipantsList([ I.ParticipantStatus.Active ]).filter(it => [ I.ParticipantPermissions.Writer, I.ParticipantPermissions.Owner ].includes(it.permissions));
return space.writersLimit - participants.length;
};
};
export default new UtilSpace();

7
src/ts/model/notification.ts
View file

@ -31,11 +31,12 @@ class Notification implements I.Notification {
};
fillContent () {
const { importType, errorCode, name, permissions } = this.payload;
const { importType, errorCode, name } = this.payload;
const lang = errorCode ? 'error' : 'success';
const et = UtilCommon.enumKey(I.NotificationType, this.type);
const identityName = UtilCommon.shorten(String(this.payload.identityName || translate('defaultNamePage')), 32);
const spaceName = UtilCommon.shorten(String(this.payload.spaceName || translate('defaultNamePage')), 32);
const permissions = translate(`participantPermissions${this.payload.permissions}`);
this.title = translate(UtilCommon.toCamelCase(`notification-${et}-${lang}-title`));
this.text = translate(UtilCommon.toCamelCase(`notification-${et}-${lang}-text`));
@ -68,7 +69,7 @@ class Notification implements I.Notification {
case I.NotificationType.Approve: {
this.title = '';
this.text = UtilCommon.sprintf(this.text, spaceName, translate(`participantPermissions${permissions}`));
this.text = UtilCommon.sprintf(this.text, spaceName, permissions);
break;
};
@ -81,7 +82,7 @@ class Notification implements I.Notification {
case I.NotificationType.Permission: {
this.title = '';
this.text = UtilCommon.sprintf(this.text, translate(`participantPermissions${permissions}`), spaceName);
this.text = UtilCommon.sprintf(this.text, permissions, spaceName);
break;
};

14
src/ts/store/auth.ts
View file

@ -17,6 +17,7 @@ class AuthStore {
public appToken = '';
public appKey = '';
public threadMap: Map<string, any> = new Map();
public membershipData: I.Membership = { tier: I.MembershipTier.None, status: I.MembershipStatus.Unknown };
constructor () {
makeObservable(this, {
@ -24,12 +25,15 @@ class AuthStore {
accountList: observable,
name: observable,
threadMap: observable,
membershipData: observable,
membership: computed,
accounts: computed,
account: computed,
nameSet: action,
accountAdd: action,
accountSet: action,
threadSet: action,
membershipSet: action,
threadRemove: action,
clearAll: action,
logout: action,
@ -57,6 +61,10 @@ class AuthStore {
};
};
get membership (): I.Membership {
return this.membershipData || { tier: I.MembershipTier.None, status: I.MembershipStatus.Unknown };
};
nameSet (v: string) {
this.name = String(v || '');
};
@ -77,6 +85,10 @@ class AuthStore {
this.appKey = String(v || '');
};
membershipSet (v: I.Membership) {
this.membershipData = v;
};
accountAdd (account: any) {
account.info = account.info || {};
account.status = account.status || {};
@ -183,4 +195,4 @@ class AuthStore {
};
export const authStore: AuthStore = new AuthStore();
export const authStore: AuthStore = new AuthStore();

2
src/ts/store/popup.ts
View file

@ -17,6 +17,8 @@ const SHOW_DIMMER = [
'inviteRequest',
'inviteConfirm',
'inviteQr',
'usecase',
'membership',
];
class PopupStore {