> For the complete documentation index, see [llms.txt](https://docs.enate.net/enate-help/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.enate.net/enate-help/integrations/enate-integrations/custom-card-content/custom-card-html.md).
# Custom Card HTML
The HTML section is where you can build your UI. We recommend visiting following articles in the Angular.io help files first to learn about how templates work.
* [Template Syntax](https://angular.io/guide/template-syntax)
* [Interpolation](https://angular.io/guide/interpolation)
* [Template Statements](https://angular.io/guide/template-statements)
* [Property Binding](https://angular.io/guide/property-binding)
* [Attribute Binding](https://angular.io/guide/attribute-binding)
* [Event Binding](https://angular.io/guide/event-binding)
* [Two-Way Binding](https://angular.io/guide/two-way-binding)
### Custom Card Directives - View & Update Data Fields
We have created a few directives for different data type fields which allow you to see and update the data field value. Please note that this directive is compatible with the 'disable state', meaning that if a work item is not editable then such fields will be in read-only mode and the user will not be able to update data field values.
1\. For Boolean Fields
```
```
2\. Date & Time Fields
```
```
3\. Email Address Fields
```
```
4\. List Field
```
```
5\. Long Text Fields
```
```
6\. Number Fields
```
```
7\. Text Fields
```
```
### Sample HTML Code
Here are a couple of examples of HTML code you can write within a Custom Card
1\. Add Input control for text field with basic HTML input control:
```
```
2\. Add Input control for text field with directive control:
```
```
Twitter-bootstrap version 4.x.x is being used as as a base CSS, so you can use any component class in your HTML elements and CSS will be applied at runtime. For more information about this, please go to
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.
Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:
```
GET https://docs.enate.net/enate-help/integrations/enate-integrations/custom-card-content/custom-card-html.md?ask=&goal=
```
`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.