Mirrors/notesnook
1
0
Fork 0
mirror of https://github.com/streetwriters/notesnook.git synced 2026-09-01 19:49:54 +02:00
Code Issues Packages Projects Releases Wiki Activity

web: redesign plans page

Browse Source 
Signed-off-by: 01zulfi <85733202+01zulfi@users.noreply.github.com>
This commit is contained in:
01zulfi
2026-07-23 11:51:23 +05:00
committed by Abdullah Atta
parent 8192d1a208
commit 1dcdef2abb
21 changed files with 1185 additions and 459 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
apps/web/src/assets/featured/android-police.svg
View File

@@ -1,17 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Layer_2" data-name="Layer 2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 140 84.34">
<defs>
<style>
.cls-1 {
fill: #f00;
stroke-width: 0px;
}
</style>
</defs>
<g id="Layer_1-2" data-name="Layer 1">
<g>
<path class="cls-1" d="M44.18,55.74l7.41,12.99H3.42c-2.62,0-4.27-2.83-2.96-5.11L35.93,1.66c1.26-2.2,4.43-2.21,5.71-.02l36.36,62.46c1.19,2.05-.29,4.63-2.66,4.63l-12.93-.1-23.57-42.46-16.8,29.44,22.15.13Z"/>
<path class="cls-1" d="M108,49.31l7.59,12.88,23.95-41.79c1.3-2.28-.34-5.11-2.96-5.11l-71.4-.04c-2.54,0-4.12,2.74-2.86,4.94l36.11,62.61c1.19,2.06,4.16,2.05,5.34,0l6.35-11.26-25.11-41.57,33.9.06-10.91,19.28Z"/>
</g>
<svg xmlns="http://www.w3.org/2000/svg" width="51" height="31" viewBox="0 0 51 31" fill="none">
<g clip-path="url(#clip0_2073_16837)">
<path d="M16.151 20.2975L18.8493 25.0277H1.30856C0.354508 25.0277 -0.246326 23.9972 0.2307 23.1669L13.1468 0.604704C13.6056 -0.196408 14.76 -0.20005 15.2261 0.597421L28.4663 23.3417C28.8996 24.0882 28.3607 25.0277 27.4976 25.0277L22.7893 24.9913L14.2065 9.52982L8.08888 20.2501L16.1546 20.2975H16.151Z" fill="#FF0000"/>
<path d="M39.3908 17.9558L42.1546 22.6459L50.8758 7.42843C51.3492 6.59819 50.752 5.56767 49.798 5.56767L23.7983 5.5531C22.8733 5.5531 22.298 6.55085 22.7568 7.35196L35.906 30.1509C36.3393 30.901 37.4208 30.8974 37.8505 30.1509L40.1628 26.0506L31.0192 10.9133L43.3636 10.9351L39.3908 17.9558Z" fill="#FF0000"/>
</g>
</svg>
<defs>
<clipPath id="clip0_2073_16837">
<rect width="50.9799" height="30.7117" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 750 B

After

Width:  |  Height:  |  Size: 921 B

71
apps/web/src/assets/featured/freedom-press.svg
View File

