/*
 * Copyright (C) 2024  Umorpha Systems
 * SPDX-License-Identifier: AGPL-3.0-or-later
 */

/* General ********************************************************************/

body {
	font-family: sans-serif;

	margin: 0;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

* {
	box-sizing: border-box;
}
iframe {
	box-sizing: content-box;
}

body > header {
	padding: 0 20px;
	border-bottom: solid 1px black;
}

body > article {
	flex-grow: 2;

	padding: 20px;
}

body > footer {
	border-top: solid 1px black;
	background-color: #fafafa;
	padding: 8px 20px;
}

body > footer a {
	color: #0063c4;
	text-decoration: none;
}

body > footer a:hover,
body > footer a:active,
body > footer a:focus {
	text-decoration: underline;
}

tt, pre {
	background-color: #ddddff;
}

table.job-triggers {
	border-spacing: 0;
	border-radius: 0.8em;
	border: solid 1px black;
	overflow: hidden;
}
table.job-triggers td {
	padding: 0.4em;
}
table.job-triggers td:not(:last-child) {
	border-right: solid 1px black;
}
table.job-triggers tr:not(:last-child) td {
	border-bottom: solid 1px black;
}

/* Jobs page ******************************************************************/

table.jobs {
	border-collapse: collapse;
	height: 1px; /* makes the "height: 100%" bits below work, idk */
}

table.jobs > thead > tr > th,
table.jobs > tbody > tr > td {
	border: solid 1px black;
}
table.jobs > thead > tr > th,
table.jobs > tbody > tr > td > a {
	padding: 0.2em;
}

table.jobs > tbody > tr > td {
	padding: 0;
	height: 100%;
}

table.jobs > tbody > tr:nth-child(odd) > td {
	background-color: #eeeeee;
}

table.jobs > tbody > tr > td > a {
	text-decoration: none;
	display: block;
	width: 100%;
	height: 100%;
	color: black;
}

table.jobs > tbody > tr:hover > td > a {
	background-color: #AAAAF3;
}

table.jobs > tbody > tr > td.job-status { text-align: center; }
table.jobs > tbody > tr.job-new       > td.job-status { background-color: yellow; }
table.jobs > tbody > tr.job-running   > td.job-status { background-color: blue; }
table.jobs > tbody > tr.job-succeeded > td.job-status { background-color: green; }
table.jobs > tbody > tr.job-failed    > td.job-status { background-color: red; }
table.jobs > tbody > tr.job-error     > td            { background-color: red; }

/* Job page *******************************************************************/

dl.job dt::after {
	content: ":";
}

dl.job dd.job-status.job-new       { background-color: yellow; }
dl.job dd.job-status.job-running   { background-color: blue; }
dl.job dd.job-status.job-succeeded { background-color: green; }
dl.job dd.job-status.job-failed    { background-color: red; }
dl.job dd.job-status.job-error     { background-color: red; }

iframe {
	width: 100%;
}