-
Notifications
You must be signed in to change notification settings - Fork 11
/
Copy pathhtml-templates.json
43 lines (43 loc) · 4.02 KB
/
html-templates.json
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
{
"layouts": {
"section-container": "<section class=\"h-100 h-custom\">\n <div class=\"container py-5 h-100\">\n <div class=\"row d-flex justify-content-center align-items-center h-100\">\n <div class=\"col\">\n \n </div>\n </div>\n </div>\n</section>",
"two-column": "<div class=\"row\">\n\n <div class=\"col-lg-7\">\n \n </div>\n <div class=\"col-lg-5\">\n\n \n\n </div>\n\n </div>",
"simple-card": "<div class=\"card\">\n <div class=\"card-body p-4\">\n\n \n\n </div>\n </div>",
"card-primary-rounded": "<div class=\"card bg-primary text-white rounded-3\">\n <div class=\"card-body\">\n <div class=\"d-flex justify-content-between align-items-center mb-4\">\n <h5 class=\"mb-0\">Card details</h5>\n </div>\n\n \n\n </div>\n </div>"
},
"details": {
"card-with-image": {
"container": "",
"content": "<div class=\"card-body\">\n <div class=\"d-flex justify-content-between\">\n <div class=\"d-flex flex-row align-items-center\">\n <div>\n <img\n src=\"https://mdbcdn.b-cdn.net/img/Photos/new-templates/bootstrap-shopping-carts/img2.webp\"\n class=\"img-fluid rounded-3\" alt=\"Shopping item\" style=\"width: 65px;\">\n </div>\n <div class=\"ms-3\">\n <h5>Samsung galaxy Note 10 </h5>\n <p class=\"small mb-0\">256GB, Navy Blue</p>\n </div>\n </div>\n <div class=\"d-flex flex-row align-items-center\">\n <div style=\"width: 50px;\">\n <h5 class=\"fw-normal mb-0\">2</h5>\n </div>\n <div style=\"width: 80px;\">\n <h5 class=\"mb-0\">$900</h5>\n </div>\n <a href=\"#!\" style=\"color: #cecece;\"><i class=\"fas fa-trash-alt\"></i></a>\n </div>\n </div>\n </div>"
},
"label-value": {
"container": "",
"content": "<p class=\"mb-2\">$label$</p>\n <p class=\"mb-2\">$value$</p>"
},
"icon": {
"container": "",
"content": "<i [class]=\"$iconClass$ + ' fab fa-2x me-2'\"></i>"
}
},
"forms": {
"card-form": {
"form": "<form class=\"mt-4\" [formGroup]=\"$formVariable$\" (ngSubmit)=\"$submitCallback$\">\n $content$\n\n </form>",
"formSubmit": "<button type=\"submit\" class=\"btn btn-info btn-block btn-lg\">\n <div class=\"d-flex justify-content-between\">\n <span>$4818.00</span>\n <span>Checkout <i class=\"fas fa-long-arrow-alt-right ms-2\"></i></span>\n </div>\n </button>",
"input": "<mdb-form-control class=\"form-white mb-4\">\n <input mdbInput type=\"text\" id=\"$formControlName$\" class=\"form-control\" />\n <label mdbLabel class=\"form-label\" for=\"$formControlName$\">$label$</label>\n </mdb-form-control>"
}
},
"lists": {
"basket-list": {
"list": "$content$",
"item": " <div class=\"card mb-3\" *ngFor=\"let $itemVariable$ of $listVariable$\">\n $content$\n </div>"
},
"data-list": {
"list": "$content$",
"item": "<div class=\"d-flex justify-content-between\" *ngFor=\"let $itemVariable$ of $listVariable$\">\n $content$\n </div>"
},
"link-list": {
"list": "$content$",
"item": "<a type=\"submit\" class=\"text-white\" *ngFor=\"let $itemVariable$ of $listVariable$\">$content$</a>"
}
}
}