├── .gitignore ├── LICENSE ├── README.md ├── app.js ├── assets ├── connectivity.png ├── copy-icon.svg └── pear-vault.png ├── css ├── app.css └── index.css ├── index.html └── package.json /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | package-lock.json 3 | store 4 | .zed 5 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Apache License 2 | Version 2.0, January 2004 3 | http://www.apache.org/licenses/ 4 | 5 | TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION 6 | 7 | 1. Definitions. 8 | 9 | "License" shall mean the terms and conditions for use, reproduction, 10 | and distribution as defined by Sections 1 through 9 of this document. 11 | 12 | "Licensor" shall mean the copyright owner or entity authorized by 13 | the copyright owner that is granting the License. 14 | 15 | "Legal Entity" shall mean the union of the acting entity and all 16 | other entities that control, are controlled by, or are under common 17 | control with that entity. For the purposes of this definition, 18 | "control" means (i) the power, direct or indirect, to cause the 19 | direction or management of such entity, whether by contract or 20 | otherwise, or (ii) ownership of fifty percent (50%) or more of the 21 | outstanding shares, or (iii) beneficial ownership of such entity. 22 | 23 | "You" (or "Your") shall mean an individual or Legal Entity 24 | exercising permissions granted by this License. 25 | 26 | "Source" form shall mean the preferred form for making modifications, 27 | including but not limited to software source code, documentation 28 | source, and configuration files. 29 | 30 | "Object" form shall mean any form resulting from mechanical 31 | transformation or translation of a Source form, including but 32 | not limited to compiled object code, generated documentation, 33 | and conversions to other media types. 34 | 35 | "Work" shall mean the work of authorship, whether in Source or 36 | Object form, made available under the License, as indicated by a 37 | copyright notice that is included in or attached to the work 38 | (an example is provided in the Appendix below). 39 | 40 | "Derivative Works" shall mean any work, whether in Source or Object 41 | form, that is based on (or derived from) the Work and for which the 42 | editorial revisions, annotations, elaborations, or other modifications 43 | represent, as a whole, an original work of authorship. For the purposes 44 | of this License, Derivative Works shall not include works that remain 45 | separable from, or merely link (or bind by name) to the interfaces of, 46 | the Work and Derivative Works thereof. 47 | 48 | "Contribution" shall mean any work of authorship, including 49 | the original version of the Work and any modifications or additions 50 | to that Work or Derivative Works thereof, that is intentionally 51 | submitted to Licensor for inclusion in the Work by the copyright owner 52 | or by an individual or Legal Entity authorized to submit on behalf of 53 | the copyright owner. For the purposes of this definition, "submitted" 54 | means any form of electronic, verbal, or written communication sent 55 | to the Licensor or its representatives, including but not limited to 56 | communication on electronic mailing lists, source code control systems, 57 | and issue tracking systems that are managed by, or on behalf of, the 58 | Licensor for the purpose of discussing and improving the Work, but 59 | excluding communication that is conspicuously marked or otherwise 60 | designated in writing by the copyright owner as "Not a Contribution." 61 | 62 | "Contributor" shall mean Licensor and any individual or Legal Entity 63 | on behalf of whom a Contribution has been received by Licensor and 64 | subsequently incorporated within the Work. 65 | 66 | 2. Grant of Copyright License. Subject to the terms and conditions of 67 | this License, each Contributor hereby grants to You a perpetual, 68 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable 69 | copyright license to reproduce, prepare Derivative Works of, 70 | publicly display, publicly perform, sublicense, and distribute the 71 | Work and such Derivative Works in Source or Object form. 72 | 73 | 3. Grant of Patent License. Subject to the terms and conditions of 74 | this License, each Contributor hereby grants to You a perpetual, 75 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable 76 | (except as stated in this section) patent license to make, have made, 77 | use, offer to sell, sell, import, and otherwise transfer the Work, 78 | where such license applies only to those patent claims licensable 79 | by such Contributor that are necessarily infringed by their 80 | Contribution(s) alone or by combination of their Contribution(s) 81 | with the Work to which such Contribution(s) was submitted. If You 82 | institute patent litigation against any entity (including a 83 | cross-claim or counterclaim in a lawsuit) alleging that the Work 84 | or a Contribution incorporated within the Work constitutes direct 85 | or contributory patent infringement, then any patent licenses 86 | granted to You under this License for that Work shall terminate 87 | as of the date such litigation is filed. 88 | 89 | 4. Redistribution. You may reproduce and distribute copies of the 90 | Work or Derivative Works thereof in any medium, with or without 91 | modifications, and in Source or Object form, provided that You 92 | meet the following conditions: 93 | 94 | (a) You must give any other recipients of the Work or 95 | Derivative Works a copy of this License; and 96 | 97 | (b) You must cause any modified files to carry prominent notices 98 | stating that You changed the files; and 99 | 100 | (c) You must retain, in the Source form of any Derivative Works 101 | that You distribute, all copyright, patent, trademark, and 102 | attribution notices from the Source form of the Work, 103 | excluding those notices that do not pertain to any part of 104 | the Derivative Works; and 105 | 106 | (d) If the Work includes a "NOTICE" text file as part of its 107 | distribution, then any Derivative Works that You distribute must 108 | include a readable copy of the attribution notices contained 109 | within such NOTICE file, excluding those notices that do not 110 | pertain to any part of the Derivative Works, in at least one 111 | of the following places: within a NOTICE text file distributed 112 | as part of the Derivative Works; within the Source form or 113 | documentation, if provided along with the Derivative Works; or, 114 | within a display generated by the Derivative Works, if and 115 | wherever such third-party notices normally appear. The contents 116 | of the NOTICE file are for informational purposes only and 117 | do not modify the License. You may add Your own attribution 118 | notices within Derivative Works that You distribute, alongside 119 | or as an addendum to the NOTICE text from the Work, provided 120 | that such additional attribution notices cannot be construed 121 | as modifying the License. 122 | 123 | You may add Your own copyright statement to Your modifications and 124 | may provide additional or different license terms and conditions 125 | for use, reproduction, or distribution of Your modifications, or 126 | for any such Derivative Works as a whole, provided Your use, 127 | reproduction, and distribution of the Work otherwise complies with 128 | the conditions stated in this License. 129 | 130 | 5. Submission of Contributions. Unless You explicitly state otherwise, 131 | any Contribution intentionally submitted for inclusion in the Work 132 | by You to the Licensor shall be under the terms and conditions of 133 | this License, without any additional terms or conditions. 134 | Notwithstanding the above, nothing herein shall supersede or modify 135 | the terms of any separate license agreement you may have executed 136 | with Licensor regarding such Contributions. 137 | 138 | 6. Trademarks. This License does not grant permission to use the trade 139 | names, trademarks, service marks, or product names of the Licensor, 140 | except as required for reasonable and customary use in describing the 141 | origin of the Work and reproducing the content of the NOTICE file. 142 | 143 | 7. Disclaimer of Warranty. Unless required by applicable law or 144 | agreed to in writing, Licensor provides the Work (and each 145 | Contributor provides its Contributions) on an "AS IS" BASIS, 146 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or 147 | implied, including, without limitation, any warranties or conditions 148 | of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A 149 | PARTICULAR PURPOSE. You are solely responsible for determining the 150 | appropriateness of using or redistributing the Work and assume any 151 | risks associated with Your exercise of permissions under this License. 152 | 153 | 8. Limitation of Liability. In no event and under no legal theory, 154 | whether in tort (including negligence), contract, or otherwise, 155 | unless required by applicable law (such as deliberate and grossly 156 | negligent acts) or agreed to in writing, shall any Contributor be 157 | liable to You for damages, including any direct, indirect, special, 158 | incidental, or consequential damages of any character arising as a 159 | result of this License or out of the use or inability to use the 160 | Work (including but not limited to damages for loss of goodwill, 161 | work stoppage, computer failure or malfunction, or any and all 162 | other commercial damages or losses), even if such Contributor 163 | has been advised of the possibility of such damages. 164 | 165 | 9. Accepting Warranty or Additional Liability. While redistributing 166 | the Work or Derivative Works thereof, You may choose to offer, 167 | and charge a fee for, acceptance of support, warranty, indemnity, 168 | or other liability obligations and/or rights consistent with this 169 | License. However, in accepting such obligations, You may act only 170 | on Your own behalf and on Your sole responsibility, not on behalf 171 | of any other Contributor, and only if You agree to indemnify, 172 | defend, and hold each Contributor harmless for any liability 173 | incurred by, or claims asserted against, such Contributor by reason 174 | of your accepting any such warranty or additional liability. 175 | 176 | END OF TERMS AND CONDITIONS 177 | 178 | APPENDIX: How to apply the Apache License to your work. 179 | 180 | To apply the Apache License to your work, attach the following 181 | boilerplate notice, with the fields enclosed by brackets "[]" 182 | replaced with your own identifying information. (Don't include 183 | the brackets!) The text should be enclosed in the appropriate 184 | comment syntax for the file format. We also recommend that a 185 | file or class name and description of purpose be included on the 186 | same "printed page" as the copyright notice for easier 187 | identification within third-party archives. 188 | 189 | Copyright [yyyy] [name of copyright owner] 190 | 191 | Licensed under the Apache License, Version 2.0 (the "License"); 192 | you may not use this file except in compliance with the License. 193 | You may obtain a copy of the License at 194 | 195 | http://www.apache.org/licenses/LICENSE-2.0 196 | 197 | Unless required by applicable law or agreed to in writing, software 198 | distributed under the License is distributed on an "AS IS" BASIS, 199 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 200 | See the License for the specific language governing permissions and 201 | limitations under the License. 202 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Pearpass-example 2 | Example of building a collaborative application with [autobase](https://github.com/holepunchto/autobase) and [autopass](https://github.com/holepunchto/autopass). 3 | 4 | ## Setup 5 | 6 | git clone https://github.com/holepunchto/pearpass-example/ && cd pearpass-example 7 | npm i pear -g 8 | npm i 9 | npm run dev 10 | 11 | 12 | -------------------------------------------------------------------------------- /app.js: -------------------------------------------------------------------------------- 1 | // Design API for pear processes here 2 | /** @typedef {import('pear-interface')} */ /* global Pear */ 3 | 4 | // Import necessary modules 5 | import Corestore from 'corestore' 6 | import Autopass from 'autopass' 7 | import fs from 'fs' 8 | import Swal from 'sweetalert2' 9 | 10 | const { teardown } = Pear 11 | 12 | // Path to store autobase 13 | const baseDir = Pear.config.storage + '/store' 14 | const inviteFile = Pear.config.storage + '/.invite' 15 | let autopass 16 | 17 | // Create an autobase if one does not exist already 18 | async function createBase () { 19 | // Don't create the base if already exists 20 | if (fs.existsSync(inviteFile)) { 21 | autopass = new Autopass(new Corestore(baseDir)) 22 | await autopass.ready() 23 | } else { 24 | const result = await Swal.fire({ 25 | title: 'No Vault found', 26 | showDenyButton: true, 27 | confirmButtonText: 'Create New Vault', 28 | denyButtonText: 'Load a Vault', 29 | allowEscapeKey: false, 30 | backdrop: ` 31 | rgba(33, 33, 38, 1) 32 | left top 33 | no-repeat 34 | `, 35 | allowOutsideClick: false 36 | }) 37 | 38 | // Logic for creating a new vault 39 | if (result.isConfirmed) { 40 | autopass = new Autopass(new Corestore(baseDir)) 41 | await autopass.ready() 42 | await Swal.fire('New vault created!', '', 'success') 43 | fs.writeFileSync(inviteFile, 'w') 44 | await cleanTable() 45 | } else if (result.isDenied) { 46 | // Load an existing vault 47 | const vaultKeyResult = await Swal.fire({ 48 | title: 'Enter Your Vault Key', 49 | input: 'text', 50 | backdrop: ` 51 | rgba(33, 33, 38, 1) 52 | left top 53 | no-repeat 54 | `, 55 | inputAttributes: { 56 | autocapitalize: 'off' 57 | }, 58 | showCancelButton: true, 59 | confirmButtonText: 'Create', 60 | showLoaderOnConfirm: true, 61 | inputValidator: async (invite) => { 62 | // Combined key length with secret + discovery key is 128 characters 63 | if (!invite) { 64 | return 'Key can not be blank!' 65 | } else if (invite.length !== 106) { 66 | return 'Key is not of proper length' 67 | } 68 | }, 69 | 70 | preConfirm: async (invite) => { 71 | try { 72 | const pair = Autopass.pair(new Corestore(baseDir), invite) 73 | autopass = await pair.finished() 74 | } catch (error) { 75 | Swal.showValidationMessage(`Error: ${error}`) 76 | } 77 | }, 78 | allowOutsideClick: () => !Swal.isLoading() 79 | }) 80 | 81 | if (vaultKeyResult.isConfirmed) { 82 | await Swal.fire('Loaded an existing vault', '', 'info') 83 | await createTable() 84 | } else { 85 | // An empty store folder is created due to failure, delete it and start over 86 | fs.rmSync(baseDir, { recursive: true, force: true }) 87 | await createBase() 88 | } 89 | } 90 | } 91 | await autopass.ready() 92 | 93 | // Set the Add writer button 94 | if (autopass.writable === true) { 95 | document.querySelector('.add-writer').innerHTML = 'Writable' 96 | } else { 97 | document.querySelector('.add-writer').innerHTML = 'Syncing..' 98 | } 99 | } 100 | 101 | // Push data to the html table 102 | function push (type, data) { 103 | if (type === 'password') { 104 | // Get the table by its ID 105 | const table = document.getElementById('passwordTable') 106 | 107 | // Create a new row and its cells 108 | const newRow = table.insertRow() 109 | const usernameCell = newRow.insertCell(0) 110 | const passwordCell = newRow.insertCell(1) 111 | const websiteCell = newRow.insertCell(2) 112 | 113 | // Assign the values to the cells 114 | usernameCell.textContent = data.username 115 | passwordCell.textContent = data.password 116 | websiteCell.textContent = data.website 117 | } else if (type === 'note') { 118 | // Get the table by its ID 119 | const table = document.getElementById('notesTable') 120 | 121 | // Create a new row and its cells 122 | const newRow = table.insertRow() 123 | const titleCell = newRow.insertCell(0) 124 | const noteCell = newRow.insertCell(1) 125 | 126 | // Assign the values to the cells 127 | titleCell.textContent = data.title 128 | noteCell.textContent = data.note 129 | } 130 | } 131 | 132 | // Clean the table of all records, will be used for re-rendering 133 | async function cleanTable () { 134 | const passwordTable = document.getElementById('passwordTable') 135 | const notesTable = document.getElementById('notesTable') 136 | 137 | // Remove all rows except the header (first row) 138 | while (passwordTable.rows.length > 1) { 139 | passwordTable.deleteRow(1) // Keep deleting the second row until only the header remains 140 | } 141 | 142 | while (notesTable.rows.length > 1) { 143 | notesTable.deleteRow(1) // Keep deleting the second row until only the header remains 144 | } 145 | } 146 | 147 | // Show data from the base to frontend 148 | async function createTable () { 149 | await cleanTable() 150 | for await (const data of autopass.list()) { 151 | const value = JSON.parse(data.value) 152 | if (value[0] === 'password') { 153 | push(value[0], { 154 | username: value[1], 155 | password: value[2], 156 | website: value[3] 157 | }) 158 | } else if (value[0] === 'note') { 159 | push(value[0], { title: value[1], note: value[2] }) 160 | } 161 | } 162 | } 163 | 164 | // Copy data to clipboard 165 | async function copy (data) { 166 | navigator.clipboard.writeText(data) 167 | } 168 | 169 | // Call this to start base creation 170 | await createBase() 171 | teardown(() => autopass.close()) 172 | 173 | // Create table when base updates 174 | autopass.on('update', async (e) => { 175 | await createTable() 176 | }) 177 | 178 | // Check for base writable state 179 | autopass.on('writable', (e) => { 180 | document.querySelector('.add-writer').innerHTML = 'Writable' 181 | document.querySelector('.add-writer').removeAttribute('disabled') 182 | }) 183 | 184 | // Create the initial table 185 | await createTable() 186 | 187 | // Logic for destroying the base 188 | document.querySelector('.destroy-session').addEventListener('click', async (e) => { 189 | if ( 190 | confirm( 191 | 'You will lose complete access to this vault and your passwords. Continue?' 192 | ) 193 | ) { 194 | if (fs.existsSync(baseDir)) { 195 | await autopass.close() 196 | fs.rmSync(baseDir, { recursive: true, force: true }) 197 | fs.rmSync(inviteFile) 198 | Pear.reload() 199 | } 200 | } 201 | }) 202 | 203 | // Add data to the autobase 204 | document.querySelector('.add-data').addEventListener('click', async (e) => { 205 | // Ask user if the data type if a note or a password 206 | const { value: dataType } = await Swal.fire({ 207 | title: 'Add new data', 208 | input: 'select', 209 | inputOptions: { 210 | password: 'Password', 211 | note: 'Note' 212 | }, 213 | inputPlaceholder: 'Select data type', 214 | showCancelButton: true, 215 | inputValidator: (value) => { 216 | return new Promise((resolve) => { 217 | if (value === 'password') { 218 | resolve() 219 | } else if (value === 'note') { 220 | resolve() 221 | } else { 222 | resolve('You need to select an option :)') 223 | } 224 | }) 225 | } 226 | }) 227 | if (dataType) { 228 | // Difference between data types here 229 | if (dataType === 'password') { 230 | // Create form for password field inputs 231 | const { value: formValues } = await Swal.fire({ 232 | title: 'New Password', 233 | html: ` 234 | 235 | 236 | 237 | 238 | 239 | 240 | 241 | 242 | 243 | `, 244 | focusConfirm: false, 245 | preConfirm: () => { 246 | // Return input from these fields 247 | return [ 248 | 'password', 249 | document.getElementById('swal-username').value, 250 | document.getElementById('swal-password').value, 251 | document.getElementById('swal-website').value 252 | ] 253 | } 254 | }) 255 | if (formValues) { 256 | await autopass.add(formValues[1], JSON.stringify(formValues)) 257 | } 258 | } else { 259 | // Pop up for adding a Note 260 | const { value: formValues } = await Swal.fire({ 261 | title: 'New Note', 262 | html: ` 263 | 264 | 265 | 266 | `, 267 | focusConfirm: false, 268 | preConfirm: () => { 269 | // Return input from these fields 270 | return [ 271 | 'note', 272 | document.getElementById('swal-noteTitle').value, 273 | document.getElementById('swal-note').value 274 | ] 275 | } 276 | }) 277 | if (formValues) { 278 | await autopass.add(formValues[1], JSON.stringify(formValues)) 279 | } 280 | } 281 | } 282 | }) 283 | 284 | // Pair button setup 285 | document.getElementById('pair-button').addEventListener('click', async (e) => { 286 | Swal.fire({ 287 | title: 'Pairing is active', 288 | html: ' ', 289 | didOpen: async () => { 290 | Swal.showLoading() 291 | Swal.getPopup() 292 | .querySelector('.pair-discovery-key') 293 | .addEventListener('click', async (e) => { 294 | // Use the Clipboard API 295 | const inv = await autopass.createInvite() 296 | await copy(inv) 297 | alert('Pairing key copied!') 298 | }) 299 | 300 | const discovery = Swal.getPopup().querySelector('.session-link > p') 301 | discovery.textContent = await autopass.createInvite() 302 | } 303 | }) 304 | }) 305 | -------------------------------------------------------------------------------- /assets/connectivity.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/holepunchto/pearpass-example/ad86e1b4e6ac680b471fad5b9546c91b459ae49f/assets/connectivity.png -------------------------------------------------------------------------------- /assets/copy-icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /assets/pear-vault.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/holepunchto/pearpass-example/ad86e1b4e6ac680b471fad5b9546c91b459ae49f/assets/pear-vault.png -------------------------------------------------------------------------------- /css/app.css: -------------------------------------------------------------------------------- 1 | body > h1:nth-of-type(1) { 2 | cursor: pointer; 3 | } 4 | 5 | body { 6 | --title-bar-height: 42px; 7 | padding-top: var(--title-bar-height); 8 | overflow: hidden; 9 | } 10 | 11 | #bar { 12 | background: rgba(55, 60, 72, 0.6); 13 | backdrop-filter: blur(64px); 14 | -webkit-app-region: drag; 15 | height: var(--title-bar-height); 16 | padding: 0; 17 | border-top-left-radius: 8px; 18 | border-top-right-radius: 8px; 19 | color: #fff; 20 | white-space: nowrap; 21 | box-sizing: border-box; 22 | position: fixed; 23 | z-index: 2; 24 | width: 100%; 25 | left: 0; 26 | top: 0; 27 | } 28 | 29 | .button-bar { 30 | display: inline-block; 31 | background-color: #007bff; 32 | color: white; 33 | padding: 10px 15px; 34 | text-align: center; 35 | border-radius: 5px; 36 | text-decoration: none; 37 | margin: 0 0; 38 | cursor: pointer; 39 | z-index: -999; 40 | } 41 | 42 | pear-ctrl[data-platform="darwin"] { 43 | margin-top: 18px; 44 | margin-left: 12px; 45 | } 46 | -------------------------------------------------------------------------------- /css/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: #1a1b1f; 3 | font-family: Arial, sans-serif; 4 | color: white; 5 | margin: 0; 6 | padding: 0; 7 | } 8 | 9 | .container { 10 | display: flex; 11 | } 12 | 13 | .left-panel { 14 | height: 100vh; 15 | width: 30%; 16 | padding: 20px; 17 | background-color: #212126; 18 | } 19 | 20 | .right-panel { 21 | width: 70%; 22 | display: flex; 23 | justify-content: center; 24 | position: relative; 25 | align-items: flex-start; 26 | } 27 | 28 | .right-panel .receiving-files { 29 | text-align: center; 30 | } 31 | 32 | .pear-img { 33 | width: 100px; 34 | margin: 20px 0; 35 | } 36 | 37 | .session-info { 38 | text-align: center; 39 | } 40 | 41 | .session-info h2 { 42 | margin: 10px 0; 43 | font-size: 22px; 44 | } 45 | 46 | .session-info p { 47 | margin: 5px 0; 48 | font-size: 18px; 49 | } 50 | 51 | .button { 52 | background-color: #007bff; 53 | color: white; 54 | padding: 10px 15px; 55 | text-align: center; 56 | border-radius: 5px; 57 | text-decoration: none; 58 | margin: 10px 0; 59 | cursor: pointer; 60 | } 61 | 62 | .destroy-session { 63 | background-color: red; 64 | } 65 | 66 | .session-link { 67 | cursor: pointer; 68 | display: flex; 69 | max-width: -webkit-fill-available; 70 | overflow: hidden; 71 | text-overflow: ellipsis; 72 | width: 100%; 73 | padding: 10px; 74 | background-color: #34343a; 75 | color: #b9b9b9; 76 | border: none; 77 | border-radius: 5px; 78 | text-align: center; 79 | } 80 | 81 | .session-link:active { 82 | border: 2px solid; 83 | } 84 | 85 | .session-link > p { 86 | overflow: hidden; 87 | text-overflow: ellipsis; 88 | width: 90%; 89 | } 90 | 91 | .session-link > img { 92 | width: 25px; 93 | } 94 | 95 | .password-table { 96 | width: 80%; 97 | text-align: -webkit-center; 98 | } 99 | 100 | .password-table h2 { 101 | font-size: 24px; 102 | } 103 | 104 | .connectivity { 105 | width: 400px; 106 | height: 400px; 107 | margin-bottom: 20px; 108 | -webkit-user-drag: none; 109 | user-select: none; 110 | opacity: 0.2; 111 | z-index: -99; 112 | position: absolute; 113 | top: 50%; 114 | left: 50%; 115 | transform: translate(-50%, -50%); 116 | } 117 | 118 | .pear-vault-image { 119 | max-width: -webkit-fill-available; 120 | user-select: none; 121 | -webkit-user-drag: none; 122 | } 123 | 124 | .password-notes-buttons { 125 | position: absolute; 126 | -webkit-app-region: no-drag; 127 | right: 20px; 128 | top: 0; 129 | margin: 5px; 130 | } 131 | 132 | .password-notes-buttons button { 133 | background-color: #ff6600; 134 | color: white; 135 | padding: 9px; 136 | margin: 0 5px; 137 | border: none; 138 | border-radius: 5px; 139 | cursor: pointer; 140 | } 141 | 142 | .status-icon { 143 | position: absolute; 144 | top: 20px; 145 | right: 60px; 146 | } 147 | 148 | table { 149 | border-spacing: 20px; 150 | width: -webkit-fill-available; 151 | } 152 | 153 | th { 154 | user-select: none; 155 | background-color: #2d476e; 156 | padding: 12px; 157 | border-radius: 12px; 158 | } 159 | 160 | td { 161 | text-align: center; 162 | text-overflow: ellipsis; 163 | overflow: hidden; 164 | max-width: 50px; 165 | } 166 | 167 | .tabcontent { 168 | display: none; 169 | } 170 | 171 | .notes-header { 172 | user-select: none; 173 | background-color: #2d476e; 174 | padding: 12px; 175 | border-radius: 12px; 176 | } 177 | 178 | #notesTable > tbody > tr > td { 179 | text-align: justify; 180 | background-color: #828c9b; 181 | padding: 12px; 182 | border-radius: 12px; 183 | } 184 | 185 | .notes { 186 | width: -webkit-fill-available; 187 | } 188 | 189 | .pair-discovery-key { 190 | white-space: nowrap; 191 | overflow: hidden; 192 | text-overflow: ellipsis; 193 | } 194 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 |
12 | 15 | 18 | 21 |
22 |
23 |
27 | 28 |
29 |
30 |
31 |

