feat: search

This commit is contained in:
liyasthomas
2021-08-10 13:46:42 +05:30
parent da74fb5241
commit b612feea41
25 changed files with 493 additions and 256 deletions

View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="2491" height="2500" viewBox="0 0 435.816 437.46"><path d="M217.341.039s128.478-5.783 196.57 123.337H206.416s-39.188-1.289-72.593 46.255c-9.634 19.916-19.91 40.473-8.349 80.937C108.773 222.309 36.823 97.04 36.823 97.04S87.578 5.176 217.341.039z" fill="#c6352e"/><path d="M407.223 327.871s-59.247 114.143-205.118 108.533c17.995-31.148 103.772-179.682 103.772-179.682s20.709-33.289-3.744-85.991c-12.431-18.305-25.09-37.486-65.919-47.713 32.836-.326 177.285.021 177.285.021s54.168 89.891-6.276 204.832z" fill="#f4d911"/><path d="M28.373 328.738s-69.224-108.395 8.58-231.908c17.979 31.16 103.71 179.72 103.71 179.72s18.469 34.578 76.341 39.756c22.061-1.609 45.007-2.982 74.279-33.223-16.139 28.594-88.673 153.521-88.673 153.521S97.681 438.56 28.373 328.738z" fill="#81b354"/><path d="M202.105 437.46l29.187-121.793s32.092-2.504 58.982-32.017c-16.693 29.365-88.169 153.81-88.169 153.81z" fill="#7baa50"/><path d="M119.59 220.093c0-53.69 43.52-97.215 97.215-97.215 53.69 0 97.214 43.524 97.214 97.215 0 53.693-43.522 97.219-97.214 97.219-53.695 0-97.215-43.525-97.215-97.219z" fill="#fff"/><linearGradient id="a" gradientUnits="userSpaceOnUse" x1="-829.128" y1="1417.339" x2="-829.128" y2="1261.441" gradientTransform="matrix(1 0 0 -1 1045.93 1557.636)"><stop offset="0" stop-color="#a2c0e6"/><stop offset="1" stop-color="#406cb1"/></linearGradient><path d="M135.86 220.093c0-44.702 36.238-80.941 80.945-80.941 44.698 0 80.94 36.239 80.94 80.941 0 44.703-36.242 80.945-80.94 80.945-44.707.001-80.945-36.244-80.945-80.945z" fill="url(#a)"/><path d="M413.5 123.039l-120.183 35.237s-18.123-26.596-57.104-35.258c33.776-.115 177.287.021 177.287.021z" fill="#e7ce12"/><path d="M123.137 246.197c-16.89-29.25-86.31-149.16-86.31-149.16l89.029 88.07s-9.149 18.82-5.68 45.7l2.961 15.39z" fill="#bc332c"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient x1="49.998%" y1=".706%" x2="49.998%" y2="96.99%" id="IconifyId-17b2bfeca9d-d6badc-3320"><stop stop-color="#86BBE5" offset="0%"></stop><stop stop-color="#1072BA" offset="100%"></stop></linearGradient></defs><path d="M127.789.035s75.32-3.38 115.253 72.328H121.38s-22.96-.74-42.573 27.114c-5.634 11.691-11.69 23.734-4.894 47.468c-9.79-16.586-51.975-90.04-51.975-90.04S51.693 3.028 127.788.035z" fill="#EF3F36"></path><path d="M239.133 192.229s-34.756 66.94-120.253 63.63c10.564-18.276 60.848-105.358 60.848-105.358s12.149-19.508-2.183-50.425c-7.29-10.74-14.72-21.973-38.664-27.96c19.262-.175 103.95 0 103.95 0s31.726 52.715-3.698 120.113z" fill="#FCD900"></path><path d="M16.973 192.757s-40.601-63.56 5.035-135.958c10.529 18.276 60.813 105.358 60.813 105.358s10.846 20.283 44.756 23.31c12.924-.95 26.375-1.76 43.56-19.472C161.663 182.757 119.16 256 119.16 256s-61.552 1.127-102.188-63.243z" fill="#61BC5B"></path><path d="M118.845 256.493l17.113-71.412s18.804-1.48 34.58-18.769c-9.79 17.22-51.693 90.181-51.693 90.181z" fill="#5AB055"></path><path d="M70.462 129.056c0-31.48 25.53-57.01 57.01-57.01c31.48 0 57.01 25.53 57.01 57.01c0 31.481-25.53 57.01-57.01 57.01c-31.48-.035-57.01-25.529-57.01-57.01z" fill="#FFF"></path><path d="M80.004 129.056c0-26.198 21.234-47.467 47.468-47.467c26.198 0 47.467 21.234 47.467 47.467c0 26.199-21.233 47.468-47.467 47.468c-26.199 0-47.468-21.269-47.468-47.468z" fill="url(#IconifyId-17b2bfeca9d-d6badc-3320)"></path><path d="M242.795 72.152l-70.462 20.67s-10.634-15.6-33.487-20.67c19.825-.106 103.949 0 103.949 0z" fill="#EACA05"></path><path d="M72.54 144.339c-9.896-17.149-50.602-87.434-50.602-87.434l52.186 51.622s-5.353 11.022-3.345 26.797l1.76 9.015z" fill="#DF3A32"></path></svg>

Before

Width:  |  Height:  |  Size: 1.8 KiB

After

Width:  |  Height:  |  Size: 1.9 KiB

