tsai
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Budibase is an open-source low-code platform for creating internal apps in minutes. Supports PostgreSQL, MySQL, MSSQL, MongoDB, Rest API, Docker, K8s 🚀
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
8030 Commits
2 Branches
842 Tags
313 MiB
 
 
 
 
 
 
Tree: f9914a3ba4
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'f9914a3ba4'
${ noResults }
budibase/packages/standard-components/node_modules/@spectrum-css/progressbar/metadata/meter.yml

34 lines
2.1 KiB
Raw Blame History

name: Meter
description: Meter is implemented using the [Progress bar](progressbar.html) component. Refer to the [Progress bar API docs](progressbar.html) for API details.
SpectrumSiteSlug: https://spectrum.adobe.com/page/meter/
examples:
- id: meter-small
name: Standard
markup: |
<div style="margin: 20px 0;">
<div class="spectrum-ProgressBar spectrum-ProgressBar--sizeM is-positive" value="50" role="progressbar" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">
<div class="spectrum-FieldLabel spectrum-FieldLabel--sizeM spectrum-ProgressBar-label">Storage Space</div>
<div class="spectrum-FieldLabel spectrum-FieldLabel--sizeM spectrum-ProgressBar-percentage">50%</div>
<div class="spectrum-ProgressBar-track">
<div class="spectrum-ProgressBar-fill" style="width: 50%;"></div>
</div>
</div>
</div>
<div style="margin: 20px 0;">
<div class="spectrum-ProgressBar spectrum-ProgressBar--sizeM is-notice" value="80" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100">
<div class="spectrum-FieldLabel spectrum-FieldLabel--sizeM spectrum-ProgressBar-label">Storage Space</div>
<div class="spectrum-FieldLabel spectrum-FieldLabel--sizeM spectrum-ProgressBar-percentage">80%</div>
<div class="spectrum-ProgressBar-track">
<div class="spectrum-ProgressBar-fill" style="width: 80%;"></div>
</div>
</div>
</div>
<div style="margin: 20px 0;">
<div class="spectrum-ProgressBar spectrum-ProgressBar--sizeM is-negative" value="90" role="progressbar" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100">
<div class="spectrum-FieldLabel spectrum-FieldLabel--sizeM spectrum-ProgressBar-label">Storage Space</div>
<div class="spectrum-FieldLabel spectrum-FieldLabel--sizeM spectrum-ProgressBar-percentage">90%</div>
<div class="spectrum-ProgressBar-track">
<div class="spectrum-ProgressBar-fill" style="width: 90%;"></div>
</div>
</div>
</div>