Something went wrong. Try again.
[READ-ONLY] Mirror of https://github.com/lowmess/music. UI experiments with data from Last.fm & Discogs music.lowmess.com
Something went wrong. Try again.
1.2 kB · 38 lines
JavaScript
at master
123456789101112131415161718192021222324252627282930313233343536373839import React from 'react'
const Loading = () => ( <div className="flex flex-column bg-white shadow-5"> <div className="card-image aspect-ratio aspect-ratio--1x1 bb b--light-gray bg-hot-pink"> <div className="aspect-ratio--object flex"> <svg role="presentation" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="64" height="64" fill="none" stroke="currentcolor" strokeWidth="3" className="spinner ma-auto w4 h4 white" style={{ fill: 'none', display: 'inline-block', verticalAlign: 'middle', overflow: 'visible', }} > <title>Loading Icon</title> <path d="M7.991 1.5a6.494 6.494 0 0 1 6.491 6.491 6.494 6.494 0 0 1-6.491 6.491A6.494 6.494 0 0 1 1.5 7.991" /> </svg> </div> </div>
<div className="flex-1 flex flex-column pa3 lh-title"> <div className="card-text h-1 w-two-thirds mw-100 bg-hot-pink f4 f3-l" /> <div className="card-text h-1 w-40 mw-100 mt2 mb4 bg-hot-pink f5 f4-l" /> <div className="h-1 w-third mw-100 mt-auto bg-hot-pink f7" /> </div> </div>)
export default Loading