github-personal/step-ca-webui
1
0
Fork 0
mirror of https://github.com/outbackdingo/step-ca-webui.git synced 2026-01-27 10:20:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

main done (without modal)

Browse Source
This commit is contained in:
stone-24tch3r
2024-09-24 21:20:20 +05:00
parent 19ed1ac29e
commit 94b1c1a9de
2 changed files with 79 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

134
front/main.html
View File

@@ -18,69 +18,77 @@
</div>
<div class="main-container">
<h1 class="main-container-header">Certificate Management</h1>
<table class="certs-table">
<thead class="certs-table-header">
<tr>
<th>Cert Name</th>
<th>Status</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tr>
<td>Cert 1</td>
<td>Active</td>
<td class="actions-container-td">
<button class="action-button">Renew</button>
<button class="action-button">Revoke</button>
<button class="action-button">View</button>
<button class="action-button">Do smth else</button>
</td>
</tr>
<tr>
<td>Cert 2</td>
<td>Expired</td>
<td class="actions-container-td">
<button class="action-button">Delete</button>
</td>
</tr>
<tr>
<td>Cert 3</td>
<td>Test</td>
<td class="actions-container-td">
<button class="action-button">Delete</button>
</td>
</tr>
<tr>
<td>Cert 4</td>
<td>Test</td>
<td class="actions-container-td">
<button class="action-button">Delete</button>
</td>
</tr>
<tr>
<td>Cert 5</td>
<td>Test</td>
<td class="actions-container-td">
<button class="action-button">Delete</button>
</td>
</tr>
<tr>
<td>Cert 6</td>
<td>Test</td>
<td class="actions-container-td">
<button class="action-button">Delete</button>
</td>
</tr>
<tr>
<td>Cert 7</td>
<td>Test</td>
<td class="actions-container-td">
<button class="action-button">Delete</button>
</td>
</tr>
</tbody>
</table>
<div class="certs-table-container">
<table class="certs-table">
<thead class="certs-table-header">
<tr>
<th>Cert Name</th>
<th>Status</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tr>
<td>Cert 1</td>
<td>Active</td>
<td class="actions-container-td">
<button class="action-button">Renew</button>
<button class="action-button">Revoke</button>
<button class="action-button">View</button>
<button class="action-button">Do smth else</button>
</td>
</tr>
<tr>
<td>Cert 2</td>
<td>Expired</td>
<td class="actions-container-td">
<button class="action-button">Delete</button>
<button class="action-button">Delete</button>
</td>
</tr>
<tr>
<td>Cert 3</td>
<td>Test</td>
<td class="actions-container-td">
<button class="action-button">Delete</button>
<button class="action-button">Yes</button>
<button class="action-button">No no no</button>
</td>
</tr>
<tr>
<td>Cert 5</td>
<td>Test</td>
<td class="actions-container-td">
<button class="action-button">Delete</button>
</td>
</tr>
<tr>
<td>Cert 4</td>
<td>Test</td>
<td class="actions-container-td">
<button class="action-button">Delete</button>
<button class="action-button">I</button>
<button class="action-button">Love</button>
<button class="action-button">You</button>
</td>
</tr>
<tr>
<td>Cert 6</td>
<td>Test</td>
<td class="actions-container-td">
<button class="action-button">Delete</button>
</td>
</tr>
<tr>
<td>Cert 7</td>
<td>Test</td>
<td class="actions-container-td">
<button class="action-button">Delete</button>
</td>
</tr>
</tbody>
</table>
</div>
<button id="generateCertBtn" class="generate-button">Generate New Certificate</button>
</div>

13
front/styles.css
View File

@@ -35,7 +35,6 @@ body {
}
}
.nav-button {
background-color: #aa0000;
color: white;
@@ -70,7 +69,7 @@ body {
margin-top: 0;
}
.certs-table {
.certs-table-container {
width: 100%;
border-collapse: collapse;
margin-top: 20px;
@@ -79,6 +78,10 @@ body {
padding: 10px;
}
.certs-table {
width: 100%;
}
th, td {
border: 1px solid #ddd;
padding: 8px;
@@ -104,13 +107,13 @@ th {
}
@media screen and (min-width: 451px) and (max-width: 600px) {
.actions-container-td:has(button:nth-child(3)) {
.actions-container-td {
flex-direction: column;
align-items: center;
}
.actions-container-td button {
width: 70%;
width: 70%;
}
}