@@ -1,33 +1,40 @@
<svg viewBox="0 0 562 86" class="logo " fill="none" aria-hidden="true" xmlns="http://www.w3.org/2000/svg">
<path d="M83.7452 0.571289H0V23.5009H83.7452V0.571289Z" fill="white"></path>
<path d="M114.652 0.570801H91.7227V23.5004H114.652V0.570801Z" fill="#DA0A08"></path>
<path d="M114.656 31.478H45.8633V54.4077H114.656V31.478Z" fill="white"></path>
<path d="M114.652 62.3843H0V85.3139H114.652V62.3843Z" fill="white"></path>
<path d="M156.232 5.55482H139.481V16.0221H153.739V20.7078H139.481V35.2636H134.297V0.869141H156.229L156.232 5.55482Z" fill="white"></path>
<path d="M174.874 0.869141C181.354 0.869141 185.541 5.05605 185.541 10.9395C185.541 15.8254 182.549 19.0183 178.664 20.0123L186.539 35.1652H180.459L173.17 20.7078H166.7V35.1652H161.516V0.869141H174.874ZM166.7 5.55482V16.3242H174.378C177.866 16.3242 180.262 14.3291 180.262 10.9395C180.262 7.54993 177.968 5.55482 174.48 5.55482H166.7Z" fill="white"></path>
<path d="M214.158 5.55482H197.407V15.5233H211.664V20.209H197.407V30.4796H214.155V35.1652H192.223V0.869141H214.155L214.158 5.55482Z" fill="white"></path>
<path d="M242.272 5.55531H225.506V15.5238H239.764V20.2095H225.506V30.48H242.254V35.1657H220.336V0.869629H242.268L242.272 5.55531Z" fill="white"></path>
<path d="M260.515 0.869141C264.804 0.869141 267.891 2.27414 270.287 5.25626C272.781 8.34726 272.879 12.6325 272.879 18.1191C272.879 23.6056 272.781 27.8908 270.287 30.9818C267.895 33.9745 264.804 35.369 260.515 35.369H248.453V0.869141H260.515ZM253.638 5.55482V30.4936H259.928C262.422 30.4936 264.414 29.8965 265.812 28.1999C267.508 26.3067 267.607 23.1138 267.607 18.0137C267.607 12.9135 267.508 9.73822 265.812 7.82741C264.407 6.13087 262.422 5.53375 259.928 5.53375L253.638 5.55482Z" fill="white"></path>
<path d="M299.6 4.05823C302.99 7.4478 303.088 10.8374 303.088 18.0169C303.088 25.1965 302.99 28.5861 299.6 31.9756C297.408 34.1674 294.514 35.4635 290.728 35.4635C286.941 35.4635 284.054 34.1674 281.855 31.9756C278.466 28.5861 278.367 25.1965 278.367 18.0169C278.367 10.8374 278.466 7.4478 281.855 4.05823C284.047 1.86643 286.938 0.570312 290.724 0.570312C294.511 0.570312 297.405 1.86643 299.6 4.05823ZM285.642 7.34945C283.945 9.14434 283.646 11.2378 283.646 18.0169C283.646 24.7961 283.945 26.8895 285.642 28.6844C286.937 30.0894 288.632 30.7919 290.728 30.7919C291.674 30.8036 292.613 30.6229 293.487 30.2606C294.362 29.8983 295.153 29.362 295.814 28.6844C297.514 26.8895 297.805 24.7961 297.805 18.0029C297.805 11.2097 297.507 9.02842 295.81 7.3354C294.515 5.9304 292.82 5.22789 290.724 5.22789C288.628 5.22789 286.934 5.93508 285.642 7.34945Z" fill="white"></path>
<path d="M340.177 35.1652H334.992V12.2356L327.019 28.9832H323.127L315.048 12.2356V35.1652H309.867V0.869141H315.052L325.122 22.2181L334.992 0.869141H340.177V35.1652Z" fill="white"></path>
<path d="M378.757 4.05823C382.146 7.4478 382.244 10.8374 382.244 18.0169C382.244 25.1965 382.146 28.5861 378.757 31.9756C376.565 34.1674 373.67 35.4635 369.884 35.4635C366.097 35.4635 363.21 34.1674 361.011 31.9756C357.622 28.5861 357.523 25.1965 357.523 18.0169C357.523 10.8374 357.622 7.4478 361.011 4.05823C363.196 1.86643 366.097 0.570312 369.87 0.570312C373.642 0.570312 376.565 1.86643 378.757 4.05823ZM364.798 7.34945C363.101 9.14434 362.803 11.2378 362.803 18.0169C362.803 24.7961 363.101 26.8895 364.798 28.6844C366.093 30.0894 367.788 30.7919 369.884 30.7919C370.83 30.8036 371.769 30.6229 372.643 30.2606C373.518 29.8983 374.309 29.362 374.97 28.6844C376.667 26.8895 376.965 24.7961 376.965 18.0169C376.965 11.2378 376.667 9.04247 374.97 7.34945C373.675 5.94445 371.98 5.24194 369.884 5.24194C367.788 5.24194 366.094 5.94445 364.801 7.34945H364.798Z" fill="#C0C7CF"></path>
<path d="M410.966 5.55482H394.212V16.0221H408.469V20.7078H394.212V35.2636H389.027V0.869141H410.966V5.55482Z" fill="#C0C7CF"></path>
<path d="M447.949 5.55531H438.465V35.2641H433.281V5.55531H423.797V0.869629H447.924L447.949 5.55531Z" fill="#C0C7CF"></path>
<path d="M477.355 35.1657H472.17V20.2095H458.212V35.1657H453.027V0.869629H458.212V15.5238H472.17V0.869629H477.355V35.1657Z" fill="#C0C7CF"></path>
<path d="M507.272 5.55482H490.524V15.5233H504.782V20.209H490.524V30.4796H507.272V35.1652H485.34V0.869141H507.272V5.55482Z" fill="#C0C7CF"></path>
<path d="M147.258 50.5181C153.932 50.5181 158.224 55.0035 158.224 60.9853C158.224 66.9671 153.935 71.3542 147.258 71.3542H139.481V84.9125H134.297V50.5181H147.258ZM139.481 55.2037V66.6686H146.959C150.648 66.6686 153.04 64.5611 153.04 60.9853C153.04 57.2972 150.648 55.2037 146.959 55.2037H139.481Z" fill="white"></path>
<path d="M176.967 50.5181C183.447 50.5181 187.634 54.705 187.634 60.5884C187.634 65.4743 184.642 68.6672 180.757 69.6612L188.625 84.8142H182.552L175.372 70.3567H168.891V84.8142H163.707V50.5181H176.967ZM168.888 55.2037V65.9696H176.566C180.054 65.9696 182.45 63.9745 182.45 60.5849C182.45 57.1953 180.058 55.2002 176.566 55.2002L168.888 55.2037Z" fill="white"></path>
<path d="M216.252 55.2037H199.515V65.2741H213.772V69.9598H199.515V80.2304H216.263V84.916H194.316V50.5181H216.248L216.252 55.2037Z" fill="white"></path>
<path d="M242.666 54.1078L239.374 57.399C237.267 55.4039 234.787 54.7084 231.798 54.7084C227.709 54.7084 225.616 56.9002 225.616 60.0931C225.616 61.3892 225.915 62.4851 226.912 63.2825C227.808 64.0798 228.805 64.5786 230.702 64.7788L234.791 65.3759C237.882 65.8747 239.677 66.5737 241.173 67.9681C242.968 69.6647 243.965 72.0567 243.965 75.0458C243.965 81.3262 238.879 85.1162 231.601 85.1162C226.417 85.1162 222.729 83.9184 219.438 80.6307L222.827 77.2412C225.321 79.735 228.212 80.5324 231.7 80.5324C236.185 80.5324 238.777 78.6391 238.777 75.2636C238.777 73.7673 238.377 72.4712 237.372 71.6738C236.477 70.8765 235.377 70.4761 233.582 70.1775L229.494 69.5804C226.701 69.18 224.51 68.2843 223.013 66.7879C221.317 65.2916 220.421 62.998 220.421 60.209C220.421 54.2378 224.808 50.1387 231.886 50.1387C236.586 50.2195 239.775 51.4172 242.666 54.1078Z" fill="white"></path>
<path d="M269.986 54.1078L266.695 57.399C264.587 55.4039 262.107 54.7084 259.118 54.7084C255.03 54.7084 252.936 56.9002 252.936 60.0931C252.936 61.3892 253.235 62.4851 254.232 63.2825C255.128 64.0798 256.126 64.5786 258.022 64.7788L262.111 65.3759C265.202 65.8747 266.997 66.5737 268.493 67.9681C270.288 69.6647 271.286 72.0567 271.286 75.0458C271.286 81.3262 266.2 85.1162 258.922 85.1162C253.737 85.1162 250.049 83.9184 246.758 80.6307L250.147 77.2412C252.641 79.735 255.532 80.5324 259.02 80.5324C263.505 80.5324 266.098 78.6391 266.098 75.2636C266.098 73.7673 265.697 72.4712 264.693 71.6738C263.797 70.8765 262.698 70.4761 260.903 70.1775L256.814 69.5804C254.022 69.18 251.83 68.2843 250.334 66.7879C248.637 65.2916 247.741 62.998 247.741 60.209C247.741 54.2378 252.128 50.1387 259.206 50.1387C263.902 50.2195 266.993 51.4172 269.986 54.1078Z" fill="white"></path>
<path d="M309.768 55.2037H293.016V65.671H307.274V70.3567H293.016V84.916H287.832V50.5181H309.764L309.768 55.2037Z" fill="white"></path>
<path d="M334.092 53.7076C337.482 57.0972 337.58 60.4868 337.58 67.6663C337.58 74.8459 337.482 78.2355 334.092 81.625C331.901 83.8168 329.006 85.113 325.22 85.113C321.433 85.113 318.546 83.8168 316.347 81.625C312.958 78.2355 312.859 74.8459 312.859 67.6663C312.859 60.4868 312.958 57.0972 316.347 53.7076C318.539 51.5158 321.433 50.2197 325.22 50.2197C329.006 50.2197 331.901 51.5158 334.092 53.7076ZM320.137 56.9918C318.441 58.7867 318.142 60.8802 318.142 67.6593C318.142 74.4384 318.441 76.5319 320.137 78.3268C321.432 79.7318 323.128 80.4343 325.223 80.4343C326.17 80.446 327.109 80.2652 327.983 79.9029C328.857 79.5407 329.649 79.0044 330.309 78.3268C332.006 76.5319 332.305 74.4384 332.305 67.6593C332.305 60.8802 332.006 58.6849 330.309 56.9918C329.015 55.5868 327.319 54.8843 325.223 54.8843C323.128 54.8843 321.432 55.5868 320.137 56.9918Z" fill="white"></path>
<path d="M368.483 73.251C368.483 80.3287 363.099 85.1162 356.119 85.1162C349.14 85.1162 343.871 80.3287 343.871 73.251V50.5181H349.056V73.0508C349.056 77.6381 351.848 80.5289 356.133 80.5289C360.418 80.5289 363.313 77.6381 363.313 73.0508V50.5181H368.497V73.251H368.483Z" fill="white"></path>
<path d="M401.883 84.8142H397.099L381.247 60.6868V84.8142H376.062V50.5181H380.847L396.698 74.6455V50.5181H401.883V84.8142Z" fill="white"></path>
<path d="M421.933 50.5181C426.222 50.5181 429.309 51.9231 431.705 54.9052C434.199 57.9962 434.297 62.2814 434.297 67.768C434.297 73.2545 434.199 77.5398 431.705 80.6308C429.313 83.6234 426.222 85.0179 421.933 85.0179H409.871V50.5181H421.933ZM415.056 55.2037V80.2268H421.336C423.83 80.2268 425.821 79.6297 427.219 77.9332C428.916 76.0399 429.014 72.8471 429.014 67.7469C429.014 62.6467 428.916 59.4714 427.219 57.5606C425.814 55.8641 423.83 55.267 421.336 55.267H415.056V55.2037Z" fill="white"></path>
<path d="M465.896 84.8144H460.314L457.922 77.9369H444.364L441.972 84.8144H436.391L448.951 50.4199H453.117L465.896 84.8144ZM445.857 73.5498H456.426L451.157 58.295L445.857 73.5498Z" fill="white"></path>
<path d="M487.73 55.2037H478.246V84.916H473.062V55.2037H463.578V50.5181H487.706L487.73 55.2037Z" fill="white"></path>
<path d="M497.895 84.8142H492.711V50.5181H497.895V84.8142Z" fill="white"></path>
<path d="M525.913 53.7076C529.302 57.0972 529.401 60.4868 529.401 67.6663C529.401 74.8459 529.302 78.2355 525.913 81.625C523.721 83.8168 520.827 85.113 517.04 85.113C513.254 85.113 510.366 83.8168 508.168 81.625C504.778 78.2355 504.68 74.8459 504.68 67.6663C504.68 60.4868 504.778 57.0972 508.168 53.7076C510.359 51.5158 513.254 50.2197 517.04 50.2197C520.827 50.2197 523.717 51.5158 525.913 53.7076ZM511.863 56.9989C510.166 58.7938 509.868 60.8872 509.868 67.6663C509.868 74.4455 510.166 76.5389 511.863 78.3338C513.158 79.7388 514.853 80.4413 516.949 80.4413C517.895 80.453 518.834 80.2723 519.708 79.91C520.583 79.5477 521.374 79.0114 522.035 78.3338C523.731 76.5389 524.03 74.4455 524.03 67.6663C524.03 60.8872 523.731 58.6919 522.035 56.9989C520.74 55.5939 519.045 54.8914 516.949 54.8914C516.001 54.8743 515.06 55.0519 514.184 55.4132C513.308 55.7745 512.516 56.3118 511.856 56.9918L511.863 56.9989Z" fill="white"></path>
<path d="M562 84.8142H557.216L541.364 60.6868V84.8142H536.18V50.5181H540.964L556.816 74.6455V50.5181H562V84.8142Z" fill="white"></path>
<svg width="164" height="25" viewBox="0 0 164 25" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_2073_16847)">
<path d="M24.4967 0.166077H0.0585938V6.83166H24.4967V0.166077Z" fill="#181818"/>
<path d="M33.5163 0.165955H26.8252V6.83154H33.5163V0.165955Z" fill="#DA0A08"/>
<path d="M33.5171 9.15057H13.4424V15.8162H33.5171V9.15057Z" fill="#181818"/>
<path d="M33.5158 18.1349H0.0585938V24.8005H33.5158V18.1349Z" fill="#181818"/>
<path d="M45.65 1.6148H40.7618V4.65762H44.9225V6.01974H40.7618V10.2511H39.249V0.252686H45.6491L45.65 1.6148Z" fill="#181818"/>
<path d="M51.0904 0.252686C52.9814 0.252686 54.2032 1.46981 54.2032 3.18012C54.2032 4.60044 53.3301 5.5286 52.1964 5.81756L54.4945 10.2225H52.7202L50.5932 6.01974H48.7051V10.2225H47.1924V0.252686H51.0904ZM48.7051 1.6148V4.74544H50.9457C51.9636 4.74544 52.6627 4.16546 52.6627 3.18012C52.6627 2.19478 51.9933 1.6148 50.9755 1.6148H48.7051Z" fill="#181818"/>
<path d="M62.5543 1.61474H57.6661V4.51255H61.8265V5.87468H57.6661V8.86032H62.5534V10.2224H56.1533V0.252625H62.5534L62.5543 1.61474Z" fill="#181818"/>
<path d="M70.7577 1.61492H65.8651V4.51274H70.0258V5.87486H65.8651V8.86047H70.7524V10.2226H64.3564V0.252808H70.7565L70.7577 1.61492Z" fill="#181818"/>
<path d="M76.0814 0.252686C77.333 0.252686 78.2338 0.661115 78.933 1.52801C79.6608 2.42656 79.6894 3.67227 79.6894 5.26721C79.6894 6.86212 79.6608 8.10782 78.933 9.00637C78.235 9.87634 77.333 10.2817 76.0814 10.2817H72.5615V0.252686H76.0814ZM74.0746 1.6148V8.86445H75.9101C76.6379 8.86445 77.2192 8.69087 77.6271 8.19767C78.1221 7.64732 78.1509 6.71916 78.1509 5.23657C78.1509 3.75395 78.1221 2.83091 77.6271 2.27544C77.2171 1.78226 76.6379 1.60868 75.9101 1.60868L74.0746 1.6148Z" fill="#181818"/>
<path d="M87.4871 1.1797C88.4764 2.16504 88.505 3.15039 88.505 5.23745C88.505 7.32454 88.4764 8.30989 87.4871 9.29521C86.8475 9.93236 86.0029 10.3091 84.8981 10.3091C83.793 10.3091 82.9506 9.93236 82.3089 9.29521C81.3199 8.30989 81.291 7.32454 81.291 5.23745C81.291 3.15039 81.3199 2.16504 82.3089 1.1797C82.9485 0.54255 83.7922 0.165771 84.897 0.165771C86.0021 0.165771 86.8466 0.54255 87.4871 1.1797ZM83.414 2.13645C82.9188 2.65822 82.8315 3.26678 82.8315 5.23745C82.8315 7.20815 82.9188 7.81669 83.414 8.33847C83.7919 8.7469 84.2865 8.95111 84.8981 8.95111C85.1742 8.95451 85.4482 8.90198 85.7033 8.79667C85.9586 8.69135 86.1894 8.53544 86.3823 8.33847C86.8784 7.81669 86.9633 7.20815 86.9633 5.23338C86.9633 3.25862 86.8764 2.62452 86.3811 2.13237C86.0032 1.72394 85.5086 1.51972 84.897 1.51972C84.2853 1.51972 83.791 1.7253 83.414 2.13645Z" fill="#181818"/>
<path d="M99.3273 10.2225H97.8143V3.55689L95.4876 8.42538H94.3519L91.9943 3.55689V10.2225H90.4824V0.252686H91.9955L94.9341 6.45878L97.8143 0.252686H99.3273V10.2225Z" fill="#181818"/>
<path d="M110.586 1.1797C111.575 2.16504 111.604 3.15039 111.604 5.23745C111.604 7.32454 111.575 8.30989 110.586 9.29521C109.946 9.93236 109.102 10.3091 107.997 10.3091C106.892 10.3091 106.049 9.93236 105.407 9.29521C104.419 8.30989 104.39 7.32454 104.39 5.23745C104.39 3.15039 104.419 2.16504 105.407 1.1797C106.045 0.54255 106.892 0.165771 107.993 0.165771C109.093 0.165771 109.946 0.54255 110.586 1.1797ZM106.513 2.13645C106.017 2.65822 105.93 3.26678 105.93 5.23745C105.93 7.20815 106.017 7.81669 106.513 8.33847C106.891 8.7469 107.385 8.95111 107.997 8.95111C108.273 8.95451 108.547 8.90198 108.802 8.79667C109.057 8.69135 109.288 8.53544 109.481 8.33847C109.976 7.81669 110.063 7.20815 110.063 5.23745C110.063 3.26678 109.976 2.62861 109.481 2.13645C109.103 1.72802 108.608 1.5238 107.997 1.5238C107.385 1.5238 106.891 1.72802 106.513 2.13645H106.513Z" fill="#6C7C8F"/>
<path d="M119.985 1.6148H115.096V4.65762H119.256V6.01974H115.096V10.2511H113.583V0.252686H119.985V1.6148Z" fill="#6C7C8F"/>
<path d="M130.776 1.61486H128.009V10.2511H126.496V1.61486H123.729V0.252747H130.769L130.776 1.61486Z" fill="#6C7C8F"/>
<path d="M139.358 10.2225H137.845V5.8748H133.772V10.2225H132.259V0.252747H133.772V4.51268H137.845V0.252747H139.358V10.2225Z" fill="#6C7C8F"/>
<path d="M148.09 1.61474H143.202V4.51255H147.363V5.87468H143.202V8.86032H148.09V10.2224H141.689V0.252625H148.09V1.61474Z" fill="#6C7C8F"/>
<path d="M43.0312 14.6855C44.9788 14.6855 46.2313 15.9894 46.2313 17.7283C46.2313 19.4672 44.9797 20.7425 43.0312 20.7425H40.7618V24.6839H39.249V14.6855H43.0312ZM40.7618 16.0476V19.3804H42.944C44.0205 19.3804 44.7185 18.7678 44.7185 17.7283C44.7185 16.6562 44.0205 16.0476 42.944 16.0476H40.7618Z" fill="#181818"/>
<path d="M51.7005 14.6855C53.5915 14.6855 54.8133 15.9027 54.8133 17.613C54.8133 19.0333 53.9402 19.9614 52.8065 20.2504L55.1025 24.6553H53.3303L51.2351 20.4526H49.3438V24.6553H47.8311V14.6855H51.7005ZM49.3429 16.0476V19.1773H51.5835C52.6014 19.1773 53.3005 18.5973 53.3005 17.6119C53.3005 16.6266 52.6025 16.0466 51.5835 16.0466L49.3429 16.0476Z" fill="#181818"/>
<path d="M63.1649 16.0476H58.2808V18.975H62.4412V20.3371H58.2808V23.3228H63.1681V24.6849H56.7637V14.6855H63.1638L63.1649 16.0476Z" fill="#181818"/>
<path d="M70.873 15.729L69.9123 16.6857C69.2975 16.1058 68.5738 15.9036 67.7016 15.9036C66.5083 15.9036 65.8976 16.5407 65.8976 17.4689C65.8976 17.8457 65.9848 18.1643 66.2758 18.3961C66.5372 18.6278 66.8282 18.7728 67.3817 18.831L68.575 19.0046C69.477 19.1496 70.0008 19.3528 70.4373 19.7582C70.9611 20.2514 71.2521 20.9467 71.2521 21.8156C71.2521 23.6413 69.7679 24.7431 67.6441 24.7431C66.1313 24.7431 65.0551 24.3949 64.0947 23.4392L65.0837 22.4538C65.8115 23.1788 66.6551 23.4106 67.673 23.4106C68.9817 23.4106 69.7381 22.8602 69.7381 21.8789C69.7381 21.444 69.6214 21.0672 69.3281 20.8354C69.067 20.6036 68.746 20.4872 68.2222 20.4004L67.0292 20.2269C66.2142 20.1105 65.5748 19.8501 65.138 19.4151C64.643 18.9801 64.3816 18.3134 64.3816 17.5026C64.3816 15.7668 65.6618 14.5752 67.7272 14.5752C69.0988 14.5987 70.0294 14.9469 70.873 15.729Z" fill="#181818"/>
<path d="M78.8447 15.729L77.8843 16.6857C77.2692 16.1058 76.5455 15.9036 75.6732 15.9036C74.4803 15.9036 73.8692 16.5407 73.8692 17.4689C73.8692 17.8457 73.9565 18.1643 74.2474 18.3961C74.5089 18.6278 74.8001 18.7728 75.3534 18.831L76.5466 19.0046C77.4486 19.1496 77.9725 19.3528 78.409 19.7582C78.9328 20.2514 79.224 20.9467 79.224 21.8156C79.224 23.6413 77.7399 24.7431 75.616 24.7431C74.103 24.7431 73.0268 24.3949 72.0664 23.4392L73.0554 22.4538C73.7832 23.1788 74.6268 23.4106 75.6446 23.4106C76.9534 23.4106 77.7101 22.8602 77.7101 21.8789C77.7101 21.444 77.5931 21.0672 77.3001 20.8354C77.0386 20.6036 76.7179 20.4872 76.1941 20.4004L75.0009 20.2269C74.1862 20.1105 73.5465 19.8501 73.1099 19.4151C72.6147 18.9801 72.3533 18.3134 72.3533 17.5026C72.3533 15.7668 73.6335 14.5752 75.6989 14.5752C77.0693 14.5987 77.9713 14.9469 78.8447 15.729Z" fill="#181818"/>
<path d="M90.454 16.0476H85.5655V19.0904H89.7262V20.4525H85.5655V24.6849H84.0527V14.6855H90.4528L90.454 16.0476Z" fill="#181818"/>
<path d="M97.5526 15.6127C98.5418 16.598 98.5704 17.5834 98.5704 19.6704C98.5704 21.7575 98.5418 22.7429 97.5526 23.7282C96.9132 24.3654 96.0684 24.7422 94.9636 24.7422C93.8585 24.7422 93.016 24.3654 92.3743 23.7282C91.3853 22.7429 91.3564 21.7575 91.3564 19.6704C91.3564 17.5834 91.3853 16.598 92.3743 15.6127C93.0139 14.9755 93.8585 14.5988 94.9636 14.5988C96.0684 14.5988 96.9132 14.9755 97.5526 15.6127ZM93.4803 16.5674C92.9854 17.0892 92.8981 17.6977 92.8981 19.6684C92.8981 21.6391 92.9854 22.2476 93.4803 22.7694C93.8582 23.1779 94.3531 23.3821 94.9644 23.3821C95.2408 23.3855 95.5148 23.3329 95.7699 23.2276C96.0249 23.1223 96.256 22.9664 96.4486 22.7694C96.9438 22.2476 97.0311 21.6391 97.0311 19.6684C97.0311 17.6977 96.9438 17.0596 96.4486 16.5674C96.071 16.159 95.5761 15.9547 94.9644 15.9547C94.3531 15.9547 93.8582 16.159 93.4803 16.5674Z" fill="#181818"/>
<path d="M107.587 21.2939C107.587 23.3514 106.016 24.7431 103.979 24.7431C101.943 24.7431 100.405 23.3514 100.405 21.2939V14.6855H101.918V21.2358C101.918 22.5693 102.733 23.4096 103.984 23.4096C105.234 23.4096 106.079 22.5693 106.079 21.2358V14.6855H107.592V21.2939H107.587Z" fill="#181818"/>
<path d="M117.335 24.6553H115.939L111.313 17.6416V24.6553H109.8V14.6855H111.196L115.822 21.6993V14.6855H117.335V24.6553Z" fill="#181818"/>
<path d="M123.186 14.6855C124.437 14.6855 125.338 15.094 126.037 15.9609C126.765 16.8594 126.794 18.1051 126.794 19.7001C126.794 21.295 126.765 22.5407 126.037 23.4392C125.339 24.3092 124.437 24.7146 123.186 24.7146H119.666V14.6855H123.186ZM121.179 16.0476V23.3218H123.012C123.739 23.3218 124.32 23.1482 124.728 22.655C125.224 22.1047 125.252 21.1765 125.252 19.6939C125.252 18.2113 125.224 17.2882 124.728 16.7328C124.318 16.2396 123.739 16.066 123.012 16.066H121.179V16.0476Z" fill="#181818"/>
<path d="M136.014 24.6553H134.385L133.687 22.6561H129.731L129.033 24.6553H127.404L131.069 14.6569H132.285L136.014 24.6553ZM130.167 21.3807H133.251L131.713 16.9462L130.167 21.3807Z" fill="#181818"/>
<path d="M142.386 16.0476H139.618V24.6849H138.105V16.0476H135.338V14.6855H142.379L142.386 16.0476Z" fill="#181818"/>
<path d="M145.352 24.6553H143.839V14.6855H145.352V24.6553Z" fill="#181818"/>
<path d="M153.528 15.6127C154.517 16.598 154.546 17.5834 154.546 19.6704C154.546 21.7575 154.517 22.7429 153.528 23.7282C152.888 24.3654 152.044 24.7422 150.939 24.7422C149.834 24.7422 148.991 24.3654 148.35 23.7282C147.361 22.7429 147.332 21.7575 147.332 19.6704C147.332 17.5834 147.361 16.598 148.35 15.6127C148.989 14.9755 149.834 14.5988 150.939 14.5988C152.044 14.5988 152.887 14.9755 153.528 15.6127ZM149.428 16.5695C148.933 17.0912 148.846 17.6998 148.846 19.6704C148.846 21.6411 148.933 22.2497 149.428 22.7715C149.806 23.1799 150.301 23.3841 150.912 23.3841C151.188 23.3875 151.462 23.335 151.717 23.2297C151.973 23.1243 152.204 22.9684 152.396 22.7715C152.891 22.2497 152.979 21.6411 152.979 19.6704C152.979 17.6998 152.891 17.0616 152.396 16.5695C152.019 16.161 151.524 15.9568 150.912 15.9568C150.636 15.9518 150.361 16.0035 150.105 16.1085C149.85 16.2135 149.619 16.3697 149.426 16.5674L149.428 16.5695Z" fill="#181818"/>
<path d="M164.058 24.6553H162.662L158.036 17.6416V24.6553H156.523V14.6855H157.919L162.545 21.6993V14.6855H164.058V24.6553Z" fill="#181818"/>
</g>
<defs>
<clipPath id="clip0_2073_16847">
<rect width="164" height="25" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 10 KiB

