question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Add large spinner (with logo) to Spinner component

See original GitHub issue

The large spinner is primarily used for loading states between pages. The existing small spinner is used for loading states inside buttons.

I believe the large spinner should be the default one, so that would make a breaking change.

Actual implementation

https://auth0-cosmos.now.sh/docs/spinner

Design reference

screen shot 2018-06-08 at 16 24 55

The API for the spinner could be:

size: enum default: spinner with logo small : spinner without logo

For the light and dark version at first I thought of an appearance prop, that defaults to light? wdyt?

The docs could use some love and we will now have a Props table in there!

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:7 (6 by maintainers)

github_iconTop GitHub Comments

2reactions
astanciucommented, Sep 19, 2018

Something to consider: an property to define the layout. Default to centered, but can be overwritten to inline

1reaction
landituscommented, Jun 6, 2018

The spinner doesn’t have props for size, but the new default size for spinner will be bigger. So it will break the UI unless you specify the prop you want. The component rendered by default will be different.

Read more comments on GitHub >

github_iconTop Results From Across the Web

The Four ways to Create Loading Spinners in an Angular App
In this post we went through four ways to create spinners in your Angular application: raw HTML and CSS pre-Angular spinner, spinner component,...
Read more >
Spinners - Bootstrap
Bootstrap “spinners” can be used to show the loading state in your projects. They're built only with HTML and CSS, meaning you don't...
Read more >
How to Create a Loading Spinner (With Animations) - YouTube
In today's video I'll be showing you how to create two different styles of loading spinners using only HTML and CSS.
Read more >
How To Create An Advanced Animated Loading Spinner
Loading spinners are incredibly common in web applications, but it is not always easy to create a good looking and simple loading spinner....
Read more >
Create A Spinner & Add A Loader In React
Using two libraries, styled-components and react-image , I learned a new simple way to create a Loader component (i.e. a spinner) to be...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found