feat(export): add PDF, DOC, and HTML export functionality with UI dropdown#98
Open
arindam-sahoo wants to merge 8 commits intotanabe:mainfrom
Open
feat(export): add PDF, DOC, and HTML export functionality with UI dropdown#98arindam-sahoo wants to merge 8 commits intotanabe:mainfrom
arindam-sahoo wants to merge 8 commits intotanabe:mainfrom
Conversation
Introduces a new download menu in the header, allowing users to export the rendered Markdown content. This commit: - Adds a "Download" button with a dropdown menu for export options. - Integrates jsPDF and html2canvas libraries to enable PDF generation from the live preview content. - Includes Font Awesome for the download icon. - Adds a placeholder link for future DOC download functionality. - Updates package dependencies to include html2canvas and its sub-dependencies.
Updated the text color for links within dropdown menus from white (`#fff`) to dark gray (`#333`). This change enhances readability, especially when the dropdown background is light. The addition of `!important` ensures the new color is applied consistently, overriding any conflicting styles.
Refactor the document export mechanism, introducing an "Export as HTML" option and renaming existing "Download" options to "Export". This commit removes the `html2canvas` dependency and its related sub-dependencies, streamlining the project's build. The direct CDN link for `jspdf` was also removed from `index.html`, implying a shift to a bundled version or an alternative PDF generation method. Cache busting versions in `index.html` were updated to reflect these changes.
This commit introduces dedicated print styles to enhance the user experience when printing content directly from the browser or exporting to PDF. Changes include: * Added a comprehensive `@media print` block to `public/css/style.css`. These styles ensure that only the markdown content is visible, UI elements are hidden, and the content is properly paginated and formatted for print. * Updated `src/export.js` to load `public/css/style.css` with `media="print"` instead of a separate `print.css` file. This consolidates print-specific styles into the main stylesheet, simplifying maintenance. These changes provide a cleaner, more readable output for printed documents and PDF exports.
Refactor the `exportAsPDF` function to generate PDF content using Blob URLs. This change improves the reliability and security of the export process by avoiding direct `document.write` operations in the new print window. Additionally, this commit introduces specific print media styles directly into the generated HTML. These styles ensure consistent page margins, proper content padding, and basic table formatting, leading to a more professional and readable PDF output. The print window now automatically closes after printing, and Blob URLs are revoked for resource cleanup.
d626660 to
a5f2ad8
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
This pull request adds client-side export functionality to Markdown Live Preview, enabling users to download their rendered Markdown as PDF, DOC, or HTML files — directly from the web UI, without any server dependencies.
✨ Key Features
Added Export menu (download icon) in the header with dropdown options:
.docfile using inline HTML markup.All exports are handled entirely client-side for privacy and speed.
Integrated responsive dropdown menu styling for better UX.
Included print-specific CSS rules to ensure clean PDF layouts.
📸 UI Preview
Dropdown button in header (right side) →

⬇️ Export → [HTML | PDF | DOC]