Adding text below loader

shamin / react-fullscreen-loading

Minimal fullscreen loading for react

https://codesandbox.io/s/v6z782xow7

MIT License

10 stars 1 forks source link

Adding text below loader #2

Closed willemevenwel closed 4 years ago

willemevenwel commented 4 years ago

hi,

sorry for silly question, im very new to react and components. i like your fullscreen loader, but need to add text to it, like "Loading, please wait...".

could you assist in the matter please?

regards

willem

shamin commented 4 years ago

Hi Willem,

What you want is really easy to achieve. Try to go through and understand the source code it is very easy and what you want can be achieved with the following

Copy https://github.com/shamin/react-fullscreen-loading/blob/master/lib/loading.js and https://github.com/shamin/react-fullscreen-loading/blob/master/lib/styles.css files to your react project
Add Loading, please wait... to this line https://github.com/shamin/react-fullscreen-loading/blob/34549eead619e5ae640337a4a4266e69edd15a3d/lib/loading.js#L16
Style it using css.

If you need more help feel free to comment on the issue. Happy to help you.

willemevenwel commented 4 years ago

Hey shamin,

Thanks so much for your already thorough answer. I'm kinda getting the hang of it, but getting a weird error which I'm unsure about.

What I have done: componentsstructure

And I copied the contents of your library's files into those to files.

I then reference the Loading component like this on a page where I used it before (successfully):

I get an error, and I suppose its related to the way I reference the styles.css file: stylesreference

The error reads: Failed to compile.

./src/pages/Login.jsx Module not found: You attempted to import ../../components/loader/Loading which falls outside of the project src/ directory. Relative imports outside of src/ are not supported.

Again, I'm sorry, I'm a noob to web dev, but can code a little bit, your help is appreciated.

willemevenwel commented 4 years ago

Appologies, I got it working. That error was because referencing the component, from another directory, needed the path to be adjusted.

willemevenwel commented 4 years ago

working

shamin commented 4 years ago

Great. Can I close this issue?

willemevenwel commented 4 years ago

Yes, definitely. Thanks again!!!

On Sun, 15 Dec 2019 at 21:54, Shamin Meerankutty notifications@github.com wrote:

Great. Can I close this issue?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/shamin/react-fullscreen-loading/issues/2?email_source=notifications&email_token=ADIV5XSC4LTKDVH6QHJ7ONLQY2DOTA5CNFSM4J27SKM2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEG5AY5A#issuecomment-565841012, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADIV5XTRJJ5XRD7JV47EI73QY2DOTANCNFSM4J27SKMQ .