1
assets/icons/discord.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="41.17" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 199"><path d="M216.856 16.597A208.502 208.502 0 0 0 164.042 0c-2.275 4.113-4.933 9.645-6.766 14.046c-19.692-2.961-39.203-2.961-58.533 0c-1.832-4.4-4.55-9.933-6.846-14.046a207.809 207.809 0 0 0-52.855 16.638C5.618 67.147-3.443 116.4 1.087 164.956c22.169 16.555 43.653 26.612 64.775 33.193A161.094 161.094 0 0 0 79.735 175.3a136.413 136.413 0 0 1-21.846-10.632a108.636 108.636 0 0 0 5.356-4.237c42.122 19.702 87.89 19.702 129.51 0a131.66 131.66 0 0 0 5.355 4.237a136.07 136.07 0 0 1-21.886 10.653c4.006 8.02 8.638 15.67 13.873 22.848c21.142-6.58 42.646-16.637 64.815-33.213c5.316-56.288-9.08-105.09-38.056-148.36zM85.474 135.095c-12.645 0-23.015-11.805-23.015-26.18s10.149-26.2 23.015-26.2c12.867 0 23.236 11.804 23.015 26.2c.02 14.375-10.148 26.18-23.015 26.18zm85.051 0c-12.645 0-23.014-11.805-23.014-26.18s10.148-26.2 23.014-26.2c12.867 0 23.236 11.804 23.015 26.2c0 14.375-10.148 26.18-23.015 26.18z" fill="#5865F2"></path></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" ><path fill="currentColor" d="M12 .02c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zM18.99 7L12 12.666 5.009 7H18.99zM19 17H5V8.495l7 5.673 7-5.672V17z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--simple-icons" width="32" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path d="M15.61 12c0 1.99-1.62 3.61-3.61 3.61c-1.99 0-3.61-1.62-3.61-3.61c0-1.99 1.62-3.61 3.61-3.61c1.99 0 3.61 1.62 3.61 3.61M12 0C5.383 0 0 5.383 0 12s5.383 12 12 12c2.424 0 4.761-.722 6.76-2.087l.034-.024l-1.617-1.879l-.027.017A9.494 9.494 0 0 1 12 21.54c-5.26 0-9.54-4.28-9.54-9.54c0-5.26 4.28-9.54 9.54-9.54c5.26 0 9.54 4.28 9.54 9.54a9.63 9.63 0 0 1-.225 2.05c-.301 1.239-1.169 1.618-1.82 1.568c-.654-.053-1.42-.52-1.426-1.661V12A6.076 6.076 0 0 0 12 5.93A6.076 6.076 0 0 0 5.93 12A6.076 6.076 0 0 0 12 18.07a6.02 6.02 0 0 0 4.3-1.792a3.9 3.9 0 0 0 3.32 1.805c.874 0 1.74-.292 2.437-.821c.719-.547 1.256-1.336 1.553-2.285c.047-.154.135-.504.135-.507l.002-.013c.175-.76.253-1.52.253-2.457c0-6.617-5.383-12-12-12" fill="currentColor"></path></svg>

Before

Width:  |  Height:  |  Size: 224 B

After

Width:  |  Height:  |  Size: 982 B

View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" ><path fill="currentColor" d="M22.675 0H1.325C.593 0 0 .593 0 1.325v21.351C0 23.407.593 24 1.325 24H12.82v-9.294H9.692v-3.622h3.128V8.413c0-3.1 1.893-4.788 4.659-4.788 1.325 0 2.463.099 2.795.143v3.24l-1.918.001c-1.504 0-1.795.715-1.795 1.763v2.313h3.587l-.467 3.622h-3.12V24h6.116c.73 0 1.323-.593 1.323-1.325V1.325C24 .593 23.407 0 22.675 0z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="32" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M241.871 256.001c7.802 0 14.129-6.326 14.129-14.129V14.129C256 6.325 249.673 0 241.871 0H14.129C6.324 0 0 6.325 0 14.129v227.743c0 7.803 6.324 14.129 14.129 14.129h227.742" fill="#395185"></path><path d="M176.635 256.001v-99.137h33.277l4.982-38.635h-38.259V93.561c0-11.186 3.107-18.809 19.148-18.809l20.459-.009V40.188c-3.54-.471-15.684-1.523-29.812-1.523c-29.498 0-49.692 18.005-49.692 51.071v28.493h-33.362v38.635h33.362v99.137h39.897" fill="#FFF"></path></svg>

Before

Width:  |  Height:  |  Size: 393 B

After

Width:  |  Height:  |  Size: 697 B

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 9.1 KiB

After

Width:  |  Height:  |  Size: 14 KiB

