photoprism/assets/templates/app.tmpl
Michael Mayer 7cd88e411a Frontend: Improve loading animation and logo
Signed-off-by: Michael Mayer <michael@liquidbytes.net>
2020-07-09 15:01:36 +02:00

17 lines
3.1 KiB
Cheetah

<div id="photoprism" class="container">
<div class="loading-logo">
<svg id="bf303eaa-4f7f-4657-98e1-09c759f6b807" data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 276.76 276.76"><defs><style>.ad7974ae-9077-4cf7-946d-c9d26d9bd0ec,.aff9fe7c-1b26-4aab-ab09-10a36b9d35fe{fill:none;}.e84b6b37-8443-47a3-b543-95bc628df4d4{fill:url(#be66c336-9388-49e8-8e93-763b832aeeba);}.a44eafec-1f47-4a2d-a088-8c103ec15a09{clip-path:url(#a2a8b551-9138-4a50-af6f-be36b6cc4c28);}.efc4f478-24e3-4a42-9271-0e3ab6250738{fill:url(#f7d11e75-3632-4501-a8a2-d3a8c651f10c);}.aff9fe7c-1b26-4aab-ab09-10a36b9d35fe{stroke:#1d1d1b;stroke-miterlimit:10;stroke-width:5px;}</style><linearGradient id="be66c336-9388-49e8-8e93-763b832aeeba" x1="45.04" y1="231.72" x2="231.72" y2="45.04" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fff"/><stop offset="0" stop-color="#c2fde4"/><stop offset="1" stop-color="#cdc6e9"/></linearGradient><clipPath id="a2a8b551-9138-4a50-af6f-be36b6cc4c28"><path class="ad7974ae-9077-4cf7-946d-c9d26d9bd0ec" d="M5.75,437.38A132.63,132.63,0,1,0,138.38,304.75,132.63,132.63,0,0,0,5.75,437.38"/></clipPath><linearGradient id="f7d11e75-3632-4501-a8a2-d3a8c651f10c" x1="-1677.45" y1="-410.57" x2="-1674.78" y2="-410.57" gradientTransform="matrix(104.07, 0, 0, -104.07, 174572.51, -42288.45)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#def400"/><stop offset="0.01" stop-color="#def400"/><stop offset="0.18" stop-color="#e8d471"/><stop offset="0.34" stop-color="#f1b9d4"/><stop offset="0.41" stop-color="#f4aefb"/><stop offset="0.47" stop-color="#e4b3fa"/><stop offset="0.59" stop-color="#b9bff8"/><stop offset="0.75" stop-color="#74d3f5"/><stop offset="0.95" stop-color="#16eff0"/><stop offset="1" stop-color="#00f5ef"/></linearGradient></defs><circle class="e84b6b37-8443-47a3-b543-95bc628df4d4" cx="138.38" cy="138.38" r="132"/><g class="a44eafec-1f47-4a2d-a088-8c103ec15a09"><rect class="efc4f478-24e3-4a42-9271-0e3ab6250738" x="-54.98" y="254.02" width="374.71" height="374.71" transform="translate(-262.59 204.01) rotate(-42.3)"/></g><path id="bfbb97ab-3226-4d8f-b11a-0ce888ece451" data-name="Logo Pfad" class="aff9fe7c-1b26-4aab-ab09-10a36b9d35fe" d="M229.57,181.89l-4,24.19M47.29,182.88l14.81,14M157.86,59.23,62,196.69a.09.09,0,0,0,.07.15l163.41,9.37a.09.09,0,0,0,.09-.13L158,59.25A.1.1,0,0,0,157.86,59.23ZM138.12,45.94,47.18,182.69a.13.13,0,0,0,.11.19l182.18-.8a.12.12,0,0,0,.1-.19L138.33,45.94A.12.12,0,0,0,138.12,45.94Zm.11-.16L158,59.1"/></svg>
</div>
<div class="loading-bar">
<div role="progressbar" aria-valuemin="0" aria-valuemax="100" class="v-progress-linear" style="height: 7px;">
<div class="v-progress-linear__background black" style="height: 7px; opacity: 0.3; width: 100%;"></div>
<div class="v-progress-linear__bar">
<div class="v-progress-linear__bar__indeterminate v-progress-linear__bar__indeterminate--active">
<div class="v-progress-linear__bar__indeterminate long black"></div>
<div class="v-progress-linear__bar__indeterminate short black"></div>
</div><!----></div>
</div>
</div>
</div>
<div id="busy-overlay"></div>