Empty State
<gstock-empty-state>
|
GstockEmptyState
Examples
<gstock-empty-state header="You don't have access to this work item"></gstock-empty-state>
Nivel de encabezado personalizado
Utilice el atributo headingLevel para establecer el nivel de encabezado del elemento de encabezado.
El nivel de encabezado que se muestra por defecto es el nivel 4. Para garantizar que el componente sea accesible, los encabezados deben seguir un orden lógico. Si no sigue un h3 o h4 en el orden de lectura, deberá modificar el orden de los encabezados al siguiente nivel lógico.
<gstock-empty-state header="You don't have access to this work item" headinglevel="2"></gstock-empty-state>
Descripción
Utilice el atributo description para mostrar una información adicional útil y relevante.
<gstock-empty-state header="You don't have access to this work item" description="Make sure the work item exists in this project. If it does, ask a project admin for permission to see the project's work items."></gstock-empty-state>
URL de la imagen
Utilice el atributo imageUrl para mostrar una imagen. Este valor se le pasará directamente al atributo src al elemento <img>.
<gstock-empty-state header="You don't have access to this work item" imageurl="/dist/assets/images/connectionFailed.svg"></gstock-empty-state>
Dimensiones de la imagen
Utilice los atributos imageWidth y imageHeight para evitar que el diseño se reajuste cuando se cargan las imágenes. Estos valores se usarán para establecer los atributos width y height en el elemento <img>.
<gstock-empty-state header="You don't have access to this work item" imageurl="/dist/assets/images/connectionFailed.svg" imagewidth="100"></gstock-empty-state>
Dimensiones máximas de la imagen
Utilice los atributos maxImageHeight y maxImageWidth para definir las dimensiones máximas de la imagen.
<gstock-empty-state header="You don't have access to this work item" imageurl="/dist/assets/images/connectionFailed.svg" maximageheight="160" maximagewidth="160"></gstock-empty-state>
Ilustraciones
Connection failed state
<gstock-empty-state header="Network connection failure" imageurl="/dist/assets/images/connectionFailed.svg"></gstock-empty-state>
Not found state
<gstock-empty-state header="Error 404" imageurl="/dist/assets/images/error404.svg"></gstock-empty-state>
No content state
<gstock-empty-state header="No content backup" imageurl="/dist/assets/images/noContentBackup.svg"></gstock-empty-state>
No file found state
<gstock-empty-state header="No file found" imageurl="/dist/assets/images/noFileFound.svg"></gstock-empty-state>
No results state
<gstock-empty-state header="No results" imageurl="/dist/assets/images/noResult.svg"></gstock-empty-state>
Payment failed state
<gstock-empty-state header="Payment failed backup" imageurl="/dist/assets/images/paymentFailed.svg"></gstock-empty-state>
Payment successfully state
<gstock-empty-state header="Payment successfully backed up" imageurl="/dist/assets/images/successfulPayment.svg"></gstock-empty-state>
Whoops state
<gstock-empty-state header="Whoops!" imageurl="/dist/assets/images/whoops.svg"></gstock-empty-state>