View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="64" width="64" viewBox="0 0 29.999 30" fill="currentColor"><path d="M4.08 22.864l-1.1-.636L15.248.98l1.1.636z"/><path d="M2.727 20.53h24.538v1.272H2.727z"/><path d="M15.486 28.332L3.213 21.246l.636-1.1 12.273 7.086zm10.662-18.47L13.874 2.777l.636-1.1 12.273 7.086z"/><path d="M3.852 9.858l-.636-1.1L15.5 1.67l.636 1.1z"/><path d="M25.922 22.864l-12.27-21.25 1.1-.636 12.27 21.25zM3.7 7.914h1.272v14.172H3.7zm21.328 0H26.3v14.172h-1.272z"/><path d="M15.27 27.793l-.555-.962 10.675-6.163.555.962z"/><path d="M27.985 22.5a2.68 2.68 0 01-3.654.981 2.68 2.68 0 01-.981-3.654 2.68 2.68 0 013.654-.981 2.665 2.665 0 01.98 3.654M6.642 10.174a2.68 2.68 0 01-3.654.981A2.68 2.68 0 012.007 7.5a2.68 2.68 0 013.654-.981 2.68 2.68 0 01.981 3.654M2.015 22.5a2.68 2.68 0 01.981-3.654 2.68 2.68 0 013.654.981 2.68 2.68 0 01-.981 3.654c-1.287.735-2.92.3-3.654-.98m21.343-12.326a2.68 2.68 0 01.981-3.654 2.68 2.68 0 013.654.981 2.68 2.68 0 01-.981 3.654 2.68 2.68 0 01-3.654-.981M15 30a2.674 2.674 0 112.674-2.673A2.68 2.68 0 0115 30m0-24.652a2.67 2.67 0 01-2.674-2.674 2.67 2.67 0 115.347 0A2.67 2.67 0 0115 5.347"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--fontisto" width="28" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 21 24"><path d="M12.731 2.751L17.666 5.6a2.138 2.138 0 1 1 2.07 3.548l-.015.003v5.7a2.14 2.14 0 1 1-2.098 3.502l-.002-.002l-4.905 2.832a2.14 2.14 0 1 1-4.079.054l-.004.015l-4.941-2.844a2.14 2.14 0 1 1-2.067-3.556l.015-.003V9.15a2.14 2.14 0 1 1 1.58-3.926l-.01-.005c.184.106.342.231.479.376l.001.001l4.938-2.85a2.14 2.14 0 1 1 4.096.021l.004-.015zm-.515.877a.766.766 0 0 1-.057.057l-.001.001l6.461 11.19c.026-.009.056-.016.082-.023V9.146a2.14 2.14 0 0 1-1.555-2.603l-.003.015l.019-.072zm-3.015.059l-.06-.06l-4.946 2.852A2.137 2.137 0 0 1 2.749 9.12l-.015.004l-.076.021v5.708l.084.023l6.461-11.19zm2.076.507a2.164 2.164 0 0 1-1.207-.004l.015.004l-6.46 11.189c.286.276.496.629.597 1.026l.003.015h12.911c.102-.413.313-.768.599-1.043l.001-.001L11.28 4.194zm.986 16.227l4.917-2.838a1.748 1.748 0 0 1-.038-.142H4.222l-.021.083l4.939 2.852c.39-.403.936-.653 1.54-.653c.626 0 1.189.268 1.581.696l.001.002z" fill="currentColor"></path></svg>

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" ><path fill="currentColor" d="M19 0H5a5 5 0 00-5 5v14a5 5 0 005 5h14a5 5 0 005-5V5a5 5 0 00-5-5zM8 19H5V8h3v11zM6.5 6.732c-.966 0-1.75-.79-1.75-1.764s.784-1.764 1.75-1.764 1.75.79 1.75 1.764-.783 1.764-1.75 1.764zM20 19h-3v-5.604c0-3.368-4-3.113-4 0V19h-3V8h3v1.765c1.396-2.586 7-2.777 7 2.476V19z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="32" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M218.123 218.127h-37.931v-59.403c0-14.165-.253-32.4-19.728-32.4c-19.756 0-22.779 15.434-22.779 31.369v60.43h-37.93V95.967h36.413v16.694h.51a39.907 39.907 0 0 1 35.928-19.733c38.445 0 45.533 25.288 45.533 58.186l-.016 67.013zM56.955 79.27c-12.157.002-22.014-9.852-22.016-22.009c-.002-12.157 9.851-22.014 22.008-22.016c12.157-.003 22.014 9.851 22.016 22.008A22.013 22.013 0 0 1 56.955 79.27m18.966 138.858H37.95V95.967h37.97v122.16zM237.033.018H18.89C8.58-.098.125 8.161-.001 18.471v219.053c.122 10.315 8.576 18.582 18.89 18.474h218.144c10.336.128 18.823-8.139 18.966-18.474V18.454c-.147-10.33-8.635-18.588-18.966-18.453" fill="#0A66C2"></path></svg>

Before

Width:  |  Height:  |  Size: 347 B

After

Width:  |  Height:  |  Size: 882 B

View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"><path fill="currentColor" d="M24 11.779a2.654 2.654 0 00-4.497-1.899c-1.81-1.191-4.259-1.949-6.971-2.046l1.483-4.669 4.016.941-.006.058a2.17 2.17 0 002.174 2.163c1.198 0 2.172-.97 2.172-2.163a2.171 2.171 0 00-4.193-.785l-4.329-1.015a.37.37 0 00-.44.249L11.755 7.82c-2.838.034-5.409.798-7.3 2.025a2.643 2.643 0 00-1.799-.712A2.654 2.654 0 000 11.779c0 .97.533 1.811 1.317 2.271a4.716 4.716 0 00-.086.857C1.231 18.818 6.039 22 11.95 22s10.72-3.182 10.72-7.093c0-.274-.029-.544-.075-.81A2.633 2.633 0 0024 11.779zM6.776 13.595c0-.868.71-1.575 1.582-1.575.872 0 1.581.707 1.581 1.575s-.709 1.574-1.581 1.574-1.582-.706-1.582-1.574zm9.061 4.669c-.797.793-2.048 1.179-3.824 1.179L12 19.44l-.013.003c-1.777 0-3.028-.386-3.824-1.179a.369.369 0 010-.523.372.372 0 01.526 0c.65.647 1.729.961 3.298.961l.013.003.013-.003c1.569 0 2.648-.315 3.298-.962a.373.373 0 01.526 0 .37.37 0 010 .524zm-.189-3.095a1.58 1.58 0 01-1.581-1.574c0-.868.709-1.575 1.581-1.575s1.581.707 1.581 1.575-.709 1.574-1.581 1.574z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="32" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><circle fill="#FF4500" cx="128" cy="128" r="128"></circle><path d="M213.15 129.22c0-10.376-8.391-18.617-18.617-18.617a18.74 18.74 0 0 0-12.97 5.189c-12.818-9.157-30.368-15.107-49.9-15.87l8.544-39.981l27.773 5.95c.307 7.02 6.104 12.667 13.278 12.667c7.324 0 13.275-5.95 13.275-13.278c0-7.324-5.95-13.275-13.275-13.275c-5.188 0-9.768 3.052-11.904 7.478l-30.976-6.562c-.916-.154-1.832 0-2.443.458c-.763.458-1.22 1.22-1.371 2.136l-9.464 44.558c-19.837.612-37.692 6.562-50.662 15.872a18.74 18.74 0 0 0-12.971-5.188c-10.377 0-18.617 8.391-18.617 18.617c0 7.629 4.577 14.037 10.988 16.939a33.598 33.598 0 0 0-.458 5.646c0 28.686 33.42 52.036 74.621 52.036c41.202 0 74.622-23.196 74.622-52.036a35.29 35.29 0 0 0-.458-5.646c6.408-2.902 10.985-9.464 10.985-17.093zM85.272 142.495c0-7.324 5.95-13.275 13.278-13.275c7.324 0 13.275 5.95 13.275 13.275s-5.95 13.278-13.275 13.278c-7.327.15-13.278-5.953-13.278-13.278zm74.317 35.251c-9.156 9.157-26.553 9.768-31.588 9.768c-5.188 0-22.584-.765-31.59-9.768c-1.371-1.373-1.371-3.51 0-4.883c1.374-1.371 3.51-1.371 4.884 0c5.8 5.8 18.008 7.782 26.706 7.782c8.699 0 21.058-1.983 26.704-7.782c1.374-1.371 3.51-1.371 4.884 0c1.22 1.373 1.22 3.51 0 4.883zm-2.443-21.822c-7.325 0-13.275-5.95-13.275-13.275s5.95-13.275 13.275-13.275c7.327 0 13.277 5.95 13.277 13.275c0 7.17-5.95 13.275-13.277 13.275z" fill="#FFF"></path></svg>