Pearwords 🍐

32 | 33 |
Add Data
34 |
Add a Writer
35 |
Destroy Vault
36 |
37 |
38 |
39 |
40 | 41 |
46 | 47 | 48 | 49 | 50 | 51 | 52 |
UsernamePasswordWebsite
53 |
54 |
55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 |
Notes
Test note
Test note
66 |
67 |
68 |
69 |
70 | 71 | 89 | 90 | 91 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "pearwords", 3 | "version": "0.0.3", 4 | "description": "Password Manager App", 5 | "pear": { 6 | "name": "pearwords", 7 | "type": "desktop", 8 | "gui": { 9 | "backgroundColor": "#1b1d29", 10 | "height": 808, 11 | "width": 1220 12 | } 13 | }, 14 | "type": "module", 15 | "main": "index.html", 16 | "repository": { 17 | "type": "git", 18 | "url": "git+https://github.com/holepunchto/pearwords.git" 19 | }, 20 | "keywords": [ 21 | "password", 22 | "manager" 23 | ], 24 | "scripts": { 25 | "dev": "pear run -d .", 26 | "test": "brittle test/*.test.js", 27 | "fix": "standard --fix" 28 | }, 29 | "license": "Apache-2.0", 30 | "bugs": { 31 | "url": "https://github.com/holepunchto/pearwords/issues" 32 | }, 33 | "homepage": "https://github.com/holepunchto/pearwords#readme", 34 | "dependencies": { 35 | "autopass": "^2.1.0", 36 | "bare-fs": "^3.0.2", 37 | "corestore": "^7.0.7", 38 | "sweetalert2": "^11.14.1" 39 | }, 40 | "devDependencies": { 41 | "brittle": "^3.0.0", 42 | "pear-interface": "^1.0.0", 43 | "standard": "^17.1.2" 44 | } 45 | } 46 | --------------------------------------------------------------------------------