How do I tweak css for Phone. Or is there a way to detect wether ionic is running on a small screen like a iPhone 5 or SamsungGalaxy sIII
I personally use this small library: https://github.com/matthewhudson/device.js
It tells you which device you’re on (tablet/phone/desktop), OS (ios, android, windows), and wether if it’s in landscape or portrait.
If you look into their code I’m not 100% happy with it but it works. They check the user agent, screen dimentions, etc.
If it is only CSS tweaks based on size, why not just use media queries?
@media (max-width: 320px) {
...
}Take a look at $ionicPlatform, it ofers isIOS(), isAndroid() and isWindowsPhone() functions.
http://ionicframework.com/docs/api/utility/ionic.Platform/
Also, you could bind to certain css classes that are added to the platform, reference to the forums for those exact names, it doesn’t seem to be documented yet. For example: Target different platform
1 Like