13
apps/web/src/assets/featured/privacy-guides.svg
View File

@@ -1 +1,12 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="100%" version="1.1" viewBox="0 0 33 34" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2"><path d="M4.581,4.337c-0.113,0.379 -0.049,0.822 0.077,1.707l1.604,11.224c0.277,1.939 0.415,2.909 0.782,3.775c0.325,0.768 0.781,1.474 1.346,2.087c0.638,0.691 1.465,1.217 3.117,2.269l2.349,1.495c1.126,0.716 1.69,1.075 2.295,1.214c0.465,0.108 0.947,0.121 1.416,0.042c-0.388,-0.887 -0.603,-1.867 -0.603,-2.897c0,-3.996 3.24,-7.236 7.236,-7.236c1.166,0 2.268,0.276 3.243,0.766c0.069,-0.432 0.14,-0.929 0.223,-1.514l0,-0.001l1.604,-11.224c0.126,-0.885 0.19,-1.328 0.077,-1.707c-0.099,-0.334 -0.292,-0.632 -0.557,-0.859c-0.3,-0.257 -0.73,-0.38 -1.59,-0.626l-9.441,-2.697c-0.296,-0.085 -0.444,-0.127 -0.594,-0.144c-0.134,-0.015 -0.268,-0.015 -0.402,0c-0.15,0.017 -0.298,0.059 -0.594,0.144l-9.441,2.697c-0.86,0.246 -1.29,0.369 -1.59,0.626c-0.265,0.227 -0.458,0.525 -0.557,0.859Z" style="fill:#ffd06f"/><path d="M13.246,2.719c0.066,-0.007 0.134,-0.007 0.201,0c0.057,0.007 0.122,0.022 0.446,0.114l9.44,2.698c0.444,0.126 0.727,0.208 0.94,0.287c0.202,0.075 0.274,0.124 0.311,0.156c0.132,0.113 0.229,0.262 0.278,0.429c0.014,0.047 0.03,0.133 0.016,0.348c-0.015,0.226 -0.056,0.518 -0.122,0.974l-1.346,9.426c-4.125,0.397 -7.351,3.873 -7.351,8.102c0,0.835 0.126,1.641 0.36,2.4l-0.451,0.286c-1.183,0.753 -1.594,1.001 -2.012,1.097c-0.401,0.092 -0.818,0.092 -1.22,0c-0.417,-0.096 -0.829,-0.344 -2.012,-1.097l-2.349,-1.494c-1.693,-1.078 -2.398,-1.535 -2.938,-2.12c-0.495,-0.536 -0.894,-1.153 -1.178,-1.825c-0.31,-0.733 -0.436,-1.564 -0.72,-3.551l-1.603,-11.224c-0.066,-0.456 -0.107,-0.748 -0.121,-0.974c-0.015,-0.215 0.001,-0.301 0.015,-0.348c0.05,-0.167 0.146,-0.316 0.279,-0.429c0.036,-0.032 0.109,-0.081 0.31,-0.156c0.213,-0.079 0.496,-0.161 0.94,-0.287l9.44,-2.698c0.324,-0.092 0.389,-0.107 0.447,-0.114Zm13.306,5.231l-1.318,9.228c4.007,0.508 7.106,3.93 7.106,8.075c0,4.496 -3.644,8.141 -8.14,8.141c-3.01,0 -5.639,-1.634 -7.048,-4.064l-0.212,0.136l-0.135,0.085c-0.996,0.634 -1.683,1.072 -2.443,1.248c-0.668,0.154 -1.364,0.154 -2.032,0c-0.76,-0.176 -1.447,-0.614 -2.443,-1.248l-0.134,-0.085l-2.466,-1.57l0,0c-1.541,-0.98 -2.461,-1.565 -3.179,-2.344c-0.637,-0.689 -1.149,-1.483 -1.515,-2.347c-0.413,-0.976 -0.567,-2.054 -0.825,-3.863l-1.628,-11.392c-0.059,-0.416 -0.111,-0.778 -0.131,-1.081c-0.021,-0.323 -0.012,-0.648 0.087,-0.98c0.148,-0.501 0.439,-0.949 0.835,-1.289c0.264,-0.226 0.557,-0.366 0.86,-0.478c0.285,-0.106 0.636,-0.206 1.04,-0.322l0.031,-0.009l9.44,-2.697l0.05,-0.014c0.247,-0.071 0.465,-0.133 0.693,-0.159c0.2,-0.022 0.402,-0.022 0.603,0c0.227,0.026 0.445,0.088 0.692,0.159l0.05,0.014l9.471,2.706c0.404,0.116 0.755,0.216 1.04,0.322c0.304,0.112 0.596,0.252 0.86,0.478c0.397,0.34 0.687,0.788 0.835,1.289c0.099,0.332 0.108,0.657 0.087,0.98c-0.02,0.303 -0.072,0.665 -0.131,1.08l0,0.001Zm-2.352,10.972c-3.497,0 -6.332,2.835 -6.332,6.331c0,3.497 2.835,6.332 6.332,6.332c3.497,0 6.331,-2.835 6.331,-6.332c0,-3.496 -2.834,-6.331 -6.331,-6.331Zm4.313,4.197c0.319,-0.384 0.268,-0.954 -0.116,-1.274c-0.384,-0.32 -0.954,-0.268 -1.274,0.116l-3.888,4.666l-2.013,-2.013c-0.354,-0.353 -0.926,-0.353 -1.28,0c-0.353,0.353 -0.353,0.926 0,1.279l2.714,2.713c0.18,0.18 0.427,0.276 0.68,0.264c0.254,-0.011 0.492,-0.129 0.654,-0.324l4.523,-5.427Zm-19.689,-10.529c0,-2.497 2.024,-4.522 4.522,-4.522c2.498,0 4.522,2.025 4.522,4.522c0,1.48 -0.71,2.794 -1.809,3.619l0,3.617c0,1.499 -1.214,2.714 -2.713,2.714c-1.499,0 -2.713,-1.215 -2.713,-2.714l0,-3.617c-1.099,-0.825 -1.809,-2.139 -1.809,-3.619Zm5.426,4.523l-1.808,0l0,2.713c0,0.5 0.405,0.905 0.904,0.905c0.5,0 0.904,-0.405 0.904,-0.905l0,-2.713Zm-0.904,-1.809c1.499,0 2.713,-1.215 2.713,-2.714c0,-1.498 -1.214,-2.713 -2.713,-2.713c-1.499,0 -2.713,1.215 -2.713,2.713c0,1.499 1.214,2.714 2.713,2.714Z" style="fill:#28323f"/></svg>
<svg width="29" height="30" viewBox="0 0 29 30" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_2073_16881)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M4.08957 3.8268C3.99027 4.16121 4.04651 4.55209 4.15724 5.33298L5.56682 15.2365C5.81024 16.9474 5.93151 17.8033 6.25403 18.5674C6.53963 19.245 6.94036 19.868 7.43688 20.4089C7.99754 21.0186 8.7243 21.4827 10.1761 22.4109L12.2403 23.73C13.2298 24.3618 13.7255 24.6786 14.2571 24.8012C14.6658 24.8965 15.0894 24.908 15.5015 24.8383C15.1605 24.0556 14.9716 23.1909 14.9716 22.2821C14.9716 18.7562 17.8189 15.8974 21.3305 15.8974C22.3552 15.8974 23.3236 16.1409 24.1804 16.5733C24.2411 16.1921 24.3035 15.7536 24.3764 15.2374L25.786 5.33298C25.8967 4.55209 25.9529 4.16121 25.8536 3.8268C25.7666 3.5321 25.597 3.26915 25.3642 3.06886C25.1005 2.8421 24.7226 2.73357 23.9669 2.51651L15.6702 0.136802C15.4101 0.0618022 15.2801 0.0247434 15.1482 0.00974336C15.0305 -0.00349193 14.9127 -0.00349193 14.795 0.00974336C14.6632 0.0247434 14.5331 0.0618022 14.273 0.136802L5.97633 2.51651C5.22057 2.73357 4.84269 2.8421 4.57906 3.06886C4.34618 3.26915 4.17657 3.5321 4.08957 3.8268Z" fill="#FFD06F"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.7051 2.39913C11.7631 2.39295 11.8229 2.39295 11.8818 2.39913C11.9318 2.4053 11.989 2.41854 12.2737 2.49971L20.5695 4.8803C20.9596 4.99148 21.2083 5.06383 21.3955 5.13354C21.573 5.19971 21.6363 5.24295 21.6688 5.27118C21.7848 5.37089 21.8701 5.50236 21.9131 5.64971C21.9254 5.69118 21.9395 5.76707 21.9272 5.95677C21.914 6.15619 21.878 6.41383 21.82 6.81619L20.6371 15.1332C17.0121 15.4835 14.1772 18.5506 14.1772 22.2821C14.1772 23.0188 14.2879 23.73 14.4935 24.3997L14.0972 24.6521C13.0576 25.3165 12.6964 25.5353 12.3291 25.62C11.9767 25.7012 11.6102 25.7012 11.2569 25.62C10.8905 25.5353 10.5284 25.3165 9.48882 24.6521L7.42454 23.3338C5.93675 22.3827 5.31721 21.9794 4.84266 21.4632C4.40766 20.9903 4.05703 20.4459 3.80745 19.853C3.53503 19.2062 3.4243 18.473 3.17472 16.7197L1.76603 6.81619C1.70803 6.41383 1.67199 6.15619 1.65969 5.95677C1.64651 5.76707 1.66057 5.69118 1.67287 5.64971C1.71681 5.50236 1.80118 5.37089 1.91806 5.27118C1.94969 5.24295 2.01384 5.19971 2.19048 5.13354C2.37766 5.06383 2.62636 4.99148 3.01654 4.8803L11.3123 2.49971C11.597 2.41854 11.6542 2.4053 11.7051 2.39913ZM23.3983 7.01471L22.24 15.1571C25.7613 15.6053 28.4847 18.6247 28.4847 22.2821C28.4847 26.2491 25.2824 29.4653 21.3314 29.4653C18.6862 29.4653 16.3759 28.0235 15.1377 25.8794L14.9514 25.9994L14.8327 26.0744C13.9575 26.6338 13.3537 27.0203 12.6858 27.1756C12.0988 27.3115 11.4872 27.3115 10.9001 27.1756C10.2323 27.0203 9.62854 26.6338 8.75327 26.0744L8.63551 25.9994L6.46842 24.6141C5.11421 23.7494 4.30572 23.2332 3.67475 22.5459C3.11496 21.938 2.66503 21.2374 2.34339 20.475C1.98045 19.6138 1.84512 18.6627 1.61839 17.0665L0.187722 7.01471C0.135873 6.64766 0.0901761 6.32824 0.0726003 6.06089C0.0541458 5.77589 0.0620549 5.48913 0.149055 5.19619C0.279116 4.75413 0.534843 4.35883 0.882843 4.05883C1.11484 3.85942 1.37233 3.73589 1.6386 3.63707C1.88906 3.54354 2.19751 3.4553 2.55254 3.35295L2.57978 3.34501L10.8755 0.965302L10.9195 0.952949C11.1365 0.890302 11.3281 0.835596 11.5285 0.812655C11.7042 0.793243 11.8818 0.793243 12.0584 0.812655C12.2579 0.835596 12.4495 0.890302 12.6665 0.952949L12.7105 0.965302L21.0335 3.35295C21.3885 3.4553 21.6969 3.54354 21.9474 3.63707C22.2145 3.73589 22.4712 3.85942 22.7032 4.05883C23.052 4.35883 23.3069 4.75413 23.4369 5.19619C23.5239 5.48913 23.5319 5.77589 23.5134 6.06089C23.4958 6.32824 23.4501 6.64854 23.3983 7.01471ZM21.3314 16.6959C18.2582 16.6959 15.7669 19.1974 15.7669 22.2821C15.7669 25.3677 18.2582 27.8691 21.3314 27.8691C24.4045 27.8691 26.895 25.3677 26.895 22.2821C26.895 19.1974 24.4045 16.6959 21.3314 16.6959ZM25.1216 20.3991C25.4019 20.0603 25.3571 19.5574 25.0196 19.275C24.6822 18.9927 24.1813 19.0385 23.9001 19.3774L20.4833 23.4944L18.7143 21.7183C18.4032 21.4068 17.9006 21.4068 17.5895 21.7183C17.2793 22.0297 17.2793 22.5353 17.5895 22.8468L19.9745 25.2406C20.1327 25.3994 20.3498 25.4841 20.5721 25.4735C20.7953 25.4638 21.0045 25.3597 21.1468 25.1877L25.1216 20.3991ZM7.81912 11.1088C7.81912 8.9056 9.59778 7.11883 11.793 7.11883C13.9882 7.11883 15.7669 8.9056 15.7669 11.1088C15.7669 12.4147 15.1429 13.5741 14.1772 14.3021V17.4935C14.1772 18.8162 13.1103 19.8883 11.793 19.8883C10.4757 19.8883 9.40885 18.8162 9.40885 17.4935V14.3021C8.44306 13.5741 7.81912 12.4147 7.81912 11.1088ZM12.5874 15.0997H10.9986V17.4935C10.9986 17.9347 11.3545 18.2921 11.793 18.2921C12.2324 18.2921 12.5874 17.9347 12.5874 17.4935V15.0997ZM11.793 13.5035C13.1103 13.5035 14.1772 12.4315 14.1772 11.1088C14.1772 9.78707 13.1103 8.71501 11.793 8.71501C10.4757 8.71501 9.40885 9.78707 9.40885 11.1088C9.40885 12.4315 10.4757 13.5035 11.793 13.5035Z" fill="#475362"/>
</g>
<defs>
<clipPath id="clip0_2073_16881">
<rect width="29" height="30" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.8 KiB

After

Width:  |  Height:  |  Size: 4.8 KiB

36
apps/web/src/assets/featured/techlore.svg
View File

@@ -1 +1,35 @@
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 40 40"><g clip-path="url(#a)"><path fill="#EE5128" d="M19.998 39.995c11.044 0 19.997-8.953 19.997-19.997C39.995 8.953 31.042 0 19.998 0 8.953 0 0 8.953 0 19.998c0 11.044 8.953 19.997 19.998 19.997Z"></path><mask id="b" width="40" height="40" x="0" y="0" maskUnits="userSpaceOnUse" style="mask-type:luminance"><path fill="#fff" d="M19.998 39.995c11.044 0 19.997-8.953 19.997-19.997C39.995 8.953 31.042 0 19.998 0 8.953 0 0 8.953 0 19.998c0 11.044 8.953 19.997 19.998 19.997Z"></path></mask><g fill-rule="evenodd" clip-rule="evenodd" mask="url(#b)"><path fill="#FAB314" d="M-2.39 42.446 42.447-2.389l18.566 18.565-44.836 44.836-18.565-18.566Z"></path><path fill="#7CBB41" d="M19.998-2.39v19.072l.061 3.316L37.175 2.882l-9.748-5.271h-7.43Z"></path><path fill="#279AD5" d="M45.429 19.998h-25.37L38.34 1.717l7.09 18.28Z"></path></g><path fill="#000" d="M19.998 37.631c9.738 0 17.633-7.895 17.633-17.633 0-9.739-7.895-17.634-17.633-17.634-9.739 0-17.634 7.895-17.634 17.634 0 9.738 7.895 17.633 17.634 17.633Z"></path><mask id="c" width="36" height="36" x="2" y="2" maskUnits="userSpaceOnUse" style="mask-type:luminance"><path fill="#fff" d="M19.998 37.631c9.738 0 17.633-7.895 17.633-17.633 0-9.739-7.895-17.634-17.633-17.634-9.739 0-17.634 7.895-17.634 17.634 0 9.738 7.895 17.633 17.634 17.633Z"></path></mask><g mask="url(#c)"><path fill="#fff" d="M19.998 85.794c16.843 0 30.496-13.654 30.496-30.497 0-16.842-13.653-30.496-30.496-30.496C3.155 24.8-10.5 38.455-10.5 55.297c0 16.843 13.654 30.497 30.497 30.497Z"></path><path fill="#FAB314" fill-rule="evenodd" d="M20.218 32.033a.469.469 0 0 1-.44 0c-.618-.342-2.417-1.457-3.878-3.54-1.09-1.552-1.584-3.308-1.785-4.238a.643.643 0 0 1 .508-.768c.7-.137 1.864-.42 2.845-.916a9.381 9.381 0 0 0 2.204-1.587.469.469 0 0 1 .651 0 9.38 9.38 0 0 0 2.204 1.587c.981.497 2.145.779 2.845.916a.646.646 0 0 1 .508.768c-.2.93-.695 2.686-1.784 4.238-1.462 2.083-3.26 3.198-3.878 3.54Z" clip-rule="evenodd"></path><path fill="#fff" fill-rule="evenodd" d="M19.589 10.517a.47.47 0 0 0 .818 0c.775-1.387 1.998-2.43 3.532-2.84 3.355-.9 6.936 1.565 7.99 5.5 1.055 3.935-.814 7.86-4.17 8.759-2.846.762-5.854-.895-7.345-3.816a.468.468 0 0 0-.833 0c-1.49 2.921-4.499 4.578-7.345 3.816-3.356-.9-5.224-4.824-4.17-8.759 1.055-3.935 4.635-6.4 7.99-5.5 1.534.41 2.758 1.453 3.533 2.84Z" clip-rule="evenodd"></path><path class="logo-eye logo-eye--left" fill="#000" d="M16.42 18.093a1.951 1.951 0 1 0 0-3.902 1.951 1.951 0 0 0 0 3.902Z"></path><path class="logo-eye logo-eye--right" fill="#000" d="M23.575 18.093a1.951 1.951 0 1 0 0-3.902 1.951 1.951 0 0 0 0 3.902Z"></path></g></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h40v40H0z"></path></clipPath></defs></svg>
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_2073_16887)">
<mask id="mask0_2073_16887" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="31" height="30">
<path d="M0.0615234 0H30.0615V30H0.0615234V0Z" fill="white"/>
</mask>
<g mask="url(#mask0_2073_16887)">
<path d="M15.06 29.9962C23.343 29.9962 30.0578 23.2815 30.0578 14.9985C30.0578 6.71475 23.343 0 15.06 0C6.77627 0 0.0615234 6.71475 0.0615234 14.9985C0.0615234 23.2815 6.77627 29.9962 15.06 29.9962Z" fill="#EE5128"/>
<mask id="mask1_2073_16887" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="31" height="30">
<path d="M15.06 29.9962C23.343 29.9962 30.0578 23.2815 30.0578 14.9985C30.0578 6.71475 23.343 0 15.06 0C6.77627 0 0.0615234 6.71475 0.0615234 14.9985C0.0615234 23.2815 6.77627 29.9962 15.06 29.9962Z" fill="white"/>
</mask>
<g mask="url(#mask1_2073_16887)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M-1.73145 31.8342L31.8963 -1.79205L45.8208 12.1317L12.1938 45.7587L-1.72995 31.8342H-1.73145Z" fill="#FAB314"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M15.0593 -1.79248V12.5115L15.1051 14.9985L27.9421 2.16152L20.6311 -1.79173H15.0586L15.0593 -1.79248Z" fill="#7CBB41"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M34.133 14.9985H15.1055L28.8162 1.28778L34.1337 14.9978L34.133 14.9985Z" fill="#279AD5"/>
</g>
<path d="M15.0605 28.2233C22.364 28.2233 28.2852 22.302 28.2852 14.9985C28.2852 7.69426 22.364 1.77301 15.0605 1.77301C7.75621 1.77301 1.83496 7.69426 1.83496 14.9985C1.83496 22.302 7.75621 28.2233 15.0605 28.2233Z" fill="black"/>
<mask id="mask2_2073_16887" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="1" y="1" width="28" height="28">
<path d="M15.0605 28.2233C22.364 28.2233 28.2852 22.302 28.2852 14.9985C28.2852 7.69426 22.364 1.77301 15.0605 1.77301C7.75621 1.77301 1.83496 7.69426 1.83496 14.9985C1.83496 22.302 7.75621 28.2233 15.0605 28.2233Z" fill="white"/>
</mask>
<g mask="url(#mask2_2073_16887)">
<path d="M15.06 64.3455C27.6923 64.3455 37.932 54.105 37.932 41.4728C37.932 28.8413 27.6923 18.6008 15.06 18.6008C2.42777 18.6 -7.81348 28.8413 -7.81348 41.4728C-7.81348 54.105 2.42777 64.3455 15.06 64.3455Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M15.2249 24.0248C15.1741 24.0518 15.1175 24.0659 15.0599 24.0659C15.0024 24.0659 14.9457 24.0518 14.8949 24.0248C14.4314 23.7683 13.0822 22.932 11.9864 21.3698C11.1689 20.2058 10.7984 18.8888 10.6477 18.1913C10.634 18.1284 10.6331 18.0634 10.645 18.0001C10.6568 17.9369 10.6812 17.8766 10.7167 17.823C10.7523 17.7693 10.7981 17.7232 10.8517 17.6876C10.9053 17.6519 10.9655 17.6273 11.0287 17.6153C11.5537 17.5125 12.4267 17.3003 13.1624 16.9283C13.7683 16.6138 14.3251 16.2129 14.8154 15.738C14.881 15.6748 14.9685 15.6395 15.0596 15.6395C15.1506 15.6395 15.2381 15.6748 15.3037 15.738C15.794 16.2129 16.3509 16.6138 16.9567 16.9283C17.6924 17.301 18.5654 17.5125 19.0904 17.6153C19.1535 17.6276 19.2135 17.6524 19.2669 17.6881C19.3203 17.7239 19.3661 17.7699 19.4016 17.8235C19.437 17.8771 19.4615 17.9372 19.4735 18.0004C19.4855 18.0635 19.4848 18.1284 19.4714 18.1913C19.3214 18.8888 18.9502 20.2058 18.1334 21.3698C17.0369 22.932 15.6884 23.7683 15.2249 24.0248Z" fill="#FAB314"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.7535 7.88778C14.7842 7.94207 14.8288 7.98722 14.8827 8.01864C14.9366 8.05006 14.9979 8.06661 15.0603 8.06661C15.1226 8.06661 15.1839 8.05006 15.2378 8.01864C15.2917 7.98722 15.3363 7.94207 15.367 7.88778C15.9483 6.84753 16.8655 6.06528 18.016 5.75778C20.5323 5.08278 23.218 6.93153 24.0085 9.88278C24.7998 12.834 23.398 15.7778 20.881 16.452C18.7465 17.0235 16.4905 15.7808 15.3723 13.59C15.3428 13.5325 15.298 13.4843 15.2429 13.4506C15.1878 13.4169 15.1245 13.3991 15.0599 13.3991C14.9953 13.3991 14.9319 13.4169 14.8768 13.4506C14.8217 13.4843 14.777 13.5325 14.7475 13.59C13.63 15.7808 11.3733 17.0235 9.23875 16.452C6.72175 15.777 5.32075 12.834 6.11125 9.88278C6.9025 6.93153 9.5875 5.08278 12.1038 5.75778C13.2543 6.06528 14.1723 6.84753 14.7535 7.88778Z" fill="white"/>
<path d="M12.3763 13.5698C12.7644 13.5698 13.1366 13.4156 13.411 13.1412C13.6854 12.8668 13.8396 12.4946 13.8396 12.1066C13.8396 11.7185 13.6854 11.3463 13.411 11.0719C13.1366 10.7975 12.7644 10.6433 12.3763 10.6433C11.9883 10.6433 11.6161 10.7975 11.3417 11.0719C11.0672 11.3463 10.9131 11.7185 10.9131 12.1066C10.9131 12.4946 11.0672 12.8668 11.3417 13.1412C11.6161 13.4156 11.9883 13.5698 12.3763 13.5698Z" fill="black"/>
<path d="M17.7425 13.5698C18.1306 13.5698 18.5028 13.4156 18.7772 13.1412C19.0516 12.8668 19.2058 12.4946 19.2058 12.1066C19.2058 11.7185 19.0516 11.3463 18.7772 11.0719C18.5028 10.7975 18.1306 10.6433 17.7425 10.6433C17.3545 10.6433 16.9823 10.7975 16.7079 11.0719C16.4335 11.3463 16.2793 11.7185 16.2793 12.1066C16.2793 12.4946 16.4335 12.8668 16.7079 13.1412C16.9823 13.4156 17.3545 13.5698 17.7425 13.5698Z" fill="black"/>
</g>
</g>
</g>
<defs>
<clipPath id="clip0_2073_16887">
<rect width="30" height="30" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.7 KiB

