C3L-NOC/tls-expiry-tracker Changeset - 3bdd5368892d · Chaos Computer Club Lëtzebuerg Projects

Changeset - 3bdd5368892d

Parent rev.

Child rev.

[Not reviewed]

0 0 2

x - 19 months ago 2024-01-05 00:12:11
xbr@c3l.lu

feat: basic index with both flex and table data

2 files changed with 152 insertions and 0 deletions:

frontend/index.html

frontend/style.css

0 comments (0 inline, 0 general)

frontend/index.html

➞

Show inline comments

@@ new file 100644 @@
 <!DOCTYPE html>
 <html>
 	<head>
 		<meta charset="UTF-8">
 		<title>TLS Outage Tracker</title>
 		<link rel="stylesheet" type="text/css" href="style.css">
         <meta name="viewport" content="width=device-width,initial-scale=1" />
 	</head>
 	<body>
     <div class="countup">
 			<p class="countup__item countup__tls"><span id="time__tls">0</span> days</p>
 			<p class="countup__item countup__text">since last outage caused by TLS expiry</p>
     </div>
     <div class="logs">
         <p class="logs__title">Last incidents</h2>
         <div class="logs__item">
             <p class="logs__item__name">c3l.lu</p>
             <p class="logs__item__date">3 days ago</p>
         </div>
         <div class="logs__item">
             <p class="logs__item__name">social.c3l.lu</p>
             <p class="logs__item__date">3 days ago</p>
         </div>
         <div class="logs__item">
             <p class="logs__item__name">media.c3l.lu</p>
             <p class="logs__item__date">3 days ago</p>
         </div>
         <div class="logs__item">
             <p class="logs__item__name">smtp.c3l.lu</p>
             <p class="logs__item__date">3 days ago</p>
         </div>
         <table>
             <tbody>
                 <tr>
                     <td>c3l.lu</td>
                     <td>3 days ago</td>
                 </tr>
             </tbody>
             <tbody>
                 <tr>
                     <td>social.c3l.lu</td>
                     <td>5 days ago</td>
                 </tr>
             </tbody>
             <tbody>
                 <tr>
                     <td>mail.c3l.lu</td>
                     <td>10 days ago</td>
                 </tr>
             </tbody>
         </table>
     </div>
 	</body>
 </html>

frontend/style.css

➞

Show inline comments

@@ new file 100644 @@
 /* Defaults */
 * {
 	font: inherit;
 	padding: 0px;
 	margin: 0px;
+}
 a {
 	text-decoration: none;
 	color: inherit;
+}
 /* General */
 body {
 	background-color: #393939;
 	color: #d2d2d2;
     font-family: "Helvetica", "Arial", sans-serif;
     font-size: 20px;
+}
 /*
    COUNT UP
 */
 /* Links (block) on home page*/
 .countup {
 	font-size: 48px;
 	line-height: 52px;
     text-align: center;
 	margin-top: 15vh;
 	display: flex;
     flex-direction: column;
 	justify-content: center;
 	align-items: center;
+}
 /* Text on home page */
 .countup__item {
 	display: block;
+}
 .countup__tls {
 	font-size: 100px;
 	line-height: 150px;
+}
 /*
    LOGS
 */
 .logs {
     margin:auto;
     max-width: 50vw;
     min-width: 50vw;
     margin-top: 2.5vh;
     border-radius: 0.1rem;
     border-style: solid;
     border-color: #454545;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     background-image: repeating-linear-gradient(135deg, #393939, #393939 5px, #454545 5px, #454545 9px);
+}
 .logs__title {
     display: block;
     margin-top: 1vh;
     margin-bottom: 1vh;
     font-size: 30px;
     text-decoration: underline;
+}
 .logs__item {
     display: flex;
     flex-direction: row;
     justify-content: space-evenly;
     width: 95vh;
     margin-bottom: 1vh;
+}
 table {
     margin-left: auto;
     margin-right: auto;
+}
 td {
     padding: 5px 20px;
+}
@@ \ No newline at end of file @@

0 comments (0 inline, 0 general)