search

wasi-master / 13ft

My own custom 12ft.io replacement
https://13ft.wasimaster.me
MIT License
2.82k stars 152 forks source link

Improve UI #19

Closed luizpicolo closed 3 months ago

luizpicolo commented 4 months ago

Summary

This pull request aims to enhance the HTML structure, CSS styling, and mobile responsiveness of the existing form page for better usability and performance.

Changes Made

  1. HTML Structure and Semantics:

    • Updated <html>, <head>, and <body> tags for proper structure.
    • Moved meta tags (charset, viewport, X-UA-Compatible) to the <head> section.
    • Added <title> tag for better SEO and usability.

  2. CSS Styling:

    • Refactored CSS for improved readability and maintainability.
    • Consolidated and standardized styles for form elements (form, h1, label, input).
    • Applied responsive design principles using media queries to ensure compatibility across different screen sizes.

  3. Google Fonts Optimization:

    • Added the async attribute to the Google Fonts CSS link to optimize loading performance.

  4. Mobile Responsiveness:

    • Implemented responsive design techniques using CSS Flexbox and media queries.
    • Adjusted padding, font sizes, and layout to ensure the form displays correctly on mobile devices without horizontal scrolling.

  5. Accessibility:

    • Ensured all form elements have associated <label> tags for improved accessibility.
    • Enhanced contrast and readability of text and input elements.

Screenshots

Before

Screen Shot 2024-07-09 at 17 34 18

After

Screen Shot 2024-07-09 at 17 34 06

wasi-master commented 3 months ago

Thank you very much <3, released as version 1.3.0. My PC was out of order the past few weeks so it took a while.