Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Enhancement: Word Editor - Second Iteration Features #9

Open
babblebey opened this issue Mar 30, 2024 · 0 comments
Open

Enhancement: Word Editor - Second Iteration Features #9

babblebey opened this issue Mar 30, 2024 · 0 comments
Labels
↗️ medium priority This issue is crucial ✨ enhancement New feature or request

Comments

@babblebey
Copy link
Member

babblebey commented Mar 30, 2024 •
edited
Loading

The current word editor is basic and lacks important features for user convenience and responsiveness. Enhancements are needed to improve the user experience and usability of the editor and we wish to do this incrementally.

This PR https://github.com/babblebey/jargons.dev/pull/6 implemented the First Iteration

Proposed Features for Second Iteration:

  1. Window Resizer: Add functionality to resize the side-by-side Editor and Preview panes, allowing users to adjust the size according to their preference.
  2. Mobile Responsiveness: Ensure that the markdown editor is responsive on mobile devices, providing a seamless experience for users on different screen sizes.
  3. UI Toggle: Implement a toggle for the Editor and Preview panes, allowing users to display one or both panes on the screen at the same time.

Implementation Details:

  • Window Resizer: Use JavaScript (preferably packed within a custom hook to be consumed inside of the word-editor island) to implement a draggable handle that adjusts the width of the Editor and Preview panes dynamically.
  • Mobile Responsiveness: Use CSS media queries to adjust the layout and styling of the editor for different screen sizes, ensuring readability and usability on mobile devices.
  • UI Toggle: Implement a button or control that allows users to show/hide the Editor and Preview panes independently or together.

Acceptance Criteria:

  • Users can resize the Editor and Preview panes by dragging a handle between them.
  • The word editor is responsive and displays correctly on mobile devices.
  • Users can toggle the visibility of the Editor and Preview panes individually or together.

Related Tasks:

  • Implement the window resizer functionality using JavaScript.
  • Apply CSS media queries to make the editor mobile responsive.
  • Implement the UI toggle functionality for showing/hiding panes.

Additional Notes:

  • This second iteration will significantly improve the usability and flexibility of the word editor, enhancing the overall user experience.
@babblebey babblebey added ✨ enhancement New feature or request ↗️ medium priority This issue is crucial labels Mar 30, 2024
babblebey added a commit that referenced this issue May 4, 2024
@babblebey
fix: jargons word editor mobile responsiveness (relates to #9)
48f86f7
@babblebey babblebey mentioned this issue May 24, 2024
Merged
babblebey added a commit that referenced this issue May 29, 2024
@babblebey
chore: implement feedback/nits from beta testing (#66)
8ac4ff2 
### Description
<!-- Please add PR description (don't leave blank) - example: This PR
[adds/removes/fixes/replaces] the [feature/bug/etc] -->

This PR commits some fixes to bugs and improvement suggestions received
as feedback from the whirl version of jargons.dev.

#### Changes Made

- Added missing `default_branch_only` property to `fork` script, to
allow forking of only the project's default branch.
- Replaced implementation of `javascript:history.back()` on `editor/new`
page return navigation wih=th navigation back to `/editor` page
- Updated repo git link in README.md clone repo step to `git clone
https://github.com/jargons-dev/jargons.dev.git` following org transfer
- Updated hey.new link to hi.new in CODE_OF_CONDUCT.md support contact
and in `ISSUE_TEMPLATE/config.yml` `contact_link` url
- Added `browse words` link to homepage under the search trigger
- Wrote login page message (Fixes
#12)
- Made jargons editor mobile responsiveness (Related to
#9)
- Implemented temporary workaround for handling deletion of existing
reference/branch (Related to #52)
- Added `jargons.dev` logo/sticker to README.md
- Addressed some todos
  - todo: deprecated the `options` params in the `word-editor` script

### Related Issue
<!-- Please prefix the issue number with Fixes/Resolves - example: Fixes
#123 or Resolves #123 -->

- Fixes #12
- Related to #9
- Related to #52

### Screenshots/Screencasts
<!-- Please provide screenshots or video recording that demos your
changes (especially if it's a visual change) -->

![image](https://github.com/devjargons/jargons.dev/assets/25631971/9e50d713-87a7-41e9-99dc-b295f0cf8dfb)

### Notes to Reviewer
<!-- Please state here if you added a new npm packages, or any extra
information that can help reviewer better review you changes -->

NA
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
↗️ medium priority This issue is crucial ✨ enhancement New feature or request
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@babblebey