After

Width:  |  Height:  |  Size: 5.0 KiB

4
apps/web/src/assets/featured/theverge.svg
View File

@@ -1 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 309 70" role="img" fill="currentColor"><title>The Verge</title><desc>The Verge logo.</desc><path d="m231.196 17.897-.302 9.071c-10.592-.726-13.618 1.996-13.618 10.885V39h-9.078V18.441h9.078v5.866c2.724-4.777 6.416-6.954 13.92-6.41ZM15.131 54.786h9.078V19.71h-9.078v35.075Zm44.968-36.828c-6.355 0-10.228 2.842-12.286 5.986V4.593H0v8.466h39.34V39h8.654c0-7.438 4.298-12.697 9.563-12.697 4.54 0 6.597 2.237 6.597 10.28v18.203h9.078V33.318c0-10.28-5.265-15.36-13.133-15.36ZM95.807 47.83c-5.507 0-9.078-3.326-9.683-8.829H77.59c.847 9.676 7.202 16.51 18.157 16.51 8.473 0 13.254-3.81 15.736-9.555l-7.687-3.387c-1.15 3.447-3.268 5.261-7.989 5.261Zm-.363-29.692a19.226 19.226 0 0 0-9.32 2.177l4.357 6.168c1.634-.846 3.39-1.27 5.266-1.21 5.084 0 7.686 3.327 8.049 7.68H95.02v6.048h17.31c.121-.907.182-1.754.182-2.66.06-13.184-8.655-18.203-17.068-18.203ZM185.32 47.83c-5.507 0-9.078-3.326-9.683-8.829h-8.534c.847 9.676 7.202 16.51 18.157 16.51 8.473 0 13.254-3.81 15.736-9.555l-7.687-3.387c-1.21 3.447-3.328 5.261-7.989 5.261Zm-.302-29.692a19.226 19.226 0 0 0-9.321 2.177l4.358 6.168c1.634-.846 3.389-1.27 5.265-1.21 5.084 0 7.687 3.327 8.05 7.68h-8.776v6.048h17.31c.121-.907.181-1.754.181-2.66.061-13.184-8.655-18.203-17.067-18.203ZM291.416 47.83c-5.507 0-9.078-3.326-9.683-8.829h-8.534c.847 9.676 7.202 16.51 18.157 16.51 8.473 0 13.254-3.81 15.736-9.555l-7.687-3.387c-1.21 3.447-3.328 5.261-7.989 5.261Zm-.484-29.692a19.225 19.225 0 0 0-9.32 2.177l4.357 6.168c1.635-.846 3.39-1.27 5.266-1.21 5.084 0 7.686 3.327 8.049 7.68h-8.775v6.048h17.309c.121-.907.182-1.754.182-2.66.06-13.184-8.655-18.203-17.068-18.203ZM117.172.299 133.5 39h9.926L130.971 8.221h16.099V.36L117.172.3Zm48.418.06L146.888 47.71l-2.784 7.076h9.502L176.06.36h-10.47Zm83.461 53.58c3.873 0 7.081-1.089 9.32-2.963l-3.631-5.745c-1.15.484-2.421.665-3.692.665-4.963 0-7.808-2.963-8.776-6.894h-8.897c1.211 8.406 7.263 14.937 15.676 14.937Zm11.196-30.418c-2.057-3.265-6.234-5.624-12.044-5.624-5.689-.06-10.954 3.024-13.738 8.043l7.565 4.838c1.392-2.903 4.116-4.838 8.292-4.838 5.931 0 9.925 4.596 9.925 10.038 0 1.029-.121 2.057-.423 3.024h9.502v-20.5h-9.079v5.019Zm-8.775 38.642c-5.871 0-8.05-2.842-8.474-6.168h-8.654c.181 6.35 4.418 13.304 17.309 13.304 8.715 0 14.404-4.354 16.765-10.885l-8.171-2.842c-1.15 4.233-4.297 6.591-8.775 6.591Z"></path></svg>
<svg width="186" height="50" viewBox="0 0 186 50" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M116.837 17.3862L116.718 20.9357C112.557 20.6516 111.368 21.7167 111.368 25.195V25.6439H107.802V17.599H111.368V19.8944C112.438 18.0252 113.889 17.1733 116.837 17.3862ZM31.9541 31.821H35.5204V18.0956H31.9541V31.821ZM49.6201 17.41C47.1235 17.41 45.6019 18.5221 44.7934 19.7524V12.1803H26.0098V15.493H41.4648V25.6439H44.8645C44.8645 22.7333 46.553 20.6755 48.6214 20.6755C50.405 20.6755 51.2131 21.5508 51.2131 24.6981V31.821H54.7795V23.4205C54.7795 19.3979 52.7111 17.41 49.6201 17.41ZM63.6482 29.0991C61.4847 29.0991 60.0818 27.7976 59.8442 25.6443H56.4915C56.8243 29.4305 59.3209 32.1047 63.6246 32.1047C66.9533 32.1047 68.8315 30.6138 69.8066 28.3658L66.7867 27.0404C66.3349 28.3893 65.5029 29.0991 63.6482 29.0991ZM63.5056 17.4805C62.2325 17.4525 60.973 17.7455 59.8442 18.3323L61.5558 20.7459C62.1978 20.4149 62.8876 20.249 63.6246 20.2724C65.6219 20.2724 66.6441 21.5743 66.7867 23.2777H63.339V25.6443H70.1394C70.1869 25.2893 70.2109 24.9579 70.2109 24.6034C70.2344 19.4444 66.8107 17.4805 63.5056 17.4805ZM98.814 29.0991C96.6505 29.0991 95.2476 27.7976 95.0099 25.6443H91.6573C91.9901 29.4305 94.4867 32.1047 98.7904 32.1047C102.119 32.1047 103.997 30.6138 104.972 28.3658L101.953 27.0404C101.477 28.3893 100.645 29.0991 98.814 29.0991ZM98.6953 17.4805C97.4221 17.4524 96.1625 17.7454 95.0335 18.3323L96.7456 20.7459C97.3875 20.4149 98.077 20.249 98.814 20.2724C100.811 20.2724 101.834 21.5743 101.976 23.2777H98.5288V25.6443H105.329C105.377 25.2893 105.4 24.9579 105.4 24.6034C105.424 19.4444 102 17.4805 98.6953 17.4805ZM140.494 29.0991C138.331 29.0991 136.928 27.7976 136.69 25.6443H133.338C133.671 29.4305 136.167 32.1047 140.471 32.1047C143.8 32.1047 145.678 30.6138 146.653 28.3658L143.633 27.0404C143.158 28.3893 142.326 29.0991 140.494 29.0991ZM140.304 17.4805C139.031 17.4525 137.772 17.7455 136.643 18.3323L138.355 20.7459C138.997 20.4149 139.686 20.249 140.423 20.2724C142.421 20.2724 143.443 21.5743 143.586 23.2777H140.138V25.6443H146.938C146.986 25.2893 147.01 24.9579 147.01 24.6034C147.033 19.4444 143.609 17.4805 140.304 17.4805ZM72.0416 10.5L78.4561 25.6439H82.3556L77.4626 13.5999H83.7872V10.5239L72.0416 10.5004V10.5ZM91.0629 10.5235L83.7157 29.0521L82.622 31.821H86.3549L95.1761 10.5239H91.0629V10.5235ZM123.851 31.4896C125.373 31.4896 126.633 31.0634 127.513 30.3301L126.086 28.0821C125.634 28.2715 125.135 28.3423 124.636 28.3423C122.686 28.3423 121.568 27.1829 121.188 25.6447H117.693C118.168 28.934 120.546 31.4896 123.851 31.4896ZM128.25 19.5869C127.441 18.3093 125.8 17.3862 123.518 17.3862C121.283 17.3627 119.215 18.5695 118.121 20.5334L121.093 22.4266C121.64 21.2906 122.71 20.5334 124.35 20.5334C126.68 20.5334 128.25 22.3319 128.25 24.4613C128.25 24.864 128.202 25.2663 128.083 25.6447H131.816V17.6229H128.25V19.5869ZM124.802 34.7077C122.496 34.7077 121.64 33.5956 121.473 32.2941H118.073C118.144 34.7789 119.809 37.5 124.873 37.5C128.297 37.5 130.532 35.7963 131.46 33.2407L128.25 32.1286C127.798 33.785 126.561 34.7077 124.802 34.7077Z" fill="#181818"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.3 KiB

