Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to setup a minimum and maximun automatic zoom for entire app? #42

Open
jrcribb opened this issue Apr 28, 2023 · 1 comment
Open

Comments

@jrcribb
Copy link

jrcribb commented Apr 28, 2023

How to setup a minimum and maximun size automatic zoom for entire app?

On mobile view of an app, the fonts are so small. I need an automatic zoom that affect all pages without user especific action.

Obviously the fonts can't be reduced or be augmented automatically without limits.

@Akshat-ops
Copy link

#HTML

#CSS
body {
font-size: 16px; /* Set an initial base font size */
}

/* Define media queries for different screen sizes /
@media (max-width: 480px) {
body {
font-size: 14px; /
Adjust the font size for smaller screens */
}
}

@media (min-width: 1200px) {
body {
font-size: 18px; /* Adjust the font size for larger screens */
}
}

#JS

<script> // Detect changes in window size window.addEventListener('resize', function() { // Set a minimum and maximum font size var fontSize = Math.max(14, Math.min(18, window.innerWidth / 100)); document.body.style.fontSize = fontSize + 'px'; }); </script>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants