Work on the admin section styling

This commit is contained in:
Théophile Gervreau-Mercier
2026-02-12 10:37:28 +01:00
parent 8613f71112
commit 0b650cd3e7
4 changed files with 176 additions and 15 deletions

2
.ignore Normal file
View File

@@ -0,0 +1,2 @@
docs
nginx

View File

@@ -78,11 +78,12 @@ function wasSelected($key, $value)
<input type="text" id="auteurice" name="auteurice" placeholder="Nom de l'auteur·ice" value="<?php echo old(
"auteurice",
); ?>" required>
<br>
<label for="mail">Contact (email, site web, insta, ...)</label>
<input type="text" id="mail" name="mail" placeholder="votre.email@example.com ou @instagram" value="<?php echo old(
"mail",
); ?>">
<br>
<label for="année">Année diplômante *</label>
<input type="number" id="année" name="année" min="2000" max="<?php echo date(
"Y",
@@ -113,6 +114,7 @@ function wasSelected($key, $value)
<?php endforeach; ?>
</select>
<br>
<label for="ap">Atelier Pratique (AP) *</label>
<select id="ap" name="ap" required>
<option value="">-- Sélectionner un AP --</option>
@@ -132,6 +134,7 @@ function wasSelected($key, $value)
<?php endforeach; ?>
</select>
<br>
<label for="finality">Finalité du master *</label>
<select id="finality" name="finality" required>
<option value="">-- Sélectionner une finalité --</option>
@@ -149,6 +152,7 @@ function wasSelected($key, $value)
<?php endforeach; ?>
</select>
<br>
<label for="promoteurice">Promoteur·ice(s)</label>
<input type="text" id="promoteurice" name="promoteurice" placeholder="Nom du/de la promoteur·ice (si plusieurs, séparer par des virgules)" value="<?php echo old(
"promoteurice",
@@ -164,18 +168,22 @@ function wasSelected($key, $value)
"titre",
); ?>" required>
<br>
<label for="subtitle">Sous-titre (si applicable)</label>
<input type="text" id="subtitle" name="subtitle" placeholder="Sous-titre de votre TFE" value="<?php echo old(
"subtitle",
); ?>">
<br>
<label for="synopsis">Synopsis (environ 200 mots) *</label>
<textarea id="synopsis" name="synopsis" rows="8" placeholder="Décrivez votre TFE en quelques paragraphes..." required><?php echo old(
"synopsis",
); ?></textarea>
<br>
<label for="problématique">Problématique</label>
<textarea id="problématique" name="problématique" rows="4" placeholder="La problématique principale de votre mémoire..."><?php echo old(
"problématique",
); ?></textarea>
<br>
<label>Langue(s) du TFE * (sélection multiple possible)</label>
<ul class="no-style">
<?php foreach ($languages as $language): ?>
@@ -195,6 +203,7 @@ function wasSelected($key, $value)
<?php endforeach; ?>
</ul>
<br>
<label>Format(s) (sélection multiple possible)</label>
<ul class="no-style">
<?php foreach ($formatTypes as $format): ?>
@@ -214,15 +223,18 @@ function wasSelected($key, $value)
<?php endforeach; ?>
</ul>
<br>
<label for="tag">Mots-clés (max 10, séparés par des virgules)</label>
<input type="text" id="tag" name="tag" placeholder="typographie, photographie, outils libre, post-colonial..." value="<?php echo old(
"tag",
); ?>">
<br>
<small>Séparez les mots-clés par des virgules. Maximum 10 mots-clés.</small>
<label for="duration_info">Durée/Taille (si applicable)</label>
<input type="text" id="duration_info" name="duration_info" placeholder="Ex: 68 minutes, 128 pages, 78 pages + 15 minutes" value="<?php echo old(
"duration_info",
); ?>">
<br>
<small>Indiquez la durée (en minutes) ou le nombre de pages de votre TFE.</small>
<label for="lien">Lien vers un site web ou ressource en ligne</label>
<input type="url" id="lien" name="lien" placeholder="https://monmemoire.erg.be/..." value="<?php echo old(

View File