After

Width:  |  Height:  |  Size: 3.0 KiB

31
apps/web/src/assets/featured/xda.svg
View File

@@ -1,18 +1,15 @@
<?xml version="1.0" encoding="UTF-8"?>
<!-- Generator: Adobe Illustrator 26.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 113.8 33.6" style="enable-background:new 0 0 113.8 33.6;" xml:space="preserve">
<style type="text/css">
.st0{fill:#2DAAE9;}
.st1{fill:#E43F64;}
.st2{fill:#BCBCBC;}
</style>
<g>
<g>
<path class="st0" d="M16,4.4V0.1h10.9v24.5H16v-4.2h6.4v-16H16z"/>
</g>
<polygon class="st1" points="10.9,4.4 10.9,0.1 0,0.1 0,24.6 5.5,24.6 10.9,33.6 10.9,20.4 4.5,20.4 4.5,4.4 "/>
<polygon class="st2" points="58.1,1.3 58.2,1 59.2,0 53.8,0 46,9.2 38.3,0 32.8,0 33.8,1.1 43.3,12.4 33.8,23.8 32.8,24.8 38.3,24.8 46,15.6 53.8,24.8 59.2,24.8 58.3,23.8 48.7,12.4 "/>
<path class="st2" d="M81.6,0H61.5v24.8h20.2c1.3,0,2.4-0.5,3.3-1.4c0.9-0.9,1.4-2,1.4-3.3V4.6c0-1.3-0.5-2.4-1.4-3.3 C84,0.5,82.9,0,81.6,0z M65.6,4.6c0-0.1,0-0.2,0.1-0.3c0.1-0.1,0.2-0.1,0.3-0.1h15.5c0.1,0,0.2,0,0.3,0.1c0.1,0.1,0.1,0.2,0.1,0.3 v15.5c0,0.1,0,0.2-0.1,0.3c-0.1,0.1-0.2,0.1-0.3,0.1H66.1c-0.1,0-0.2,0-0.3-0.1c-0.1-0.1-0.1-0.2-0.1-0.3V4.6z"/>
<path class="st2" d="M112.4,1.4c-0.9-0.9-2-1.4-3.3-1.4H93.6c-1.3,0-2.4,0.5-3.3,1.4c-0.9,0.9-1.4,2-1.4,3.3v20.2h4.1v-8.5h16.5 v8.5h4.1V4.6C113.8,3.4,113.3,2.3,112.4,1.4z M93.1,4.6c0-0.1,0-0.2,0.1-0.3c0.1-0.1,0.2-0.1,0.3-0.1h15.5c0.1,0,0.2,0,0.3,0.1 c0.1,0.1,0.1,0.2,0.1,0.3v7.5H93.1V4.6z"/>
<svg width="101" height="30" viewBox="0 0 101 30" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_2073_16918)">
<path d="M14.2734 3.92858V0.0892944H23.9474V21.9643H14.2734V18.2143H19.9536V3.92858H14.2734Z" fill="#2DAAE9"/>
<path d="M9.74723 3.92858V0.0892944H0.0732422V21.9643H4.95461L9.74723 30V18.2143H4.06709V3.92858H9.74723Z" fill="#E43F64"/>
<path d="M51.6379 1.16071L51.7267 0.892857L52.6142 0H47.8216L40.8989 8.21429L34.065 0H29.1836L30.0711 0.982143L38.5026 11.0714L30.0711 21.25L29.1836 22.1429H34.065L40.8989 13.9286L47.8216 22.1429H52.6142L51.8154 21.25L43.2952 11.0714L51.6379 1.16071Z" fill="#181818"/>
<path d="M72.4945 0H54.6553V22.1429H72.5832C73.737 22.1429 74.7133 21.6964 75.512 20.8929C76.3108 20.0893 76.7546 19.1071 76.7546 17.9464V4.10714C76.7546 2.94643 76.3108 1.96429 75.512 1.16071C74.6245 0.446429 73.6482 0 72.4945 0ZM58.2941 4.10714C58.2941 4.01786 58.2941 3.92857 58.3829 3.83929C58.4716 3.75 58.5604 3.75 58.6491 3.75H72.4057C72.4945 3.75 72.5832 3.75 72.672 3.83929C72.7607 3.92857 72.7607 4.01786 72.7607 4.10714V17.9464C72.7607 18.0357 72.7607 18.125 72.672 18.2143C72.5832 18.3036 72.4945 18.3036 72.4057 18.3036H58.7379C58.6491 18.3036 58.5604 18.3036 58.4716 18.2143C58.3829 18.125 58.3829 18.0357 58.3829 17.9464V4.10714H58.2941Z" fill="#181818"/>
<path d="M99.8304 1.25C99.0316 0.446429 98.0554 0 96.9016 0H83.145C81.9912 0 81.0149 0.446429 80.2162 1.25C79.4174 2.05357 78.9736 3.03571 78.9736 4.19643V22.2321H82.6125V14.6429H97.2566V22.2321H100.895V4.10714C101.073 3.03571 100.629 2.05357 99.8304 1.25ZM82.7012 4.10714C82.7012 4.01786 82.7012 3.92857 82.79 3.83929C82.8787 3.75 82.9675 3.75 83.0562 3.75H96.8128C96.9016 3.75 96.9903 3.75 97.0791 3.83929C97.1678 3.92857 97.1678 4.01786 97.1678 4.10714V10.8036H82.7012V4.10714Z" fill="#181818"/>
</g>
</svg>
<defs>
<clipPath id="clip0_2073_16918">
<rect width="101" height="30" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.5 KiB

After

Width:  |  Height:  |  Size: 1.9 KiB

3
apps/web/src/assets/star.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg width="43" height="41" viewBox="0 0 43 41" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M21.3984 0L22.4565 21.0438L42.7972 15.5471L23.1103 23.0562L34.6236 40.7029L21.3984 24.3L8.17327 40.7029L19.6865 23.0562L-0.000333786 15.5471L20.3404 21.0438L21.3984 0Z" fill="black"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 296 B

47
apps/web/src/components/accordion/index.tsx
View File

@@ -19,8 +19,8 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
import { SchemeColors } from "@notesnook/theme";
import { Flex, FlexProps, Text } from "@theme-ui/components";
import { PropsWithChildren, useEffect, useState } from "react";
import { ChevronDown, ChevronUp } from "../icons";
import { PropsWithChildren, useState } from "react";
import { CaretDown, ChevronDown, ChevronUp } from "../icons";
export type AccordionProps = {
title: string;
@@ -30,6 +30,7 @@ export type AccordionProps = {
buttonSx?: FlexProps["sx"];
titleSx?: FlexProps["sx"];
containerSx?: FlexProps["sx"];
variant?: "default" | "faq";
};
export default function Accordion(
@@ -43,9 +44,51 @@ export default function Accordion(
testId,
sx,
containerSx,
variant,
...restProps
} = props;
const [isContentHidden, setIsContentHidden] = useState(isClosed);
const isFaqVariant = variant === "faq";
if (isFaqVariant) {
return (
<Flex
sx={{
flexDirection: "column",
gap: "spacing4",
p: "spacing6",
borderRadius: "radius2",
border: isContentHidden
? "1px solid var(--border)"
: "1px solid var(--background-selected)",
bg: isContentHidden ? undefined : "background-selected",
...sx
}}
{...restProps}
>
<Flex
sx={{
justifyContent: "space-between",
alignItems: "center",
cursor: "pointer",
...props.buttonSx
}}
onClick={() => setIsContentHidden((s) => !s)}
data-test-id={testId}
>
<Text variant="subtitle" sx={{ color, ...props.titleSx }}>
{title}
</Text>
<CaretDown size={20} />
</Flex>
{!isContentHidden && (
<Flex sx={{ flexDirection: "column", ...containerSx }}>
{children}
</Flex>
)}
</Flex>
);
}
return (
<Flex sx={{ flexDirection: "column", ...sx }} {...restProps}>

4
apps/web/src/components/icons/index.tsx
View File

@@ -244,6 +244,7 @@ import EnvelopeSimple from "@notesnook/icons/envelope-simple.svg?react";
import LockSimple from "@notesnook/icons/lock-simple.svg?react";
import ChevronLeftIcon from "@notesnook/icons/chevron-left.svg?react";
import ChevronRightIcon from "@notesnook/icons/chevron-right.svg?react";
import ChevronDownIcon from "@notesnook/icons/chevron-down.svg?react";
import ClockIcon from "@notesnook/icons/clock.svg?react";
import WarningCircle from "@notesnook/icons/warning-circle.svg?react";
import CloudSvg from "@notesnook/icons/cloud.svg?react";
@@ -258,6 +259,7 @@ import CopyIcon from "@notesnook/icons/copy.svg?react";
import BoxArrowDownIcon from "@notesnook/icons/box-arrow-down.svg?react";
import DownloadIcon from "@notesnook/icons/download-simple.svg?react";
import FloppyDiskIcon from "@notesnook/icons/floppy-disk.svg?react";
import CheckSvg from "@notesnook/icons/check.svg?react";
type MDIIconWrapperProps = {
title?: string;
@@ -629,6 +631,7 @@ export const SpellCheck = createIcon(mdiSpellcheck);
export const ClearTrash = createIcon(mdiDeleteSweepOutline);
export const CloseCircle = createIcon(mdiCloseCircle);
export const CheckSvgIcon = createSvgIcon(CheckSvg);
export const PasswordInvisible = createSvgIcon(EyeOpen);
export const PasswordVisible = createSvgIcon(EyeClosed);
export const Chat = createSvgIcon(ChatIcon);
@@ -636,6 +639,7 @@ export const Email = createSvgIcon(EnvelopeSimple);
export const RecoveryCode = createSvgIcon(LockSimple);
export const ChevronLeft = createSvgIcon(ChevronLeftIcon);
export const ChevronRight = createSvgIcon(ChevronRightIcon);
export const CaretDown = createSvgIcon(ChevronDownIcon);
export const Clock = createSvgIcon(ClockIcon);
export const Warning = createSvgIcon(WarningCircle);
export const Cloud = createSvgIcon(CloudSvg);

1240
apps/web/src/dialogs/buy-dialog/plan-list.tsx
View File

File diff suppressed because it is too large Load Diff

126
apps/web/src/views/plans.tsx
View File

@@ -20,16 +20,19 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
import { SubscriptionPlan } from "@notesnook/core";
import {
ComparePlans,
FeaturedOn,
Footer,
PlansList
PlansList,
TestimonialsCarousel
} from "../dialogs/buy-dialog/plan-list";
import { FlexScrollContainer } from "../components/scroll-container";
import { Button, Flex, Text } from "@theme-ui/components";
import { Flex, Text, Button, Image, Box } from "@notesnook/ui";
import { useStore as useUserStore } from "../stores/user-store";
import { useEffect } from "react";
import { getQueryParams, hardNavigate } from "../navigation";
import { Close } from "../components/icons";
import { isUserSubscribed } from "../hooks/use-is-user-premium";
import { ChevronLeft } from "../components/icons";
import Star from "../assets/star.svg";
function Plans() {
const user = useUserStore((store) => store.user);
@@ -46,56 +49,112 @@ function Plans() {
return (
<Flex
id="app"
bg="background"
bg="background-secondary"
sx={{
overflow: "hidden",
flexDirection: "column",
height: "100%",
pt: 50
postion: "relative"
}}
>
<Flex variant="columnFill" sx={{ overflowY: "hidden" }}>
<FlexScrollContainer>
<Button
variant="icon"
data-test-id="close-plans"
sx={{
position: "absolute",
top: 5,
right: 5,
borderRadius: "100%"
}}
onClick={() => openURL("/")}
>
<Close size={28} />
</Button>
<Flex
sx={{
position: "relative",
flexDirection: "column",
flex: 1,
px: 25,
minHeight: "100vh",
justifyContent: "center"
alignItems: "center",
py: "80px",
px: "80px",
gap: "50px"
}}
>
<Flex sx={{ flexDirection: "column", alignSelf: "center" }}>
<Image
src={Star}
sx={{
position: "absolute",
top: 72,
left: 146,
width: "43px",
height: "43px"
}}
/>
<Image
src={Star}
sx={{
position: "absolute",
top: 61,
left: 959,
width: "25px",
height: "25px"
}}
/>
<Image
src={Star}
sx={{
position: "absolute",
top: 266,
right: 229,
width: "43px",
height: "43px"
}}
/>
<Image
src={Star}
sx={{
position: "absolute",
bottom: -30,
right: 73,
width: "64px",
height: "64px"
}}
/>
<Button
onClick={() => openURL("/")}
variant="new_bordered"
sx={{
position: "absolute",
top: 80,
right: 80,
gap: "12px"
}}
>
Skip
<ChevronLeft
size={14}
sx={{ transform: "rotate(180deg)" }}
color="heading"
/>
</Button>
<Flex
sx={{
flexDirection: "column",
alignItems: "center",
gap: "spacing6"
}}
>
<Text
id="select-plan"
variant="heading"
sx={{ fontSize: 32, textAlign: "center" }}
sx={{ fontSize: "4xl", textAlign: "center" }}
>
Select a plan
Notesnook Plans
</Text>
<Text
variant="title"
mt={1}
variant="body"
sx={{
fontSize: "subheading",
color: "heading-secondary",
textAlign: "center"
fontSize: "sm",
color: "paragraph",
textAlign: "center",
lineHeight: "1.5",
fontWeight: 400
}}
>
One subscription for a lifetime of notes.
Choose a plan that fits your workflow and keep your notes secure
across every device.
<br />
Enjoy powerful privacy-focused features designed for
distraction-free writing and organization.
</Text>
</Flex>
<PlansList
@@ -108,14 +167,15 @@ function Plans() {
}}
/>
</Flex>
<FeaturedOn />
<Flex
sx={{
flexDirection: "column",
flex: 1,
px: "20%"
flex: 1
}}
>
<ComparePlans />
<TestimonialsCarousel />
<Footer />
</Flex>
</FlexScrollContainer>

2
packages/icons/svgs/arrow-right.svg
View File

@@ -1,3 +1,3 @@
<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8.65859 5.22127L5.84609 8.03377C5.78746 8.0924 5.70793 8.12535 5.625 8.12535C5.54207 8.12535 5.46254 8.0924 5.40391 8.03377C5.34527 7.97513 5.31233 7.8956 5.31233 7.81267C5.31233 7.72975 5.34527 7.65022 5.40391 7.59158L7.6832 5.31267H1.5625C1.47962 5.31267 1.40013 5.27975 1.34153 5.22114C1.28292 5.16254 1.25 5.08305 1.25 5.00017C1.25 4.91729 1.28292 4.83781 1.34153 4.7792C1.40013 4.7206 1.47962 4.68767 1.5625 4.68767H7.6832L5.40391 2.40877C5.34527 2.35013 5.31233 2.2706 5.31233 2.18767C5.31233 2.10475 5.34527 2.02522 5.40391 1.96658C5.46254 1.90794 5.54207 1.875 5.625 1.875C5.70793 1.875 5.78746 1.90794 5.84609 1.96658L8.65859 4.77908C8.68765 4.8081 8.7107 4.84257 8.72642 4.8805C8.74215 4.91844 8.75024 4.95911 8.75024 5.00017C8.75024 5.04124 8.74215 5.08191 8.72642 5.11984C8.7107 5.15778 8.68765 5.19224 8.65859 5.22127Z" fill="#008836"/>
<path d="M8.65859 5.22127L5.84609 8.03377C5.78746 8.0924 5.70793 8.12535 5.625 8.12535C5.54207 8.12535 5.46254 8.0924 5.40391 8.03377C5.34527 7.97513 5.31233 7.8956 5.31233 7.81267C5.31233 7.72975 5.34527 7.65022 5.40391 7.59158L7.6832 5.31267H1.5625C1.47962 5.31267 1.40013 5.27975 1.34153 5.22114C1.28292 5.16254 1.25 5.08305 1.25 5.00017C1.25 4.91729 1.28292 4.83781 1.34153 4.7792C1.40013 4.7206 1.47962 4.68767 1.5625 4.68767H7.6832L5.40391 2.40877C5.34527 2.35013 5.31233 2.2706 5.31233 2.18767C5.31233 2.10475 5.34527 2.02522 5.40391 1.96658C5.46254 1.90794 5.54207 1.875 5.625 1.875C5.70793 1.875 5.78746 1.90794 5.84609 1.96658L8.65859 4.77908C8.68765 4.8081 8.7107 4.84257 8.72642 4.8805C8.74215 4.91844 8.75024 4.95911 8.75024 5.00017C8.75024 5.04124 8.74215 5.08191 8.72642 5.11984C8.7107 5.15778 8.68765 5.19224 8.65859 5.22127Z" fill="currentColor"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 963 B

After

Width:  |  Height:  |  Size: 968 B

2
packages/icons/svgs/check.svg
View File

@@ -1,3 +1,3 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M14.3538 4.85354L6.35378 12.8535C6.30735 12.9 6.2522 12.9369 6.1915 12.9621C6.13081 12.9872 6.06574 13.0002 6.00003 13.0002C5.93433 13.0002 5.86926 12.9872 5.80856 12.9621C5.74787 12.9369 5.69272 12.9 5.64628 12.8535L2.14628 9.35354C2.05246 9.25972 1.99976 9.13247 1.99976 8.99979C1.99976 8.86711 2.05246 8.73986 2.14628 8.64604C2.2401 8.55222 2.36735 8.49951 2.50003 8.49951C2.63272 8.49951 2.75996 8.55222 2.85378 8.64604L6.00003 11.7929L13.6463 4.14604C13.7401 4.05222 13.8674 3.99951 14 3.99951C14.1327 3.99951 14.26 4.05222 14.3538 4.14604C14.4476 4.23986 14.5003 4.36711 14.5003 4.49979C14.5003 4.63247 14.4476 4.75972 14.3538 4.85354Z" fill="#008836"/>
<path d="M14.3538 4.85354L6.35378 12.8535C6.30735 12.9 6.2522 12.9369 6.1915 12.9621C6.13081 12.9872 6.06574 13.0002 6.00003 13.0002C5.93433 13.0002 5.86926 12.9872 5.80856 12.9621C5.74787 12.9369 5.69272 12.9 5.64628 12.8535L2.14628 9.35354C2.05246 9.25972 1.99976 9.13247 1.99976 8.99979C1.99976 8.86711 2.05246 8.73986 2.14628 8.64604C2.2401 8.55222 2.36735 8.49951 2.50003 8.49951C2.63272 8.49951 2.75996 8.55222 2.85378 8.64604L6.00003 11.7929L13.6463 4.14604C13.7401 4.05222 13.8674 3.99951 14 3.99951C14.1327 3.99951 14.26 4.05222 14.3538 4.14604C14.4476 4.23986 14.5003 4.36711 14.5003 4.49979C14.5003 4.63247 14.4476 4.75972 14.3538 4.85354Z" fill="currentColor"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 772 B

After

Width:  |  Height:  |  Size: 777 B

11
packages/icons/svgs/chevron-down.svg
View File

@@ -1,10 +1,3 @@
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1223_13942)">
<path d="M0.7 5.1C0.313401 4.7134 0.313402 4.0866 0.7 3.7C1.0866 3.3134 1.7134 3.3134 2.1 3.7L5.29289 6.89289C5.68342 7.28342 6.31658 7.28342 6.70711 6.89289L9.9 3.7C10.2866 3.3134 10.9134 3.3134 11.3 3.7C11.6866 4.0866 11.6866 4.7134 11.3 5.1L6.70711 9.69289C6.31658 10.0834 5.68342 10.0834 5.29289 9.69289L0.7 5.1Z" fill="#181818"/>
</g>
<defs>
<clipPath id="clip0_1223_13942">
<rect width="12" height="12" fill="white" transform="translate(12) rotate(90)"/>
</clipPath>
</defs>
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
<path d="M16.25 6.7749C16.3453 6.7749 16.4403 6.79314 16.5283 6.82959C16.6162 6.86604 16.6964 6.91953 16.7637 6.98682C16.831 7.05414 16.8845 7.13423 16.9209 7.22217C16.9573 7.31005 16.9755 7.40439 16.9756 7.49951C16.9756 7.59477 16.9573 7.68983 16.9209 7.77783C16.8844 7.86576 16.831 7.94588 16.7637 8.01318L10.5137 14.2632C10.4464 14.3305 10.3662 14.3839 10.2783 14.4204C10.1903 14.4569 10.0953 14.4751 10 14.4751C9.90487 14.4751 9.81055 14.4568 9.72266 14.4204C9.63472 14.384 9.5546 14.3305 9.4873 14.2632L3.2373 8.01318C3.10128 7.87715 3.02539 7.69189 3.02539 7.49951C3.02548 7.30726 3.10136 7.12276 3.2373 6.98682C3.37325 6.85087 3.55775 6.77499 3.75 6.7749C3.94237 6.7749 4.12764 6.85079 4.26367 6.98682L10 12.7241L15.7373 6.98682C15.8046 6.91947 15.8847 6.86604 15.9727 6.82959C16.0606 6.79318 16.1549 6.77495 16.25 6.7749Z" fill="currentColor" stroke="currentColor" stroke-width="0.2"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 623 B

After

Width:  |  Height:  |  Size: 999 B

4
packages/icons/svgs/chevron-left.svg
View File

@@ -1 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Material Symbols by Google - https://github.com/google/material-design-icons/blob/master/LICENSE --><path fill="currentColor" d="m14 18l-6-6l6-6l1.4 1.4l-4.6 4.6l4.6 4.6z"/></svg>
<svg width="9" height="14" viewBox="0 0 9 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2.5 12L7.5 7L2.5 2" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 277 B

After

Width:  |  Height:  |  Size: 219 B

2
packages/icons/svgs/chevron-up.svg
View File

@@ -1,6 +1,6 @@
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1223_13904)">
<path d="M0.7 6.9C0.313401 7.2866 0.313402 7.9134 0.7 8.3C1.0866 8.6866 1.7134 8.6866 2.1 8.3L5.29289 5.10711C5.68342 4.71658 6.31658 4.71658 6.70711 5.10711L9.9 8.3C10.2866 8.6866 10.9134 8.6866 11.3 8.3C11.6866 7.9134 11.6866 7.2866 11.3 6.9L6.70711 2.30711C6.31658 1.91658 5.68342 1.91658 5.29289 2.30711L0.7 6.9Z" fill="#181818"/>
<path d="M0.7 6.9C0.313401 7.2866 0.313402 7.9134 0.7 8.3C1.0866 8.6866 1.7134 8.6866 2.1 8.3L5.29289 5.10711C5.68342 4.71658 6.31658 4.71658 6.70711 5.10711L9.9 8.3C10.2866 8.6866 10.9134 8.6866 11.3 8.3C11.6866 7.9134 11.6866 7.2866 11.3 6.9L6.70711 2.30711C6.31658 1.91658 5.68342 1.91658 5.29289 2.30711L0.7 6.9Z" fill="currentColor"/>
</g>
<defs>
<clipPath id="clip0_1223_13904">
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 643 B

After

Width:  |  Height:  |  Size: 648 B

2
packages/icons/svgs/cloud.svg
View File

@@ -1,3 +1,3 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3.66667 13.3333C1.64 13.3333 0 11.6933 0 9.66659C0 7.63992 1.64 5.99992 3.66667 5.99992C4.33333 4.43325 5.86667 3.33325 7.66667 3.33325C9.95333 3.33325 11.8267 5.10659 12 7.35325L12.3333 7.33325C14 7.33325 15.3333 8.66659 15.3333 10.3333C15.3333 11.9999 14 13.3333 12.3333 13.3333H3.66667ZM3.66667 6.66659C2 6.66659 0.666667 7.99992 0.666667 9.66659C0.666667 11.3333 2 12.6666 3.66667 12.6666C4.81333 12.6666 11.1 12.6666 12.3333 12.6666C13.62 12.6666 14.6667 11.6199 14.6667 10.3333C14.6667 9.04659 13.62 7.99992 12.3333 7.99992C11.96 7.99992 11.6 8.08659 11.2867 8.24659C11.3333 8.05992 11.3333 7.86659 11.3333 7.66659C11.3333 5.63992 9.69333 3.99992 7.66667 3.99992C5.97333 3.99992 4.55333 5.14659 4.12667 6.69992L3.66667 6.66659Z" fill="white"/>
<path d="M3.66667 13.3333C1.64 13.3333 0 11.6933 0 9.66659C0 7.63992 1.64 5.99992 3.66667 5.99992C4.33333 4.43325 5.86667 3.33325 7.66667 3.33325C9.95333 3.33325 11.8267 5.10659 12 7.35325L12.3333 7.33325C14 7.33325 15.3333 8.66659 15.3333 10.3333C15.3333 11.9999 14 13.3333 12.3333 13.3333H3.66667ZM3.66667 6.66659C2 6.66659 0.666667 7.99992 0.666667 9.66659C0.666667 11.3333 2 12.6666 3.66667 12.6666C4.81333 12.6666 11.1 12.6666 12.3333 12.6666C13.62 12.6666 14.6667 11.6199 14.6667 10.3333C14.6667 9.04659 13.62 7.99992 12.3333 7.99992C11.96 7.99992 11.6 8.08659 11.2867 8.24659C11.3333 8.05992 11.3333 7.86659 11.3333 7.66659C11.3333 5.63992 9.69333 3.99992 7.66667 3.99992C5.97333 3.99992 4.55333 5.14659 4.12667 6.69992L3.66667 6.66659Z" fill="currentColor"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 863 B

After

Width:  |  Height:  |  Size: 870 B

2
packages/icons/svgs/file.svg
View File

@@ -1,3 +1,3 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9.33384 7.33333C8.22718 7.33333 7.33384 6.44 7.33384 5.33333V2.66667H4.66718C3.93384 2.66667 3.33384 3.26667 3.33384 4V12.6667C3.33384 13.4 3.93384 14 4.66718 14H10.6672C11.4005 14 12.0005 13.4 12.0005 12.6667V7.33333H9.33384ZM8.00051 5.33333C8.00051 6.06667 8.60051 6.66667 9.33384 6.66667H11.7272L8.00051 2.94V5.33333ZM4.66718 2H8.00051L12.6672 6.66667V12.6667C12.6672 13.7733 11.7738 14.6667 10.6672 14.6667H4.66718C3.56051 14.6667 2.66718 13.7733 2.66718 12.6667V4C2.66718 2.89333 3.56051 2 4.66718 2Z" fill="white"/>
<path d="M9.33384 7.33333C8.22718 7.33333 7.33384 6.44 7.33384 5.33333V2.66667H4.66718C3.93384 2.66667 3.33384 3.26667 3.33384 4V12.6667C3.33384 13.4 3.93384 14 4.66718 14H10.6672C11.4005 14 12.0005 13.4 12.0005 12.6667V7.33333H9.33384ZM8.00051 5.33333C8.00051 6.06667 8.60051 6.66667 9.33384 6.66667H11.7272L8.00051 2.94V5.33333ZM4.66718 2H8.00051L12.6672 6.66667V12.6667C12.6672 13.7733 11.7738 14.6667 10.6672 14.6667H4.66718C3.56051 14.6667 2.66718 13.7733 2.66718 12.6667V4C2.66718 2.89333 3.56051 2 4.66718 2Z" fill="currentColor"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 635 B

After

Width:  |  Height:  |  Size: 642 B

2
packages/icons/svgs/image-outline.svg
View File

@@ -1,3 +1,3 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3.33282 2H11.9995C13.1062 2 13.9995 2.89333 13.9995 4V12.6667C13.9995 13.7733 13.1062 14.6667 11.9995 14.6667H3.33282C2.22616 14.6667 1.33282 13.7733 1.33282 12.6667V4C1.33282 2.89333 2.22616 2 3.33282 2ZM3.33282 2.66667C2.59949 2.66667 1.99949 3.26667 1.99949 4V11.7267L4.85949 8.86L6.52616 10.5267L9.85949 7.19333L13.3328 10.6667V4C13.3328 3.26667 12.7328 2.66667 11.9995 2.66667H3.33282ZM6.52616 11.4733L4.85949 9.80667L1.99949 12.6667C1.99949 13.4 2.59949 14 3.33282 14H11.9995C12.7328 14 13.3328 13.4 13.3328 12.6667V11.6067L9.85949 8.14L6.52616 11.4733ZM4.99949 4C5.91949 4 6.66616 4.74667 6.66616 5.66667C6.66616 6.58667 5.91949 7.33333 4.99949 7.33333C4.07949 7.33333 3.33282 6.58667 3.33282 5.66667C3.33282 4.74667 4.07949 4 4.99949 4ZM4.99949 4.66667C4.44616 4.66667 3.99949 5.11333 3.99949 5.66667C3.99949 6.22 4.44616 6.66667 4.99949 6.66667C5.55282 6.66667 5.99949 6.22 5.99949 5.66667C5.99949 5.11333 5.55282 4.66667 4.99949 4.66667Z" fill="white"/>
<path d="M3.33282 2H11.9995C13.1062 2 13.9995 2.89333 13.9995 4V12.6667C13.9995 13.7733 13.1062 14.6667 11.9995 14.6667H3.33282C2.22616 14.6667 1.33282 13.7733 1.33282 12.6667V4C1.33282 2.89333 2.22616 2 3.33282 2ZM3.33282 2.66667C2.59949 2.66667 1.99949 3.26667 1.99949 4V11.7267L4.85949 8.86L6.52616 10.5267L9.85949 7.19333L13.3328 10.6667V4C13.3328 3.26667 12.7328 2.66667 11.9995 2.66667H3.33282ZM6.52616 11.4733L4.85949 9.80667L1.99949 12.6667C1.99949 13.4 2.59949 14 3.33282 14H11.9995C12.7328 14 13.3328 13.4 13.3328 12.6667V11.6067L9.85949 8.14L6.52616 11.4733ZM4.99949 4C5.91949 4 6.66616 4.74667 6.66616 5.66667C6.66616 6.58667 5.91949 7.33333 4.99949 7.33333C4.07949 7.33333 3.33282 6.58667 3.33282 5.66667C3.33282 4.74667 4.07949 4 4.99949 4ZM4.99949 4.66667C4.44616 4.66667 3.99949 5.11333 3.99949 5.66667C3.99949 6.22 4.44616 6.66667 4.99949 6.66667C5.55282 6.66667 5.99949 6.22 5.99949 5.66667C5.99949 5.11333 5.55282 4.66667 4.99949 4.66667Z" fill="currentColor"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

2
packages/icons/svgs/image.svg
View File

@@ -1,3 +1,3 @@
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M16.875 3.125H3.125C2.79348 3.125 2.47554 3.2567 2.24112 3.49112C2.0067 3.72554 1.875 4.04348 1.875 4.375V15.625C1.875 15.9565 2.0067 16.2745 2.24112 16.5089C2.47554 16.7433 2.79348 16.875 3.125 16.875H16.875C17.2065 16.875 17.5245 16.7433 17.7589 16.5089C17.9933 16.2745 18.125 15.9565 18.125 15.625V4.375C18.125 4.04348 17.9933 3.72554 17.7589 3.49112C17.5245 3.2567 17.2065 3.125 16.875 3.125ZM16.875 4.375V12.4023L14.8383 10.3664C14.7222 10.2503 14.5844 10.1582 14.4327 10.0954C14.281 10.0325 14.1185 10.0002 13.9543 10.0002C13.7901 10.0002 13.6276 10.0325 13.4759 10.0954C13.3242 10.1582 13.1864 10.2503 13.0703 10.3664L11.5078 11.9289L8.07031 8.49141C7.83592 8.25716 7.5181 8.12558 7.18672 8.12558C6.85534 8.12558 6.53752 8.25716 6.30312 8.49141L3.125 11.6695V4.375H16.875ZM3.125 13.4375L7.1875 9.375L13.4375 15.625H3.125V13.4375ZM16.875 15.625H15.2055L12.393 12.8125L13.9555 11.25L16.875 14.1703V15.625ZM11.25 7.8125C11.25 7.62708 11.305 7.44582 11.408 7.29165C11.511 7.13748 11.6574 7.01732 11.8287 6.94636C12 6.87541 12.1885 6.85684 12.3704 6.89301C12.5523 6.92919 12.7193 7.01848 12.8504 7.14959C12.9815 7.2807 13.0708 7.44775 13.107 7.6296C13.1432 7.81146 13.1246 7.99996 13.0536 8.17127C12.9827 8.34257 12.8625 8.48899 12.7083 8.592C12.5542 8.69502 12.3729 8.75 12.1875 8.75C11.9389 8.75 11.7004 8.65123 11.5246 8.47541C11.3488 8.2996 11.25 8.06114 11.25 7.8125Z" fill="#181818"/>
<path d="M16.875 3.125H3.125C2.79348 3.125 2.47554 3.2567 2.24112 3.49112C2.0067 3.72554 1.875 4.04348 1.875 4.375V15.625C1.875 15.9565 2.0067 16.2745 2.24112 16.5089C2.47554 16.7433 2.79348 16.875 3.125 16.875H16.875C17.2065 16.875 17.5245 16.7433 17.7589 16.5089C17.9933 16.2745 18.125 15.9565 18.125 15.625V4.375C18.125 4.04348 17.9933 3.72554 17.7589 3.49112C17.5245 3.2567 17.2065 3.125 16.875 3.125ZM16.875 4.375V12.4023L14.8383 10.3664C14.7222 10.2503 14.5844 10.1582 14.4327 10.0954C14.281 10.0325 14.1185 10.0002 13.9543 10.0002C13.7901 10.0002 13.6276 10.0325 13.4759 10.0954C13.3242 10.1582 13.1864 10.2503 13.0703 10.3664L11.5078 11.9289L8.07031 8.49141C7.83592 8.25716 7.5181 8.12558 7.18672 8.12558C6.85534 8.12558 6.53752 8.25716 6.30312 8.49141L3.125 11.6695V4.375H16.875ZM3.125 13.4375L7.1875 9.375L13.4375 15.625H3.125V13.4375ZM16.875 15.625H15.2055L12.393 12.8125L13.9555 11.25L16.875 14.1703V15.625ZM11.25 7.8125C11.25 7.62708 11.305 7.44582 11.408 7.29165C11.511 7.13748 11.6574 7.01732 11.8287 6.94636C12 6.87541 12.1885 6.85684 12.3704 6.89301C12.5523 6.92919 12.7193 7.01848 12.8504 7.14959C12.9815 7.2807 13.0708 7.44775 13.107 7.6296C13.1432 7.81146 13.1246 7.99996 13.0536 8.17127C12.9827 8.34257 12.8625 8.48899 12.7083 8.592C12.5542 8.69502 12.3729 8.75 12.1875 8.75C11.9389 8.75 11.7004 8.65123 11.5246 8.47541C11.3488 8.2996 11.25 8.06114 11.25 7.8125Z" fill="currentColor"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.5 KiB

After

Width:  |  Height:  |  Size: 1.5 KiB

13
packages/theme/src/theme/variants/button.ts
View File

@@ -115,6 +115,18 @@ const newAnchor: ThemeUIStyleObject = {
fontWeight: 500
};
const newSecondary: ThemeUIStyleObject = {
...newCreateButtonVariant(
"background-secondary",
"buttonForeground-secondary",
{
hover: { bg: "hover-secondary" },
active: { bg: "hover-secondary" }
}
),
border: "1px solid var(--border-secondary)"
};
const primary = createButtonVariant("transparent", "paragraph", {
hover: { bg: "hover" },
active: { bg: "hover" }
@@ -194,6 +206,7 @@ const menuItem: ThemeUIStyleObject = {
export const buttonVariants = {
primary,
secondary,
new_secondary: newSecondary,
tertiary,
accent,