Skip to content

onedionys/onedionys-responsive-design-helpers

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

12 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

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

📝 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