onedionys-responsive-design-helpers

Welcome to One Dionys - Responsive Design Helpers! 👋

Functions or classes to facilitate the development of responsive design in web applications. 💖

💾 Requirements

• Web Browser - Can be used as an emulator to build applications. Example [Chrome, Firefox, Safari & Opera].
• Internet - Because many use CDN and to make it easier to find solutions to all problems.

🎯 How To Use

Example Syntax

const { calculateBreakpoint } = require('./src/responsiveDesignHelpers');

const screenWidth = 768; // Example screen width
const breakpoint = calculateBreakpoint(screenWidth);
console.log('Breakpoint:', breakpoint);

Explanation

• xs: Extra small devices (width < 576px)
• sm: Small devices (width ≥ 576px and < 768px)
• md: Medium devices (width ≥ 768px and < 992px)
• lg: Large devices (width ≥ 992px and < 1200px)
• xl: Extra large devices (width ≥ 1200px)

Return Value

• The function calculateBreakpoint(width) returns a string representing the breakpoint of the device ('xs', 'sm', 'md', 'lg', 'xl').

📆 Release Date

• v1.0.0 : 08 March 2024
• v1.0.1 : 11 March 2024
• v4.0.0 : 11 March 2024
• v4.0.1 : 13 March 2024
• v4.0.2 : 18 March 2024
• v5.0.0 : 31 March 2024

🧑 Author

• Facebook : Oned Ionys
• Instagram : @onedionys
• Twitter : @onedionys
• LinkedIn : @onedionys

📝 License

• Copyright © 2024 One Dionys
• One Dionys - Responsive Design Helpers is an open source project licensed under the MIT license

☕️ Suppport & Donation

Love One Dionys - Responsive Design Helpers? Support this project by donating or sharing with others in need.

Made with ❤️ One Dionys