Before

Width:  |  Height:  |  Size: 1.0 KiB

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M24 4.557c-.883.392-1.832.656-2.828.775 1.017-.609 1.798-1.574 2.165-2.724-.951.564-2.005.974-3.127 1.195-.897-.957-2.178-1.555-3.594-1.555-3.179 0-5.515 2.966-4.797 6.045-4.091-.205-7.719-2.165-10.148-5.144-1.29 2.213-.669 5.108 1.523 6.574-.806-.026-1.566-.247-2.229-.616-.054 2.281 1.581 4.415 3.949 4.89-.693.188-1.452.232-2.224.084.626 1.956 2.444 3.379 4.6 3.419-2.07 1.623-4.678 2.348-7.29 2.04 2.179 1.397 4.768 2.212 7.548 2.212 9.142 0 14.307-7.721 13.995-14.646.962-.695 1.797-1.562 2.457-2.549z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="39.2" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 209"><path d="M256 25.45c-9.42 4.177-19.542 7-30.166 8.27c10.845-6.5 19.172-16.793 23.093-29.057a105.183 105.183 0 0 1-33.351 12.745C205.995 7.201 192.346.822 177.239.822c-29.006 0-52.523 23.516-52.523 52.52c0 4.117.465 8.125 1.36 11.97c-43.65-2.191-82.35-23.1-108.255-54.876c-4.52 7.757-7.11 16.78-7.11 26.404c0 18.222 9.273 34.297 23.365 43.716a52.312 52.312 0 0 1-23.79-6.57c-.003.22-.003.44-.003.661c0 25.447 18.104 46.675 42.13 51.5a52.592 52.592 0 0 1-23.718.9c6.683 20.866 26.08 36.05 49.062 36.475c-17.975 14.086-40.622 22.483-65.228 22.483c-4.24 0-8.42-.249-12.529-.734c23.243 14.902 50.85 23.597 80.51 23.597c96.607 0 149.434-80.031 149.434-149.435c0-2.278-.05-4.543-.152-6.795A106.748 106.748 0 0 0 256 25.45" fill="#55acee"></path></svg>

Before

Width:  |  Height:  |  Size: 628 B

After

Width:  |  Height:  |  Size: 971 B

View File

