Ionic's component ion-item has different default values for the CSS variable '--inner-padding-end' on iOS and Android.
Padding Android
Padding iOS
On Android its symmetrical and on iOS its asymmetrical.
Can someone please explain me the reason behind this?
It is for the app to have a native touch and feel. Ionic built the default platform style for each platform (Android and iOS). If you don't like the style, you can always apply a custom css or override the default style configuration.
Related
My website's Arabic font letters appears separated from each other which makes it un readable so I want to use a different font that will display only on iPhone & iPad devices in wordpress, I am using Elementor to design the site. Is there's a code or plugin I can use to apply different font for iOS devices?
https://ozaro.com/ar/our-history/
Well you cant do that just using css. You'll need JavaScript too.
Here is an answer on finding if device is iOS or not.
So basically this is what you'll have to do.
Set a unique classname for the parts of your website you need that font to be applied. E.g. "arabicf"
Go to your footer builder and drag drop an html widget.
Inside the widget write your js between script tags.
P.s. the logic behind the js is simple
If ios then "arabicf" style fontFamily = X.
I am looking for the directions icons, like turn right, turn left, third exit in the roundabout, second lane etc...
I am using the Flutter navigate SDK 4.7.0
Are those available in the SDK and if yes any guidance how to access them?
They are not available as part of the HERE SDK directly, but there are numerous other places. For example HERE offers the MSDKUI open source project which offers direction icons like arrows, maneuver icons and so on.
iOS format: https://github.com/heremaps/msdkui-ios/tree/master/MSDKUI/Assets
Android format: https://github.com/heremaps/msdkui-android/tree/master/MSDKUIKit/MSDKUILib/src/main/res/drawable
How would one change the styling of a single component? For example force md styling of searchbar on iOS.
You can set mode attribute to force the Android style regardless of the platform it’s running on.
<ion-searchbar mode="md"></ion-searchbar>
I use GWT Material Design version 1.6.2. My data grid layout looks fine and I want to keep that layout on mobile devices.
So I don't want to see something like that in my application.
Any ideas how to do that? Thanks.
Solved.
Just do not need to set css style "responsive-table" on data greed.
For example change :
dataGrid.setStyleName("hoverable responsive-table");
to
dataGrid.setStyleName("hoverable");
Is it possible to set a single component in a page to a certain platform.
For example, I have an iOS screen and I want the bottom toolbar just for this one page to use the Android Style (material design).
Yes, this is possible every component in Ionic can be configured on 3 levels Global, Platform and Component level. To make that particular Toolbar component use Android Material Design Style no matter what platform it is, you can use the "mode" attribute and set it to md.
<ion-toolbar mode="md">
<ion-title>Scrolls with the content</ion-title>
</ion-toolbar>
You can also configure to Windows with wp and IOS with ios values for the mode attribute.
See http://ionicframework.com/docs/v2/api/components/toolbar/Toolbar/ for more details.