Replacing the Remove Icon from FileInput in react-admin - react-admin

In the FileInput component, when a file has been dropped in the drop zone, it appears below the zone with a remove icon that I'd like to change (it's a wrong-way sign and I find it a bit hard to understand. I'd like to replace it with a simple trash icon).
How could I do that? I haven't seen any props related to that in the documentation.
Thanks

Related

Quasar Framework: How to use a different icon set with QUploader

Quasar's documentation is usually really good, so I was surprised to find no information for how to change the default icons in the QUploader component.
I'm using the mdi-v5 icon set. When I load up the component, instead of a plus icon on top right, it just looks like this:
I've scoured the docs, but there doesn't seem to be any way to customise the icons on this particular component. Surely this can be done??
Use Slots:
In the example below we’re showing the equivalent of the default
header.
Check the Official Documentation, in the Custom Header you can customize the icon.
https://quasar.dev/vue-components/uploader#example--custom-header
Edit:
Looks like you have to change the Icon Set in the configuration file, here a video from Luke where shows the process,
https://quasarcast.com/quasar-getting-started/quasar-getting-started-guide-3-skeleton-part-1

Can i create multiple global style sheet for user change?

I'm the beginner of react-native.
I'm going to provide change global font size function in my app.
User could change the font size in setting page, them the whole app font size will be adjusted.
After doing some research, it seems can't do it. So my idea now is create multiple global style sheet and apply it base on the user setting saved in storage.
But I found that it seems not work, because after create global style sheet, it need to import at the beginning of the app page.
How can I apply change the app global style or font size in react-native?
You might want take a look at useContext hook, it will give you a good way to handle app global style, suck as light or dark theme, your case, font is also not a problem.
Another way is using react-redux, create a global state for your font, and all your component will listen to the font value stored in the store.
Let's keep it abstract. How I would do it: create and assign a theme for your app where you define classes with different font-sizes etc. Save the preferences as classes in the async storage. After loading the up retrieve saved preferences from async storage and set those to your components as classes. Job done.

How to use the react-i18next <Trans> component properly

In their examples on github, and in other places, react-i18next seem to suggest that we should use their Trans component by filling it with some kind of text, which to my understanding does not appear in the resulting app in any way since it gets overwritten by the default locale. What's it for? Is it just there to make sure react doesn't optimize away the components?
An old question, but this fantastic resource here really helped me wrap my head around the <Trans /> component.
So after doing some more research, and trying a few suggestions, it seems that the recommended way to use <Trans> is to use the default text as a key in your autogenerated translation files, so
<Trans>Lorem ipsum</Trans>
in your code would give you
{"Lorem ipsum": "Lorem ipsum"}
in your default locale file, which could then be translated like
{"Lorem ipsum": "Löksås yxskaft"}

aurelia-dialog changed styles on upgrade

We tried to upgrade aurelia-dialog from beta.3.0.0 to rc.1.0.3 and found that 2 problems in all our dialog views:
The header does not have width 100% as it was before, it only shows header text, looks like "width:-webkit-fit-content" affected this.
The dialog body became transparent, so we see underlying elements.
How to we avoid this?
Since rc.1 they switched their 'ai' prefix to 'ux', so now you have to type <ux-dialog> instead of <ai-dialog>
This is probably the reason your layout isn't rendering right.
You can see the changelog here

ExtJS - Changing default button styles and fonts

I have this requirement where I have to change the default styles on my Ext JS application. I am not talking about changing stuff in CSS files yet. I am not that ambitious yet. Here is what I am looking for:
Suppose I need a Submit and Cancel buttons, I use xtype:button and text:Save ( or Cancel ). This will render buttons with the text on them. What should I do if I want to change the look and feel of the button? Or replace the button with a cool Save or Cancel image?
Right now I have all the texts on the application with the default font that ExtJS shows. What am I supposed to do if I want all the text on the application changed to a different font? Everything right from the data in forms/grids and the titles of each component should be changed to some other font my customer prefers. What am I supposed to do?
I understand these are very basic and a generic questions, but I am looking for a good headsup before I proceed with my task.
Thank you all in advance. Waiting for answers :)
Update: So, I found out how we deal with CSS and change the fonts. Can anyone help about the Chaning the look and feel for Submit/Cancel buttons.
I recommend you to use SASS and compass to build your own themes, or better said to change one the existing themes. In the Ext JS documentation you can find the css variables which you can set according to your needs.
If you are not ready for theming with SASS just yet take a look at this example of button configs from the sencha docs:
Stanadalone Example page: http://docs.sencha.com/extjs/4.1.3/extjs-build/examples/button/button.html
CSS that adds customized images to the buttons: http://docs.sencha.com/extjs/4.1.3/extjs-build/examples/button/button.css
JS that shows button configs: http://docs.sencha.com/extjs/4.1.3/extjs-build/examples/button/button.js
Essentially this shows how to use iconCls property on the button config along with a simple CSS class to add desired image to your button.