KorryKatti / Mirage-web

web version of Mirage : a privacy focused chat app
https://mirage-web-eight.vercel.app/
MIT License
6 stars 10 forks source link

Improve Text Alignment and Style for Enhanced Readability #40

Closed PragyaTripathi990 closed 1 month ago

PragyaTripathi990 commented 1 month ago

To create a more polished and visually appealing presentation of content on the webpage, it is necessary to enhance the alignment and style of the text. Currently, the text lacks a cohesive structure and visual hierarchy, which can hinder readability and overall user experience. Text Alignment: Left Align: For paragraphs, keep the text left-aligned for better readability.

Font Style Font Choice: Use a clean, modern font (like Arial, Roboto, or Open Sans) that enhances readability. Font Weight: Use bold for headings to create a hierarchy, while keeping body text regular or light.

Contrast: Ensure the text color contrasts well with the background for readability. Dark text on a light background or vice versa works well. Accent Colors: Use a distinct color for keywords like "Privacy" or "Secured" to highlight important concepts.

Spacing Line Height: Increase line height (1.5 to 1.6) for better readability. Padding and Margins: Add padding around text blocks and margins between sections to avoid clutter.

Background Subtle Backgrounds: Consider a subtle gradient or a soft color that complements the text rather than a stark white or black.

KorryKatti commented 1 month ago

To create a more polished and visually appealing presentation of content on the webpage, it is necessary to enhance the alignment and style of the text. Currently, the text lacks a cohesive structure and visual hierarchy, which can hinder readability and overall user experience. Text Alignment: Left Align: For paragraphs, keep the text left-aligned for better readability.

Font Style Font Choice: Use a clean, modern font (like Arial, Roboto, or Open Sans) that enhances readability. Font Weight: Use bold for headings to create a hierarchy, while keeping body text regular or light.

Contrast: Ensure the text color contrasts well with the background for readability. Dark text on a light background or vice versa works well. Accent Colors: Use a distinct color for keywords like "Privacy" or "Secured" to highlight important concepts.

Spacing Line Height: Increase line height (1.5 to 1.6) for better readability. Padding and Margins: Add padding around text blocks and margins between sections to avoid clutter.

Background Subtle Backgrounds: Consider a subtle gradient or a soft color that complements the text rather than a stark white or black.

please show a preview image

KaranSingh36752 commented 1 month ago

@PragyaTripathi990 HEY!! Can you update me on how you will work on it?