@@ -7,7 +7,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?php echo htmlspecialchars($pageTitle ?? 'Admin'); ?> - Post-ERG</title>
<link rel="stylesheet" href="/assets/modern-normalize.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/water.css@2/out/water.css">
<link rel="stylesheet" href="/assets/admin.css">
<link rel="shortcut icon" href="/assets/admin_favicon.svg" type="image/svg+xml">
<?php if (php_sapi_name() === 'cli-server'): ?>
@@ -16,7 +15,10 @@
(function poll() {
fetch('/live-reload.php')
.then(r => r.json())
.then(d => { if (d.changed) location.reload(); else setTimeout(poll, 1000); })
.then(d => {
if (d.changed) location.reload();
else setTimeout(poll, 1000);
})
.catch(() => setTimeout(poll, 2000));
})();
</script>
@@ -31,25 +33,25 @@
// Detect current page
$currentPage = basename($_SERVER['PHP_SELF']);
$thesisId = $_GET['id'] ?? null;
// Build navigation based on context
$navLinks = [];
// Always show list
if ($currentPage !== 'index.php') {
$navLinks[] = '<a href="/admin/"><button>📋 Liste des TFE</button></a>';
}
// Show add thesis if not on add page
if ($currentPage !== 'add.php') {
$navLinks[] = '<a href="/admin/add.php"><button> Ajouter un TFE</button></a>';
}
// Show import if not on import page
if ($currentPage !== 'import.php') {
$navLinks[] = '<a href="/admin/import.php"><button>📥 Importer CSV</button></a>';
}
// If on edit or thanks page with thesis ID, show edit and view links
if ($thesisId && in_array($currentPage, ['edit.php', 'thanks.php'])) {
if ($currentPage !== 'edit.php') {
@@ -59,7 +61,7 @@
$navLinks[] = '<a href="/admin/thanks.php?id=' . intval($thesisId) . '"><button>👁️ Voir</button></a>';
}
}
echo implode(' ', $navLinks);
?>
<?php if (defined('ADMIN_PASSWORD_HASH')): ?>

View File

@@ -1,19 +1,164 @@
:root {
--background-body: #3c856bff;
--background: #161f27;
--background-alt: #1a242f;
--selection: #1c76c5;
--text-main: #dbdbdb;
--text-bright: #fff;
--text-muted: #a9b1ba;
--links: #41adff;
--focus: #0096bfab;
--border: ;
--code: #ffbe85;
--animation-duration: 0.1s;
--button-base: #0c151c;
--button-hover: #040a0f;
--scrollbar-thumb: var(--button-hover);
--scrollbar-thumb-hover: color-mod(var(--scrollbar-thumb) lightness(-30%));
--form-placeholder: #a9a9a9;
--form-text: #fff;
--variable: #d941e2;
--highlight: #efdb43;
--select-arrow: svg-load("./assets/select-arrow.svg", fill: #efefef);
}
/* @media (prefers-color-scheme: dark) { */
/* --background-body: #202b38; */
/* --background: #161f27; */
/* --background-alt: #1a242f; */
/* --selection: #1c76c5; */
/* --text-main: #dbdbdb; */
/* --text-bright: #fff; */
/* --text-muted: #a9b1ba; */
/* --links: #41adff; */
/* --focus: #0096bfab; */
/* --border: #526980; */
/* --code: #ffbe85; */
/* --animation-duration: 0.1s; */
/* --button-base: #0c151c; */
/* --button-hover: #040a0f; */
/* --scrollbar-thumb: var(--button-hover); */
/* --scrollbar-thumb-hover: color-mod(var(--scrollbar-thumb) lightness(-30%)); */
/* --form-placeholder: #a9a9a9; */
/* --form-text: #fff; */
/* --variable: #d941e2; */
/* --highlight: #efdb43; */
/* --select-arrow: svg-load("./assets/select-arrow.svg", fill: #efefef); */
/* } */
/* Base Styles */
body {
max-width: 95vw;
margin: auto;
/* background-color: yellow; */
padding: 0;
background-color: var(--background-body);
color: var(--text-main);
font-size: 1.2em;
}
header, main, footer {
margin: auto 2ch;
}
header, footer {
text-align: center;
}
main {
padding: 2ch;
max-width: 80vw;
margin: auto 1.2rem;
/* background-color: yellow; */
max-width: 800px;
margin: 20px auto;
padding: 0 10px;
position: relative;
}
table {
table-layout: auto;
margin: auto;
width: 95vw;
margin-left: calc(50% - 45vw);
/* margin: auto; */
}
table {
width: max-content;
min-width: 95vw; /* optional fallback */
table-layout: auto;
}
/* https://stackoverflow.com/questions/3084261/alternate-table-row-color-using-css */
tr:nth-child(even) {
background-color: #204639;
}
tr:nth-child(odd) {
background-color: #2f6a55;
}
nav {
margin-top: 1rem;
}
fieldset {
border: 1px solid;
border-radius: 6px;
margin: 0;
margin-bottom: 12px;
padding: 1em;
}
legend {
font-size: 0.9em;
font-weight: 600;
}
label {
vertical-align: middle;
margin-bottom: 1em;
display: inline-block;
}
button,
select,
input[type="submit"],
input[type="reset"],
input[type="button"],
input[type="checkbox"],
input[type="range"],
input[type="radio"] {
cursor: pointer;
}
input,
select {
display: block;
}
input,
button,
textarea,
select {
color: var(--form-text);
background-color: var(--background);
font-family: inherit;
font-size: inherit;
margin-right: 6px;
margin-bottom: 6px;
padding: 10px;
border: none;
border-radius: 6px;
outline: none;
}
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
background-color: var(--button-base);
padding-right: 30px;
padding-left: 30px;
}
/* Alert Messages */
.error-message,
.alert-error {
@@ -49,9 +194,9 @@ nav {
}
/* Lists */
ul.no-style {
list-style: none;
}
/* ul.no-style { */
/* list-style: none; */
/* } */
/* Filters */
.filters {