forked from harrytruman/ansible_inventory_report
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathinventory_report_ios.html
91 lines (82 loc) · 3.88 KB
/
inventory_report_ios.html
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
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
<!DOCTYPE html>
<html lang="en">
<head>
<title>Cisco Inventory Report</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- UIkit CSS CDN links -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uikit@3.10.0/dist/css/uikit.min.css" />
<!-- UIkit JS CDN links -->
<script src="https://cdn.jsdelivr.net/npm/uikit@3.10.0/dist/js/uikit.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/uikit@3.10.0/dist/js/uikit-icons.min.js"></script>
<!-- FontAwesome CDN link -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" integrity="sha512-Fo3rlrZj/k7ujTnHg4CGR2D7kSs0v4LLanw2qksYuRlEzO+tcaEPQogQ0KaoGN26/zrn20ImR1DfuLWnOo7aBA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<!-- Custom styling for table responsiveness on smaller screens -->
<style>
@media screen and (max-width: 959px) {
.icon::before {
display: inline-block;
font-style: normal;
font-variant: normal;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
}
table td {
display: block;
text-align: right;
}
table td::before {
float: left;
color: #ee000098;
text-transform: uppercase;
font-family: "Font Awesome 5 Free";
font-weight: 900;
content: attr(data-icon);
}
}
</style>
</head>
<body>
<!--- [0] UIkit: uk-background -->
<div class="uk-background-cover uk-background-muted" uk-height-viewport="expand: true">
<!--- [1] UIkit: uk-container -->
<div class="uk-container">
<img class="uk-margin uk-padding-large uk-align-center" src="roles/inv_report/files/ansible.gif">
<!--- [2] UIkit: uk-card -->
<div class="uk-card uk-card-default uk-card-body uk-card-large uk-card-hover">
<h3 class="uk-card-title uk-text-break">Ansible Inventory Report</h3>
<!--- [3] UIkit: uk-table -->
<table class="uk-table uk-table-responsive uk-table-striped">
<caption class="uk-text-light">
<b>Last Updated: </b>2022-01-21 22:29:15.500882
</caption>
<thead>
<tr>
<th class="uk-text-emphasis uk-text-bolder">Hostname</th>
<th class="uk-text-emphasis uk-text-bolder">Mgmt IP</th>
<th class="uk-text-emphasis uk-text-bolder">Serial</th>
<th class="uk-text-emphasis uk-text-bolder">Model</th>
<th class="uk-text-emphasis uk-text-bolder">OS</th>
<th class="uk-text-emphasis uk-text-bolder">Code Version</th>
</tr>
</thead>
<tbody class="uk-text-light">
<tr>
<td class="uk-text-small" data-icon="">csr1000v-1</td>
<td class="uk-text-small" data-icon="">131.226.217.143</td>
<td class="uk-text-small" data-icon="#">9ESGOBARV9D</td>
<td class="uk-text-small" data-icon="">CSR1000V</td>
<td class="uk-text-small" data-icon="">IOS-XE</td>
<td class="uk-text-small" data-icon="">17.03.01a</td>
</tr>
</tbody>
</table>
<!--- [3] END -->
</div>
<!--- [2] END -->
</div>
<!--- [1] END -->
</div>
<!--- [0] END -->
</body>
</html>