573b24f28f
this reverts all the custom layout based on divs & spans and moves back to using pseudo element for the expand/collapse icon. There were a few problems with the previous logic: 1. We had to write custom logic for text alignment (not a huge deal but it could cause bugs down the line) 2. Aligning the icon properly was hit or miss. We were using flex which meant for multi line headings, the icon appeared way to the left instead of right next to the end of the heading. 3. The styling css for the previous logic was MASSIVE and handled lots of cases which meant more maintenance burden for us. The new logic is simpler: 1. Use `::after` pseudo element for the expand/collapse icon. This works very nicely on Android. 2. Use selection range on the heading to compute bounding rects for each line. It's a bit hacky but works for both LTR & RTL headings. --------- Signed-off-by: 01zulfi <85733202+01zulfi@users.noreply.github.com> Co-authored-by: 01zulfi <85733202+01zulfi@users.noreply.github.com> Co-authored-by: Abdullah Atta <abdullahatta@streetwriters.co>
Notesnook
An end-to-end encrypted note taking alternative to Evernote.
Website | About us | Roadmap | Downloads | Twitter | Discord
Overview
Notesnook is a free (as in speech) & open-source note-taking app focused on user privacy & ease of use. To ensure zero knowledge principles, Notesnook encrypts everything on your device using XChaCha20-Poly1305 & Argon2.
Notesnook is our proof that privacy does not (always) have to come at the cost of convenience. We aim to provide users peace of mind & 100% confidence that their notes are safe and secure. The decision to go fully open source is one of the most crucial steps towards that.
This repository contains all the code required to build & use the Notesnook web, desktop & mobile clients. If you are looking for a full feature list or screenshots, please check the website.
Developer guide
Technologies & languages
Notesnook is built using the following technologies:
- JavaScript/Typescript — this repo is in a hybrid state. A lot of the newer code is being written in Typescript & the old code is slowly being ported over.
- React — the whole front-end across all platforms is built using React.
- React Native — For mobile apps we are using React Native
- Electron — For desktop app
- NPM — listed here because we don't use Yarn or PNPM or XYZ across any of our projects.
Note: Each project in the monorepo contains its own architecture details which you can refer to.
Monorepo structure
| Name | Path | Description |
|---|---|---|
@notesnook/web |
/apps/web | Web client |
@notesnook/desktop |
/apps/desktop | Desktop client |
@notesnook/mobile |
/apps/mobile | Android/iOS clients |
@notesnook/web-clipper |
/extensions/web-clipper | Web clipper |
@notesnook/core |
/packages/core | Shared core between all platforms |
@notesnook/crypto |
/packages/crypto | Cryptography library wrapper around libsodium |
@notesnook/clipper |
/packages/clipper | Web clipper core handling everything related to actual page clipping |
@notesnook/editor |
/packages/editor | Notesnook editor + all extensions |
@notesnook/editor-mobile |
/packages/editor-mobile | A very thin wrapper around @notesnook/editor for mobile clients |
@notesnook/logger |
/packages/logger | Simple & pluggable logger |
@notesnook/sodium |
/packages/sodium | Wrapper around libsodium to support Node.js & Browser |
@notesnook/streamable-fs |
/packages/streamable-fs | Streaming interface around an IndexedDB based file system |
@notesnook/theme |
/packages/theme | The core theme used in web & desktop clients |
Contributing guidelines
If you are interested in contributing to Notesnook, I highly recommend checking out the contributing guidelines. You'll find all the relevant information such as style guideline, how to make a PR, how to commit etc., there.
Support & help
You can reach out to us via:
We take all queries, issues and bug reports that you might have. Feel free to ask.