@@ -76,10 +76,8 @@ body {
}
.svg-icons {
@apply inline-flex;
@apply flex-shrink-0;
@apply h-4;
@apply w-4;
height: var(--body-line-height);
width: var(--body-line-height);
}
a {

View File

@@ -43,9 +43,9 @@
// Text color
--secondary-color: theme("colors.blue-gray.600");
// Light Text color
--secondary-light-color: theme("colors.blue-gray.500");
--secondary-light-color: theme("colors.blue-gray.400");
// Dark Text color
--secondary-dark-color: theme("colors.blue-gray.700");
--secondary-dark-color: theme("colors.blue-gray.900");
// Border color
--divider-color: theme("colors.blue-gray.200");
// Light Border color

109
components/app/Search.vue Normal file
View File

@@ -0,0 +1,109 @@
<template>
<SmartModal v-if="show" @close="$emit('hide-modal')">
<template #body>
<input
id="command"
v-focus
type="text"
name="command"
:placeholder="$t('app.type_a_command_search')"
class="
bg-primary
border-b border-dividerLight
text-secondaryDark text-base
leading-normal
px-4
pt-2
pb-6
truncate
appearance-none
focus:outline-none
"
/>
<div
class="
divide-y divide-dividerLight
flex flex-col
space-y-4
flex-1
overflow-auto
hide-scrollbar
"
>
<div v-for="(map, mapIndex) in mappings" :key="`map-${mapIndex}`">
<h5 class="font-normal my-2 text-secondaryLight py-2 px-4">
{{ map.section }}
</h5>
<div
v-for="(shortcut, shortcutIndex) in map.shortcuts"
:key="`map-${mapIndex}-shortcut-${shortcutIndex}`"
class="
rounded
cursor-pointer
flex
py-2
px-4
transition
items-center
group
hover:bg-primaryLight
"
@click="
runAction(shortcut.action)
hideModal()
"
>
<i class="mr-4 opacity-75 material-icons group-hover:opacity-100">
{{ shortcut.icon }}
</i>
<span class="flex flex-1 mr-4 group-hover:text-secondaryDark">
{{ $t(shortcut.label) }}
</span>
<span
v-for="(key, keyIndex) in shortcut.keys"
:key="`map-${mapIndex}-shortcut-${shortcutIndex}-key-${keyIndex}`"
class="shortcut-key"
>
{{ key }}
</span>
</div>
</div>
</div>
</template>
</SmartModal>
</template>
<script>
import { invokeAction } from "~/helpers/actions"
import { spotlight } from "~/helpers/shortcuts"
export default {
props: {
show: Boolean,
},
data() {
return {
mappings: spotlight,
}
},
methods: {
hideModal() {
this.$emit("hide-modal")
},
runAction(command) {
invokeAction(command, "path_from_invokeAction")
},
},
}
</script>
<style lang="scss" scoped>
.shortcut-key {
@apply bg-dividerLight;
@apply rounded;
@apply ml-2;
@apply py-1;
@apply px-2;
@apply inline-flex;
}
</style>

View File

@@ -16,7 +16,6 @@
>
<h3 class="ml-4 heading">{{ $t("shortcuts") }}</h3>
<div class="flex">
<ButtonSecondary to="/settings" icon="tune" />
<ButtonSecondary icon="close" @click.native="close()" />
</div>
</div>
@@ -50,8 +49,8 @@
:key="`map-${mapIndex}-shortcut-${shortcutIndex}`"
class="flex items-center"
>
<span class="flex flex-1 text-secondaryLight mr-4">
{{ shortcut.label }}
<span class="flex flex-1 mr-4">
{{ $t(shortcut.label) }}
</span>
<span
v-for="(key, keyIndex) in shortcut.keys"
@@ -68,10 +67,7 @@
</template>
<script>
import {
getPlatformSpecialKey,
getPlatformAlternateKey,
} from "~/helpers/platformutils"
import shortcuts from "~/helpers/shortcuts"
export default {
props: {
@@ -80,78 +76,7 @@ export default {
data() {
return {
filterText: "",
mappings: [
{
section: "General",
shortcuts: [
{
keys: ["?"],
label: this.$t("shortcut.general.help_menu"),
},
{
keys: ["/"],
label: this.$t("shortcut.general.show_all"),
},
{
keys: [getPlatformSpecialKey(), "K"],
label: this.$t("shortcut.general.command_menu"),
},
{
keys: ["Esc"],
label: this.$t("shortcut.general.close_current_menu"),
},
],
},
{
section: "Request",
shortcuts: [
{
keys: [getPlatformSpecialKey(), "G"],
label: this.$t("shortcut.send_request"),
},
{
keys: [getPlatformSpecialKey(), "S"],
label: this.$t("shortcut.save_to_collections"),
},
{
keys: [getPlatformSpecialKey(), "K"],
label: this.$t("shortcut.copy_request_link"),
},
{
keys: [getPlatformSpecialKey(), "I"],
label: this.$t("shortcut.reset_request"),
},
{
keys: [getPlatformAlternateKey(), "↑"],
label: this.$t("shortcut.next_method"),
},
{
keys: [getPlatformAlternateKey(), "↓"],
label: this.$t("shortcut.previous_method"),
},
{
keys: [getPlatformAlternateKey(), "G"],
label: this.$t("shortcut.get_method"),
},
{
keys: [getPlatformAlternateKey(), "H"],
label: this.$t("shortcut.head_method"),
},
{
keys: [getPlatformAlternateKey(), "P"],
label: this.$t("shortcut.post_method"),
},
{
keys: [getPlatformAlternateKey(), "U"],
label: this.$t("shortcut.put_method"),
},
{
keys: [getPlatformAlternateKey(), "X"],
label: this.$t("shortcut.delete_method"),
},
],
},
],
mappings: shortcuts,
}
},
watch: {

View File

@@ -26,19 +26,26 @@
space-x-0 space-y-2)
"
>
<TabPrimary
<ButtonSecondary
v-tippy="{ theme: 'tooltip', placement: 'top' }"
:title="`${$t('app.search')} <kbd>/</kbd>`"
icon="search"
@click.native="showSearch = true"
/>
<ButtonSecondary
v-tippy="{ theme: 'tooltip', placement: 'top' }"
:title="$t('app.invite')"
icon="person_add_alt"
@click.native="showShare = true"
/>
<TabPrimary
<ButtonSecondary
v-tippy="{ theme: 'tooltip', placement: 'top' }"
:title="`${$t('support.title')} <kbd>?</kbd>`"
icon="support"
@click.native="showSupport = true"
/>
</nav>
<AppSearch :show="showSearch" @hide-modal="showSearch = false" />
<AppSupport :show="showSupport" @hide-modal="showSupport = false" />
<AppShare :show="showShare" @hide-modal="showShare = false" />
</aside>
@@ -50,9 +57,14 @@ import { defineActionHandler } from "~/helpers/actions"
export default defineComponent({
setup() {
const showSearch = ref(false)
const showSupport = ref(false)
const showShare = ref(false)
defineActionHandler("modals.search.toggle", () => {
showSearch.value = !showSearch.value
})
defineActionHandler("modals.support.toggle", () => {
showSupport.value = !showSupport.value
})
@@ -62,6 +74,7 @@ export default defineComponent({
})
return {
showSearch,
showSupport,
showShare,
}

View File

@@ -5,7 +5,7 @@
@close="$emit('hide-modal')"
>
<template #body>
<div class="flex flex-col space-y-2 px-2">
<div class="flex flex-col space-y-2">
<SmartItem
icon="menu_book"
:label="$t('app.documentation')"
@@ -48,6 +48,16 @@
hideModal()
"
/>
<SmartItem
svg="discord"
:label="$t('app.join_discord_community')"
to="https://hoppscotch.io/discord"
blank
:description="$t('support.community')"
info-icon="chevron_right"
active
@click.native="hideModal()"
/>
<SmartItem
svg="twitter"
:label="$t('app.twitter')"

View File

@@ -15,10 +15,13 @@
{{ $t("shortcut.send_request") }}
</span>
<span class="flex flex-1 items-center">
{{ $t("shortcut.reset_request") }}
{{ $t("shortcut.general.show_all") }}
</span>
<span class="flex flex-1 items-center">
{{ $t("shortcut.general.show_all") }}
{{ $t("shortcut.general.command_menu") }}
</span>
<span class="flex flex-1 items-center">
{{ $t("shortcut.general.help_menu") }}
</span>
</div>
<div class="flex flex-col space-y-4">
@@ -28,7 +31,10 @@
</div>
<div class="flex">
<span class="shortcut-key">{{ getSpecialKey() }}</span>
<span class="shortcut-key">I</span>
<span class="shortcut-key">K</span>
</div>
<div class="flex">
<span class="shortcut-key">/</span>
</div>
<div class="flex">
<span class="shortcut-key">?</span>

View File

@@ -47,7 +47,10 @@
md:m-4
"
>
<div class="flex pl-2 items-center justify-between">
<div
v-if="title"
class="flex mb-4 pl-2 items-center justify-between"
>
<h3 class="heading">{{ title }}</h3>
<span class="flex">
<slot name="actions"></slot>
@@ -59,20 +62,13 @@
</span>
</div>
<div
class="
flex flex-col
max-h-md
my-4
py-2
overflow-y-auto
hide-scrollbar
"
class="flex flex-col max-h-md py-2 overflow-y-auto hide-scrollbar"
>
<slot name="body"></slot>
</div>
<div
v-if="hasFooterSlot"
class="flex flex-1 p-2 items-center justify-between"
class="flex flex-1 mt-4 p-2 items-center justify-between"
>
<slot name="footer"></slot>
</div>

View File

@@ -17,8 +17,14 @@ export type HoppAction =
| "request.method.put" // Select PUT Method
| "request.method.delete" // Select DELETE Method
| "flyouts.keybinds.toggle" // Shows the keybinds flyout
| "modals.search.toggle" // Shows the search modal
| "modals.support.toggle" // Shows the support modal
| "modals.share.toggle" // Shows the share modal
| "navigation.rest.jump" // Jump to REST page
| "navigation.graphql.jump" // Jump to GraphQL page
| "navigation.realtime.jump" // Jump to realtime page
| "navigation.documentation.jump" // Jump to documentation page
| "navigation.settings.jump" // Jump to settings page
type BoundActionList = {
// eslint-disable-next-line no-unused-vars

View File

@@ -74,7 +74,7 @@ export const bindings: {
} = {
"ctrl-g": "request.send-cancel",
"ctrl-i": "request.reset",
"ctrl-k": "request.copy-link",
"ctrl-c": "request.copy-link",
"ctrl-s": "request.save",
"alt-up": "request.method.next",
"alt-down": "request.method.prev",
@@ -83,9 +83,15 @@ export const bindings: {
"alt-p": "request.method.post",
"alt-u": "request.method.put",
"alt-x": "request.method.delete",
"/": "flyouts.keybinds.toggle",
"ctrl-k": "flyouts.keybinds.toggle",
"/": "modals.search.toggle",
"?": "modals.support.toggle",
"ctrl-x": "modals.share.toggle",
"alt-r": "navigation.rest.jump",
"alt-q": "navigation.graphql.jump",
"alt-w": "navigation.realtime.jump",
"alt-d": "navigation.documentation.jump",
"alt-s": "navigation.settings.jump",
}
/**

129
helpers/shortcuts.js Normal file
View File

@@ -0,0 +1,129 @@
import { getPlatformAlternateKey, getPlatformSpecialKey } from "./platformutils"
export default [
{
section: "General",
shortcuts: [
{
keys: ["?"],
label: "shortcut.general.help_menu",
},
{
keys: ["/"],
label: "shortcut.general.command_menu",
},
{
keys: [getPlatformSpecialKey(), "K"],
label: "shortcut.general.show_all",
},
{
keys: ["Esc"],
label: "shortcut.general.close_current_menu",
},
],
},
{
section: "Request",
shortcuts: [
{
keys: [getPlatformSpecialKey(), "G"],
label: "shortcut.send_request",
},
{
keys: [getPlatformSpecialKey(), "S"],
label: "shortcut.save_to_collections",
},
{
keys: [getPlatformSpecialKey(), "C"],
label: "shortcut.copy_request_link",
},
{
keys: [getPlatformSpecialKey(), "I"],
label: "shortcut.reset_request",
},
{
keys: [getPlatformAlternateKey(), "↑"],
label: "shortcut.next_method",
},
{
keys: [getPlatformAlternateKey(), "↓"],
label: "shortcut.previous_method",
},
{
keys: [getPlatformAlternateKey(), "G"],
label: "shortcut.get_method",
},
{
keys: [getPlatformAlternateKey(), "H"],
label: "shortcut.head_method",
},
{
keys: [getPlatformAlternateKey(), "P"],
label: "shortcut.post_method",
},
{
keys: [getPlatformAlternateKey(), "U"],
label: "shortcut.put_method",
},
{
keys: [getPlatformAlternateKey(), "X"],
label: "shortcut.delete_method",
},
],
},
]
export const spotlight = [
{
section: "Spotlight",
shortcuts: [
{
keys: ["?"],
label: "shortcut.general.help_menu",
action: "modals.support.toggle",
icon: "support",
},
{
keys: [getPlatformSpecialKey(), "K"],
label: "shortcut.general.show_all",
action: "flyouts.keybinds.toggle",
icon: "keyboard",
},
],
},
{
section: "Navigation",
shortcuts: [
{
keys: [getPlatformAlternateKey(), "R"],
label: "shortcut.navigation.rest",
action: "navigation.rest.jump",
icon: "arrow_forward",
},
{
keys: [getPlatformAlternateKey(), "Q"],
label: "shortcut.navigation.graphql",
action: "navigation.graphql.jump",
icon: "arrow_forward",
},
{
keys: [getPlatformAlternateKey(), "W"],
label: "shortcut.navigation.realtime",
action: "navigation.realtime.jump",
icon: "arrow_forward",
},
{
keys: [getPlatformAlternateKey(), "D"],
label: "shortcut.navigation.documentation",
action: "navigation.documentation.jump",
icon: "arrow_forward",
},
{
keys: [getPlatformAlternateKey(), "S"],
label: "shortcut.navigation.settings",
action: "navigation.settings.jump",
icon: "arrow_forward",
},
],
},
]

View File

@@ -72,7 +72,8 @@
"chat": "Questions? Chat with us!",
"forum": "Ask questions and get answers",
"team": "Get in touch with the team",
"shortcuts": "Become more efficient"
"shortcuts": "Browse app faster",
"community": "Ask questions and help others"
},
"app": {
"name": "Hoppscotch",
@@ -81,8 +82,9 @@
"whats_new": "What's new?",
"chat_with_us": "Chat with us",
"keyboard_shortcuts": "Keyboard shortcuts",
"new_version_found": "New version found. Refresh to update.",
"join_discord_community": "Join our Discord community",
"twitter": "Twitter",
"new_version_found": "New version found. Refresh to update.",
"terms_and_privacy": "Terms and privacy",
"status": "Status",
"help": "Help, feedback and</br>documentation",
@@ -90,7 +92,9 @@
"invite_your_friends": "Invite your friends",
"invite_description": "In Hoppscotch, we designed a simple and intuitive interface for creating and managing your APIs. Hoppscotch is a tool that helps you build, test, document and share your APIs.",
"share": "Share",
"copy": "Copy"
"copy": "Copy",
"search": "Search",
"type_a_command_search": "Type a command or search…"
},
"collection": {
"save_as": "Save as",
@@ -208,9 +212,16 @@
"general": {
"help_menu": "Help menu",
"show_all": "Keyboard shortcuts",
"command_menu": "Command menu",
"command_menu": "Search & command menu",
"close_current_menu": "Close current menu"
},
"navigation": {
"rest": "Go to REST",
"graphql": "Go to GraphQL",
"realtime": "Go to realtime",
"documentation": "Go to documentation",
"settings": "Go to settings"
},
"send_request": "Send Request",
"save_to_collections": "Save to Collections",
"copy_request_link": "Copy Request Link",

135
languages.json Normal file
View File

@@ -0,0 +1,135 @@
[
{
"code": "en",
"name": "English",
"iso": "en-US",
"file": "en-US.json",
"country": "US"
},
{
"code": "es",
"name": "Español",
"iso": "es-ES",
"file": "es-ES.json",
"country": "ES"
},
{
"code": "fr",
"name": "Français",
"iso": "fr-FR",
"file": "fr-FR.json",
"country": "FR"
},
{
"code": "fa",
"name": "Farsi",
"iso": "fa-IR",
"file": "fa-IR.json",
"country": "IR"
},
{
"code": "pt",
"name": "Português",
"iso": "pt-PT",
"file": "pt-PT.json",
"country": "PT"
},
{
"code": "pt-br",
"name": "Português Brasileiro",
"iso": "pt-BR",
"file": "pt-BR.json",
"country": "BR"
},
{
"code": "cn",
"name": "简体中文",
"iso": "zh-CN",
"file": "zh-CN.json",
"country": "CN"
},
{
"code": "tw",
"name": "繁體中文",
"iso": "zh-TW",
"file": "zh-TW.json",
"country": "TW"
},
{
"code": "id",
"name": "Bahasa Indonesia",
"iso": "id-ID",
"file": "id-ID.json",
"country": "ID"
},
{
"code": "tr",
"name": "Türkçe",
"iso": "tr-TR",
"file": "tr-TR.json",
"country": "TR"
},
{
"code": "de",
"name": "Deutsch",
"iso": "de-DE",
"file": "de-DE.json",
"country": "DE"
},
{
"code": "ja",
"name": "日本語",
"iso": "ja-JP",
"file": "ja-JP.json",
"country": "JP"
},
{
"code": "ko",
"name": "한국어",
"iso": "ko-KR",
"file": "ko-KR.json",
"country": "KR"
},
{
"code": "in",
"name": "हिंदी",
"iso": "in-IN",
"file": "in-IN.json",
"country": "IN"
},
{
"code": "bn",
"name": "Bengali",
"iso": "bn-BD",
"file": "bn-BD.json",
"country": "BD"
},
{
"code": "ml",
"name": "മലയാളം",
"iso": "ml-ML",
"file": "ml-ML.json",
"country": "ML"
},
{
"code": "vi",
"name": "Vietnamese",
"iso": "vi-VN",
"file": "vi-VN.json",
"country": "VN"
},
{
"code": "nl",
"name": "Dutch",
"iso": "nl-BE",
"file": "nl-BE.json",
"country": "BE"
},
{
"code": "nb",
"name": "Norwegian (Bokmål)",
"iso": "nb-NO",
"file": "nb-NO.json",
"country": "NO"
}
]

View File

@@ -36,7 +36,7 @@
</template>
<script lang="ts">
import { defineComponent } from "@nuxtjs/composition-api"
import { defineComponent, useRouter } from "@nuxtjs/composition-api"
import { Splitpanes, Pane } from "splitpanes"
import "splitpanes/dist/splitpanes.css"
import { setupLocalPersistence } from "~/newstore/localpersistence"
@@ -47,11 +47,28 @@ import { initializeFirebase } from "~/helpers/fb"
import { getSettingSubject } from "~/newstore/settings"
import { logPageView } from "~/helpers/fb/analytics"
import { hookKeybindingsListener } from "~/helpers/keybindings"
import { defineActionHandler } from "~/helpers/actions"
export default defineComponent({
components: { Splitpanes, Pane },
setup() {
hookKeybindingsListener()
const router = useRouter()
defineActionHandler("navigation.rest.jump", () => {
router.push({ path: "/" })
})
defineActionHandler("navigation.graphql.jump", () => {
router.push({ path: "/graphql" })
})
defineActionHandler("navigation.realtime.jump", () => {
router.push({ path: "/realtime" })
})
defineActionHandler("navigation.documentation.jump", () => {
router.push({ path: "/documentation" })
})
defineActionHandler("navigation.settings.jump", () => {
router.push({ path: "/settings" })
})
},
data() {
return {

View File

@@ -1,3 +1,5 @@
import languages from "./languages"
require("dotenv").config()
// Common options
@@ -6,6 +8,8 @@ export const options = {
shortDescription: "Open source API development ecosystem",
description:
"Helps you create requests faster, saving precious time on development.",
keywords:
"hoppscotch, hopp scotch, hoppscotch online, hoppscotch app, postwoman, postwoman chrome, postwoman online, postwoman for mac, postwoman app, postwoman for windows, postwoman google chrome, postwoman chrome app, get postwoman, postwoman web, postwoman android, postwoman app for chrome, postwoman mobile app, postwoman web app, api, request, testing, tool, rest, websocket, sse, graphql, socketio",
loading: {
color: "var(--accent-color)",
background: "var(--primary-color)",
@@ -35,8 +39,7 @@ export default {
meta: [
{
name: "keywords",
content:
"hoppscotch, hopp scotch, hoppscotch online, hoppscotch app, postwoman, postwoman chrome, postwoman online, postwoman for mac, postwoman app, postwoman for windows, postwoman google chrome, postwoman chrome app, get postwoman, postwoman web, postwoman android, postwoman app for chrome, postwoman mobile app, postwoman web app, api, request, testing, tool, rest, websocket, sse, graphql, socketio",
content: options.keywords,
},
{
name: "X-UA-Compatible",
@@ -215,141 +218,7 @@ export default {
// i18n module configuration (https://github.com/nuxt-community/i18n-module)
i18n: {
locales: [
{
code: "en",
name: "English",
iso: "en-US",
file: "en-US.json",
country: "US",
},
{
code: "es",
name: "Español",
iso: "es-ES",
file: "es-ES.json",
country: "ES",
},
{
code: "fr",
name: "Français",
iso: "fr-FR",
file: "fr-FR.json",
country: "FR",
},
{
code: "fa",
name: "Farsi",
iso: "fa-IR",
file: "fa-IR.json",
country: "IR",
},
{
code: "pt",
name: "Português",
iso: "pt-PT",
file: "pt-PT.json",
country: "PT",
},
{
code: "pt-br",
name: "Português Brasileiro",
iso: "pt-BR",
file: "pt-BR.json",
country: "BR",
},
{
code: "cn",
name: "简体中文",
iso: "zh-CN",
file: "zh-CN.json",
country: "CN",
},
{
code: "tw",
name: "繁體中文",
iso: "zh-TW",
file: "zh-TW.json",
country: "TW",
},
{
code: "id",
name: "Bahasa Indonesia",
iso: "id-ID",
file: "id-ID.json",
country: "ID",
},
{
code: "tr",
name: "Türkçe",
iso: "tr-TR",
file: "tr-TR.json",
country: "TR",
},
{
code: "de",
name: "Deutsch",
iso: "de-DE",
file: "de-DE.json",
country: "DE",
},
{
code: "ja",
name: "日本語",
iso: "ja-JP",
file: "ja-JP.json",
country: "JP",
},
{
code: "ko",
name: "한국어",
iso: "ko-KR",
file: "ko-KR.json",
country: "KR",
},
{
code: "in",
name: "हिंदी",
iso: "in-IN",
file: "in-IN.json",
country: "IN",
},
{
code: "bn",
name: "Bengali",
iso: "bn-BD",
file: "bn-BD.json",
country: "BD",
},
{
code: "ml",
name: "മലയാളം",
iso: "ml-ML",
file: "ml-ML.json",
country: "ML",
},
{
code: "vi",
name: "Vietnamese",
iso: "vi-VN",
file: "vi-VN.json",
country: "VN",
},
{
code: "nl",
name: "Dutch",
iso: "nl-BE",
file: "nl-BE.json",
country: "BE",
},
{
code: "nb",
name: "Norwegian (Bokmål)",
iso: "nb-NO",
file: "nb-NO.json",
country: "NO",
},
],
locales: languages,
defaultLocale: "en",
vueI18n: {
fallbackLocale: "en",

View File

@@ -372,10 +372,13 @@
{{ $t("shortcut.send_request") }}
</span>
<span class="flex flex-1 items-center">
{{ $t("shortcut.reset_request") }}
{{ $t("shortcut.general.show_all") }}
</span>
<span class="flex flex-1 items-center">
{{ $t("shortcut.general.show_all") }}
{{ $t("shortcut.general.command_menu") }}
</span>
<span class="flex flex-1 items-center">
{{ $t("shortcut.general.help_menu") }}
</span>
</div>
<div class="flex flex-col space-y-4">
@@ -385,7 +388,10 @@
</div>
<div class="flex">
<span class="shortcut-key">{{ getSpecialKey() }}</span>
<span class="shortcut-key">I</span>
<span class="shortcut-key">K</span>
</div>
<div class="flex">
<span class="shortcut-key">/</span>
</div>
<div class="flex">
<span class="shortcut-key">?</span>