feat: extract MediaController, wire into Dispatcher, delete media.php

This commit is contained in:
Pontoporeia
2026-04-20 12:32:00 +02:00
parent b03be51b92
commit 75f808bee4
157 changed files with 1713 additions and 452 deletions
+21
View File
@@ -0,0 +1,21 @@
# CSS Architecture
## File Structure
- **variables.css** — all CSS custom properties (single source of truth for every color/token)
- **common.css** — reset, header/nav, search bar, accessibility utilities (loaded on all pages)
- **main.css** — home page
- **search.css** — search/directory page
- **tfe.css** — individual thesis page
- **apropos.css** — about + licence pages
- **system.css** — admin system dashboard
- **admin.css** — admin section (loaded alongside `common.css` on every admin page)
- **modern-normalize.min.css** — third-party reset (minified, do not edit)
## Rules
- Every color value lives in `variables.css` as a CSS custom property.
- No hardcoded hex, rgb(), or rgba() in any other file.
- All files `@import url("./variables.css")` at the top.
- Admin and public share the same token names — no separate admin theme.
- No dark-mode media query. System page uses the same light tokens as the rest of the admin section.
File diff suppressed because it is too large Load Diff
+350
View File
@@ -0,0 +1,350 @@
/* ============================================================
À PROPOS PAGE (apropos.php)
============================================================ */
@import url("./variables.css");
/* ------------------------------------------------------------------ */
/* Page shell */
/* ------------------------------------------------------------------ */
.apropos-body {
display: flex;
flex-direction: column;
min-height: 100vh;
background: var(--bg-primary);
}
.apropos-main {
flex: 1;
padding: var(--space-xl) var(--space-l) var(--space-2xl);
}
/* ------------------------------------------------------------------ */
/* Two-column layout: sticky TOC nav | content */
/* ------------------------------------------------------------------ */
.apropos-layout {
display: grid;
grid-template-columns: 180px 1fr;
gap: var(--space-2xl);
max-width: 860px;
margin: 0 auto;
align-items: start;
}
/* ------------------------------------------------------------------ */
/* Left — sticky table of contents */
/* ------------------------------------------------------------------ */
.apropos-toc {
position: sticky;
top: var(--space-l);
}
.apropos-toc-label {
font-family: var(--font-body);
font-size: var(--step--2);
font-weight: 600;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--text-tertiary);
margin: 0 0 var(--space-2xs) 0;
}
.apropos-toc ul {
list-style: none;
margin: 0 0 var(--space-m) 0;
padding: 0;
display: flex;
flex-direction: column;
gap: var(--space-3xs);
}
.apropos-toc ul a {
font-family: var(--font-body);
font-size: var(--step--1);
color: var(--text-secondary);
text-decoration: none;
display: block;
padding: var(--space-3xs) 0;
transition: color 0.15s;
border-left: 2px solid transparent;
padding-left: var(--space-2xs);
}
.apropos-toc ul a:hover {
color: var(--text-primary);
border-left-color: var(--accent-primary);
}
.apropos-toc-erg {
padding-top: var(--space-s);
border-top: 1px solid var(--border-primary);
}
.apropos-toc-erg a {
font-size: var(--step--2);
color: var(--accent-primary);
text-decoration: none;
transition: opacity 0.15s;
}
.apropos-toc-erg a:hover {
opacity: 0.75;
}
/* ------------------------------------------------------------------ */
/* Right — main content area */
/* ------------------------------------------------------------------ */
.apropos-content {
display: flex;
flex-direction: column;
gap: 0;
}
.apropos-section {
padding-bottom: var(--space-xl);
border-bottom: 1px solid var(--border-primary);
margin-bottom: var(--space-xl);
}
.apropos-section:last-child {
border-bottom: none;
margin-bottom: 0;
padding-bottom: 0;
}
/* ------------------------------------------------------------------ */
/* Section titles */
/* ------------------------------------------------------------------ */
.apropos-section-title {
font-family: var(--font-display);
font-size: var(--step-3);
font-weight: 400;
color: var(--text-primary);
margin: 0 0 var(--space-m) 0;
line-height: 1.1;
}
/* ------------------------------------------------------------------ */
/* Intro prose — Markdown-rendered content */
/* ------------------------------------------------------------------ */
.prose {
font-family: var(--font-body);
font-size: var(--step-0);
line-height: 1.6;
color: var(--text-primary);
font-weight: 400;
}
.prose p {
margin: 0 0 1em 0;
}
.prose p:last-child {
margin-bottom: 0;
}
.prose h1,
.prose h2,
.prose h3 {
font-family: var(--font-display);
font-weight: 400;
margin: 1.5em 0 0.5em 0;
}
.prose h1 { font-size: var(--step-3); }
.prose h2 { font-size: var(--step-2); }
.prose h3 { font-size: var(--step-1); }
.prose a {
color: var(--accent-primary);
text-decoration: underline;
text-underline-offset: 2px;
}
.prose ul,
.prose ol {
padding-left: var(--space-m);
margin-bottom: var(--space-s);
}
.prose li {
margin-bottom: 0.3em;
}
.prose strong { font-weight: 700; }
.prose em { font-style: italic; }
.prose code {
font-family: "Courier New", Courier, monospace;
font-size: 0.88em;
background: var(--bg-tertiary);
padding: 0.1em 0.3em;
border-radius: 2px;
}
/* ------------------------------------------------------------------ */
/* Contacts grid */
/* ------------------------------------------------------------------ */
.apropos-contacts-grid {
display: flex;
flex-direction: column;
gap: 0;
}
.apropos-contact-card {
font-style: normal;
padding: var(--space-s) 0;
border-bottom: 1px solid var(--border-primary);
}
.apropos-contact-card:first-child {
border-top: 1px solid var(--border-primary);
}
.apropos-contact-card strong {
display: block;
font-size: var(--step-0);
font-weight: 600;
color: var(--text-primary);
margin-bottom: var(--space-3xs);
}
.apropos-contact-card span {
display: block;
font-size: var(--step--1);
color: var(--text-secondary);
line-height: 1.4;
margin-bottom: var(--space-3xs);
}
.apropos-contact-card a {
font-size: var(--step--1);
color: var(--accent-primary);
text-decoration: underline;
text-underline-offset: 2px;
transition: opacity 0.15s;
}
.apropos-contact-card a:hover {
opacity: 0.75;
}
/* ------------------------------------------------------------------ */
/* Credits list */
/* ------------------------------------------------------------------ */
.apropos-credits-list {
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 0;
}
.apropos-credit-row {
display: grid;
grid-template-columns: 1fr 1.6fr;
gap: var(--space-s);
padding: var(--space-s) 0;
border-bottom: 1px solid var(--border-primary);
align-items: baseline;
}
.apropos-credit-row:first-child {
border-top: 1px solid var(--border-primary);
}
.apropos-credits-list dt {
font-size: var(--step--2);
font-weight: 600;
letter-spacing: 0.04em;
text-transform: uppercase;
color: var(--text-tertiary);
}
.apropos-credits-list dd {
font-size: var(--step--1);
color: var(--text-primary);
margin: 0;
line-height: 1.5;
}
/* ------------------------------------------------------------------ */
/* Single-column layout — used by licence.php (no sidebar) */
/* ------------------------------------------------------------------ */
.apropos-single {
max-width: 720px;
}
/* ------------------------------------------------------------------ */
/* Responsive */
/* ------------------------------------------------------------------ */
@media (max-width: 900px) {
.apropos-layout {
grid-template-columns: 1fr;
gap: var(--space-l);
}
.apropos-toc {
position: static;
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--space-s);
padding-bottom: var(--space-s);
border-bottom: 1px solid var(--border-primary);
}
.apropos-toc-label {
margin: 0;
}
.apropos-toc ul {
flex-direction: row;
margin: 0;
gap: var(--space-xs);
}
.apropos-toc ul a {
border-left: none;
padding-left: 0;
}
.apropos-toc-erg {
border-top: none;
padding-top: 0;
margin-left: auto;
}
.prose {
font-size: var(--step-0);
}
.apropos-section-title {
font-size: var(--step-2);
}
}
@media (max-width: 600px) {
.apropos-main {
padding: var(--space-m) var(--space-s) var(--space-xl);
}
.prose {
font-size: var(--step-0);
}
.apropos-credit-row {
grid-template-columns: 1fr;
gap: var(--space-3xs);
}
}
+263
View File
@@ -0,0 +1,263 @@
@import url("./variables.css");
@font-face {
font-family: "Ductus";
src: url("../fonts/DuctusRegular.otf") format("opentype");
font-style: normal;
font-weight: 400;
font-display: swap;
}
@font-face {
font-family: "BBBDMSans";
src: url("../fonts/BBBDMSans-Light.otf") format("opentype");
font-style: normal;
font-weight: 300;
font-display: swap;
}
@font-face {
font-family: "BBBDMSans";
src: url("../fonts/BBBDMSans-Regular.otf") format("opentype");
font-style: normal;
font-weight: 400;
font-display: swap;
}
@font-face {
font-family: "BBBDMSans";
src: url("../fonts/BBBDMSans-Medium.otf") format("opentype");
font-style: normal;
font-weight: 500;
font-display: swap;
}
@font-face {
font-family: "BBBDMSans";
src: url("../fonts/BBBDMSans-Bold.otf") format("opentype");
font-style: normal;
font-weight: 700;
font-display: swap;
}
*,
*::before,
*::after {
box-sizing: border-box;
}
html,
body {
margin: 0;
padding: 0;
height: 100%;
}
body {
font-family: var(--font-body);
background: var(--bg-primary);
color: var(--text-primary);
}
a {
color: inherit;
text-decoration: none;
}
a:hover {
text-decoration: none;
}
/* ============================================================
HEADER / NAV BAR (public pages)
============================================================ */
body > header {
flex-shrink: 0;
background: linear-gradient(
180deg,
var(--gradient-1) 0%,
var(--gradient-2) 33%,
var(--gradient-3) 66%,
var(--gradient-4) 100%
);
}
body > header nav {
padding: var(--space-s) var(--space-s);
display: flex;
align-items: center;
justify-content: space-between;
}
.nav-logo {
font-family: var(--font-display);
font-size: var(--step-2);
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--accent-foreground);
text-decoration: none;
text-shadow:
0 0 16px var(--header-shadow-strong),
0 0 32px var(--header-shadow-soft);
}
.nav-left {
display: flex;
align-items: center;
gap: var(--space-l);
}
.nav-left-links,
.nav-right-links {
display: flex;
gap: var(--space-l);
align-items: center;
list-style: none;
margin: 0;
padding: 0;
}
body > header nav > a {
font-family: var(--font-display);
font-size: var(--step-0);
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--accent-foreground);
text-decoration: none;
}
body > header nav > ul {
display: flex;
gap: var(--space-l);
align-items: center;
list-style: none;
margin: 0;
padding: 0;
}
body > header nav ul a {
font-size: var(--step--1);
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--accent-foreground);
text-decoration: none;
transition: opacity 0.15s;
}
/* Subtle shadow on all header text to improve legibility against the gradient */
body > header nav > a,
body > header nav ul a {
text-shadow:
0 0 16px var(--header-shadow-strong),
0 0 32px var(--header-shadow-soft);
}
body > header nav ul a:hover {
opacity: 1;
}
body > header nav ul a[aria-current="page"] {
opacity: 1;
border-bottom: 1px solid var(--header-nav-active-border);
padding-bottom: 1px;
}
/* ============================================================
SEARCH BAR (shared)
============================================================ */
.header-search-wrap {
padding: 0 0;
background-color: var(--gradient-4);
background: linear-gradient(
180deg,
var(--gradient-4) 0%,
#ffffffee 100%
);
}
.header-search-wrap form[role="search"] {
display: flex;
align-items: center;
gap: var(--space-2xs);
padding: var(--space-3xs) var(--space-s);
border: 1px solid var(--accent-primary);
border-radius: 10px;
background: var(--bg-primary);
width: 100%;
color: var(--accent-primary);
}
.header-search-wrap form[role="search"] svg {
color: var(--text-tertiary);
flex-shrink: 0;
width: 16px;
height: 16px;
stroke: var(--accent-primary);
}
.header-search-wrap form[role="search"] input {
flex: 1;
border: none;
font-size: var(--step--1);
color: var(--text-primary);
background: transparent;
padding: var(--space-3xs) 0;
font-family: inherit;
}
.header-search-wrap form[role="search"] input::placeholder {
color: var(--accent-primary);
}
/* ============================================================
ACCESSIBILITY UTILITIES
============================================================ */
/* Visually-hidden but screen-reader-accessible */
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
/* Skip-to-content link (visible only on keyboard focus) */
.skip-link {
position: absolute;
top: -999px;
left: 1rem;
z-index: 9999;
padding: var(--space-2xs) var(--space-s);
background: var(--accent-primary);
color: var(--text-primary);
font-size: var(--step--1);
font-weight: 600;
text-decoration: none;
border-radius: 0 0 4px 4px;
}
.skip-link:focus {
top: 0;
}
/* Consistent keyboard-focus outline for all interactive elements */
:focus-visible {
outline: 2px solid var(--accent-primary);
outline-offset: 2px;
}
/* Respect user motion preferences */
@media (prefers-reduced-motion: reduce) {
*,
*::before,
*::after {
transition-duration: 0.01ms !important;
animation-duration: 0.01ms !important;
}
}
+275
View File
@@ -0,0 +1,275 @@
/* ============================================================
HOME PAGE (index.php)
============================================================ */
@import url("./variables.css");
.home-body {
display: flex;
flex-direction: column;
height: 100vh;
overflow: hidden;
background: var(--bg-primary);
}
/* Cards grid — scrollable main area */
.home-main {
flex: 1;
overflow-y: auto;
overflow-x: hidden;
padding: 0;
}
.cards-container {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
gap: var(--space-s);
list-style: none;
margin: 0;
padding: var(--space-xs) var(--space-s) var(--space-m);
}
@media (min-width: 1400px) {
.cards-container {
grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}
}
@media (max-width: 768px) {
.cards-container {
grid-template-columns: repeat(2, 1fr);
}
}
/* Each card = list item containing a block <a> link */
.card {
display: flex;
flex-direction: column;
cursor: pointer;
border: 1px solid var(--border-primary);
border-radius: 8px;
background: var(--bg-primary);
overflow: hidden;
transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.card:hover {
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
transform: translateY(-2px);
}
.card > a {
text-decoration: none;
color: inherit;
display: flex;
flex-direction: column;
flex: 1;
border-radius: inherit;
}
/* Media wrapper: <figure> for real images/video, <div class="card__media--gradient"> for placeholders */
.home-body figure {
width: 100%;
aspect-ratio: 4/3;
overflow: hidden;
background: var(--bg-tertiary);
position: relative;
margin: 0; /* reset <figure> default margin */
border-radius: 7px 7px 0 0;
}
.home-body figure img,
.home-body figure video {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition: transform 0.3s ease;
}
.card:hover figure img,
.card:hover figure video {
transform: scale(1.02);
}
.card__media--placeholder {
width: 100%;
height: 100%;
background: linear-gradient(135deg, var(--bg-tertiary), var(--bg-active));
display: flex;
align-items: center;
justify-content: center;
color: var(--text-tertiary);
font-size: var(--step-3);
}
.card__media--gradient {
width: 100%;
aspect-ratio: 4/3;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: var(--space-s);
text-align: center;
box-sizing: border-box;
border-radius: 7px 7px 0 0;
background: linear-gradient(
180deg,
rgba(60, 133, 108, 1) 0%,
rgba(96, 236, 180, 1) 33%,
rgba(227, 144, 255, 1) 66%,
rgba(149, 87, 181, 1) 100%
);
}
.card__gradient-author {
color: var(--accent-foreground);
font-size: var(--step--2);
opacity: 0.85;
margin-bottom: 0.25rem;
display: block;
}
.card__gradient-title {
color: var(--accent-foreground);
font-size: var(--step--1);
font-weight: 600;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}
/* Section label */
.home-section-label {
font-style: normal;
background: transparent;
color: var(--text-primary);
font-size: var(--step--2);
font-weight: 600;
letter-spacing: 0.1em;
text-transform: uppercase;
padding: var(--space-s) var(--space-s) var(--space-xs);
border-bottom: 1px solid var(--border-primary);
margin: 0;
}
/* Card caption — <p> directly inside the card <a> link, below the media */
.home-body li > a > p {
padding: var(--space-2xs) var(--space-xs) var(--space-xs);
font-size: var(--step--1);
line-height: 1.35;
color: var(--text-primary);
margin: 0;
font-weight: 400;
border-top: 1px solid var(--border-primary);
}
/* Empty-state message shown when no cards exist */
.cards-empty {
padding: var(--space-l);
color: var(--text-tertiary);
font-size: var(--step--1);
list-style: none;
}
/* Filter info */
.filter-info {
background: var(--accent-muted);
color: var(--accent-secondary);
padding: var(--space-3xs) var(--space-s);
font-size: var(--step--1);
display: flex;
align-items: center;
gap: var(--space-s);
flex-shrink: 0;
}
.clear-filter {
color: var(--accent-secondary);
text-decoration: none;
padding: var(--space-3xs) var(--space-2xs);
background: var(--accent-muted);
border-radius: 3px;
font-size: var(--step--1);
}
.clear-filter:hover {
background: var(--accent-secondary);
}
/* Pagination */
.pagination-wrap {
border-top: 1px solid var(--border-secondary);
background: var(--bg-primary);
flex-shrink: 0;
}
.pagination-wrap ul {
display: flex;
justify-content: center;
align-items: center;
gap: var(--space-2xs);
padding: var(--space-s);
list-style: none;
margin: 0;
}
.pagination-btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 2.75rem;
min-height: 2.75rem;
padding: 0 var(--space-2xs);
border: 1px solid var(--border-secondary);
border-radius: 3px;
color: var(--text-primary);
font-size: var(--step--1);
text-decoration: none;
transition: all 0.15s;
}
.pagination-btn:hover:not(.disabled) {
border-color: var(--accent-primary);
color: var(--accent-primary);
}
.pagination-btn.disabled {
opacity: 0.3;
cursor: not-allowed;
pointer-events: none;
}
.pagination-info {
font-size: var(--step--1);
color: var(--text-secondary);
padding: 0 var(--space-2xs);
}
.page-current {
font-weight: 600;
color: var(--text-primary);
}
/* Suppress card hover scale for users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
.home-body figure img,
.home-body figure video {
transition: none;
}
.card:hover figure img,
.card:hover figure video {
transform: none;
}
.card__media--gradient {
transition: none;
}
.card {
transition: none;
}
.card:hover {
transform: none;
}
}
+9
View File
@@ -0,0 +1,9 @@
/**
* Minified by jsDelivr using clean-css v5.3.3.
* Original file: /npm/modern-normalize@3.0.1/modern-normalize.css
*
* Do NOT use SRI with dynamically generated files! More information: https://www.jsdelivr.com/using-sri-with-dynamic-files
*/
/*! modern-normalize v3.0.1 | MIT License | https://github.com/sindresorhus/modern-normalize */
*,::after,::before{box-sizing:border-box}html{font-family:system-ui,'Segoe UI',Roboto,Helvetica,Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji';line-height:1.15;-webkit-text-size-adjust:100%;tab-size:4}body{margin:0}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Consolas,'Liberation Mono',Menlo,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-color:currentcolor}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}legend{padding:0}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}
/*# sourceMappingURL=/sm/d2d8cd206fb9f42f071e97460f3ad9c875edb5e7a4b10f900a83cdf8401c53a9.map */
+338
View File
@@ -0,0 +1,338 @@
/* ============================================================
RÉPERTOIRE / SEARCH PAGE (repertoire.php)
============================================================ */
@import url("./variables.css");
.search-body {
display: flex;
flex-direction: column;
height: 100vh;
overflow: hidden;
background: var(--bg-primary);
}
.search-main {
flex: 1;
overflow-y: auto;
overflow-x: hidden;
}
/* ---- 6-column index layout ---- */
.repertoire-index {
display: grid;
grid-template-columns: 0.7fr 1.2fr 1.4fr 0.9fr 1.4fr 1fr;
gap: 0;
padding: 0 var(--space-m);
min-height: 100%;
}
@media (max-width: 1024px) {
.repertoire-index {
grid-template-columns: 1fr 1fr 1fr;
padding: 0 var(--space-s);
min-height: auto;
}
.repertoire-col {
border-right: 1px solid var(--border-secondary);
border-bottom: 1px solid var(--border-primary);
}
.repertoire-col:nth-child(3n) {
border-right: none;
}
}
@media (max-width: 600px) {
.repertoire-index {
grid-template-columns: 1fr;
padding: 0 var(--space-s);
min-height: auto;
}
.repertoire-col {
border-right: none;
border-bottom: 1px solid var(--border-primary);
padding: var(--space-s) 0 var(--space-m);
}
.repertoire-col:last-child {
border-bottom: none;
}
}
.repertoire-col {
padding: var(--space-xs) var(--space-2xs) var(--space-l);
border-right: 1px solid var(--border-secondary);
}
.repertoire-col:last-child {
border-right: none;
}
.repertoire-index section > h2 {
font-size: var(--step--2);
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--text-secondary);
font-weight: 400;
margin: 0 0 var(--space-2xs) 0;
padding-bottom: var(--space-3xs);
border-bottom: 1px solid var(--border-secondary);
}
/* Strip list chrome inside repertoire columns */
.repertoire-col ul {
list-style: none;
margin: 0;
padding: 0;
}
/* ---- rep-entry: shared base (button + link variants) ---- */
.rep-entry {
display: block;
width: 100%;
text-align: left;
background: none;
border: none;
padding: var(--space-3xs) 0;
margin: 0;
font-family: inherit;
font-size: var(--step-0);
color: var(--text-primary);
line-height: 1.4;
cursor: pointer;
text-decoration: none;
transition: color 0.15s, opacity 0.15s;
}
.rep-entry:hover {
color: var(--accent-primary);
}
/* Link variant (students col) — no underline by default */
.rep-entry--link {
text-decoration: none;
}
/* Selected: accent color */
.rep-entry--selected {
color: var(--accent-primary) !important;
}
/* Faded/disabled: muted, not interactive */
.rep-entry--faded {
opacity: 0.3;
cursor: not-allowed;
pointer-events: none;
}
/* Years column — big bold numbers */
.repertoire-col[data-col="years"] .rep-entry {
font-size: var(--step-3);
font-weight: 700;
line-height: 1.1;
letter-spacing: -0.02em;
padding: var(--space-3xs) 0;
}
/* Empty state in students column */
.rep-empty {
color: var(--text-tertiary);
font-size: var(--step--1);
padding: var(--space-3xs) 0;
}
/* ---- HTMX loading indicator ---- */
.rep-indicator {
display: block;
position: fixed;
top: 0;
left: 0;
right: 0;
height: 2px;
background: var(--accent-primary);
opacity: 0;
transition: opacity 0.15s;
z-index: 100;
pointer-events: none;
}
.rep-indicator.htmx-request {
opacity: 1;
animation: rep-progress 1.2s ease-in-out infinite;
}
@keyframes rep-progress {
0% { transform: scaleX(0); transform-origin: left; }
50% { transform: scaleX(0.7); transform-origin: left; }
100% { transform: scaleX(1); transform-origin: left; }
}
/* ---- Search results view (grid) ---- */
.search-results-header {
display: block;
font-size: var(--step--1);
color: var(--text-secondary);
margin: var(--space-s) var(--space-m) var(--space-2xs);
}
.results-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: var(--space-m);
list-style: none;
margin: 0;
padding: var(--space-2xs) var(--space-m) var(--space-m);
}
.result-card {
text-decoration: none;
color: inherit;
display: flex;
flex-direction: column;
gap: var(--space-3xs);
}
.result-card__authors {
font-size: var(--step--1);
font-weight: 500;
color: var(--text-primary);
}
.result-card__title {
font-size: var(--step--1);
color: var(--text-secondary);
line-height: 1.35;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.result-card__meta {
font-size: var(--step--2);
color: var(--accent-primary);
font-style: normal;
}
/* Search controls bar */
.search-controls {
display: flex;
align-items: center;
gap: var(--space-s);
padding: var(--space-3xs) var(--space-m);
border-bottom: 1px solid var(--border-secondary);
flex-shrink: 0;
flex-wrap: wrap;
}
.search-filter-label {
display: flex;
align-items: center;
gap: var(--space-3xs);
font-size: var(--step--2);
color: var(--text-secondary);
text-transform: uppercase;
letter-spacing: 0.06em;
white-space: nowrap;
cursor: default;
}
.search-filter-select {
font-size: var(--step--1);
border: 1px solid var(--border-primary);
border-radius: 3px;
padding: var(--space-3xs) var(--space-2xs);
background: var(--bg-primary);
color: var(--text-primary);
font-family: inherit;
cursor: pointer;
}
.search-filter-select:focus {
border-color: var(--accent-primary);
}
.search-apply-btn {
font-size: var(--step--1);
padding: var(--space-3xs) var(--space-xs);
background: var(--accent-primary);
color: var(--accent-foreground);
border: none;
border-radius: 3px;
cursor: pointer;
font-family: inherit;
transition: background 0.15s;
}
.search-apply-btn:hover {
background: var(--accent-secondary);
}
.search-reset-link {
font-size: var(--step--1);
color: var(--text-secondary);
text-decoration: underline;
cursor: pointer;
}
/* Search results pagination */
.pagination-wrap {
display: flex;
justify-content: center;
align-items: center;
gap: var(--space-2xs);
padding: var(--space-m) 0;
}
.pagination-btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 2.75rem;
min-height: 2.75rem;
padding: 0 var(--space-2xs);
border: 1px solid var(--border-secondary);
border-radius: 3px;
color: var(--text-primary);
font-size: var(--step--1);
text-decoration: none;
transition: all 0.15s;
}
.pagination-btn:hover:not(.disabled) {
border-color: var(--accent-primary);
color: var(--accent-primary);
}
.pagination-btn.disabled {
opacity: 0.3;
cursor: not-allowed;
pointer-events: none;
}
.pagination-info {
font-size: var(--step--1);
color: var(--text-secondary);
padding: 0 var(--space-2xs);
}
.search-empty {
padding: var(--space-xl) var(--space-m);
color: var(--text-secondary);
font-size: var(--step-0);
text-align: center;
}
/* Error message */
.search-error {
background: var(--search-error-bg);
border-left: 3px solid var(--search-error-border);
color: var(--search-error-color);
padding: var(--space-2xs) var(--space-s);
font-size: var(--step--1);
margin: var(--space-2xs) var(--space-m);
flex-shrink: 0;
}
+396
View File
@@ -0,0 +1,396 @@
/* ============================================================
SYSTEM PAGE
============================================================ */
@import url("./variables.css");
/* ── System page tabs ──────────────────────────────────────────────────── */
.sys-tabs {
display: flex;
gap: 0;
border-bottom: 1px solid var(--border-primary);
margin-bottom: var(--space-m);
}
.sys-tab {
display: inline-block;
padding: var(--space-3xs) var(--space-s);
font-size: var(--step--1);
font-weight: 500;
color: var(--text-secondary);
text-decoration: none;
border-bottom: 2px solid transparent;
margin-bottom: -1px;
transition: color .15s, border-color .15s;
}
.sys-tab:hover {
color: var(--text-primary);
}
.sys-tab.active {
color: var(--accent-primary);
border-bottom-color: var(--accent-primary);
}
/* ── Status section (always-visible panel above tabs) ─────────────────── */
.sys-status-section {
background: var(--bg-secondary);
border: 1px solid var(--border-primary);
border-radius: 6px;
padding: var(--space-s) var(--space-m);
margin-bottom: var(--space-m);
}
.sys-status-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: var(--space-s);
}
.sys-status-toggle {
background: none;
border: 1px solid var(--border-primary);
color: var(--text-secondary);
border-radius: 3px;
font-size: var(--step--2);
font-family: inherit;
padding: var(--space-3xs) var(--space-2xs);
cursor: pointer;
white-space: nowrap;
transition: color .15s, border-color .15s;
}
.sys-status-toggle:hover {
color: var(--text-primary);
border-color: var(--border-secondary);
}
.sys-status-meta {
display: grid;
grid-template-columns: 1fr 1fr;
gap: var(--space-m) var(--space-l);
margin-top: var(--space-m);
padding-top: var(--space-m);
border-top: 1px solid var(--border-primary);
}
@media (max-width: 700px) {
.sys-status-meta { grid-template-columns: 1fr; }
}
/* ── Status cards ──────────────────────────────────────────────────────── */
.srv-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: var(--space-s);
margin-bottom: var(--space-l);
}
.srv-card {
background: var(--bg-primary);
border: 1px solid var(--border-primary);
border-radius: 5px;
padding: var(--space-s) var(--space-m);
}
.srv-card__header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: var(--space-3xs);
}
.srv-card__name {
font-size: var(--step--1);
text-transform: uppercase;
letter-spacing: .07em;
color: var(--text-secondary);
font-weight: 500;
}
.srv-card__detail {
font-size: var(--step--2);
color: var(--text-tertiary);
margin-top: var(--space-3xs);
font-family: ui-monospace, "SFMono-Regular", Consolas, monospace;
}
.status-ok { color: var(--accent-green); font-weight: 600; font-size: var(--step--1); }
.status-warn { color: var(--warning); font-weight: 600; font-size: var(--step--1); }
.status-err { color: var(--error); font-weight: 600; font-size: var(--step--1); }
.status-unknown { color: var(--text-tertiary); font-weight: 600; font-size: var(--step--1); }
.srv-section-title {
font-size: var(--step--1);
text-transform: uppercase;
letter-spacing: .1em;
color: var(--text-secondary);
border-bottom: 1px solid var(--border-primary);
padding-bottom: var(--space-3xs);
margin: 0 0 var(--space-s);
font-weight: 500;
}
/* Compact variant: no border, no margin — used inside sys-status-header */
.srv-section-title--compact {
margin: 0;
border: none;
padding: 0;
}
/* Sub-section variant: tighter bottom margin — used for PHP/disk sub-headings */
.srv-section-title--sub { margin-bottom: var(--space-xs); }
/* ── PHP info grid ─────────────────────────────────────────────────────── */
.php-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
gap: var(--space-3xs) var(--space-xs);
margin-bottom: var(--space-l);
}
/* Flush variant: no bottom margin — used inside sys-status-meta cell */
.php-grid--flush { margin-bottom: 0; }
.php-item {
background: var(--bg-primary);
border: 1px solid var(--border-primary);
border-radius: 4px;
padding: var(--space-3xs) var(--space-xs);
}
.php-item__key {
font-size: var(--step--2);
text-transform: uppercase;
letter-spacing: .06em;
color: var(--text-tertiary);
}
.php-item__val {
font-size: var(--step--1);
font-family: ui-monospace, "SFMono-Regular", Consolas, monospace;
color: var(--text-primary);
margin-top: var(--space-3xs);
}
/* ── Disk bar ──────────────────────────────────────────────────────────── */
.disk-bar-wrap {
background: var(--border-primary);
border-radius: 3px;
height: 6px;
margin-top: var(--space-2xs);
overflow: hidden;
}
.disk-bar {
height: 100%;
border-radius: 3px;
width: var(--disk-pct, 0%);
background: var(--disk-color, var(--accent-green));
transition: width .3s;
}
.disk-stats {
display: flex;
justify-content: space-between;
font-size: var(--step--2);
color: var(--text-secondary);
margin-top: var(--space-3xs);
}
/* ── Tab panel loading state ───────────────────────────────────────────── */
#sys-tab-panel {
min-height: 8rem;
position: relative;
}
#sys-tab-panel.htmx-request {
opacity: 0.4;
pointer-events: none;
transition: opacity 0.1s;
}
#sys-tab-panel.htmx-request::after {
content: '';
position: absolute;
inset: 0;
background: repeating-linear-gradient(
-45deg,
transparent,
transparent 6px,
rgba(0,0,0,0.03) 6px,
rgba(0,0,0,0.03) 12px
);
border-radius: 4px;
animation: sys-panel-shimmer 1s linear infinite;
background-size: 200% 200%;
}
@keyframes sys-panel-shimmer {
0% { background-position: 0 0; }
100% { background-position: 100% 100%; }
}
/* ── Log viewer ────────────────────────────────────────────────────────── */
.log-toolbar {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--space-2xs);
margin-bottom: var(--space-m);
}
.log-toolbar label {
font-size: var(--step--1);
color: var(--text-secondary);
}
.log-toolbar select {
background: var(--bg-primary);
border: 1px solid var(--border-primary);
color: var(--text-primary);
border-radius: 4px;
padding: var(--space-3xs) var(--space-xs);
font-size: var(--step--1);
font-family: inherit;
}
.log-toolbar select:focus { outline: 2px solid var(--accent-primary); }
.log-meta {
font-size: var(--step--2);
color: var(--text-tertiary);
font-family: ui-monospace, "SFMono-Regular", Consolas, monospace;
margin-bottom: var(--space-xs);
display: flex;
gap: var(--space-m);
flex-wrap: wrap;
}
.log-meta span::before { content: attr(data-label) ": "; opacity: .6; }
.log-unavailable {
background: var(--bg-secondary);
border: 1px solid var(--border-primary);
border-radius: 4px;
padding: var(--space-m);
color: var(--text-secondary);
font-size: var(--step--1);
}
.log-unavail-path {
font-family: ui-monospace, "SFMono-Regular", Consolas, monospace;
font-size: var(--step--2);
margin-top: var(--space-3xs);
opacity: .7;
}
.log-unavail-dev {
margin-top: var(--space-2xs);
font-size: var(--step--2);
opacity: .7;
}
.log-empty {
color: var(--text-secondary);
font-size: var(--step--1);
padding: var(--space-s) 0;
}
.log-output {
background: var(--bg-secondary);
border: 1px solid var(--border-primary);
border-radius: 4px;
padding: var(--space-s);
overflow-x: auto;
font-family: ui-monospace, "SFMono-Regular", Consolas, "Courier New", monospace;
font-size: var(--step--2);
line-height: 1.55;
max-height: 62vh;
overflow-y: auto;
position: relative;
}
.log-line {
display: block;
white-space: pre;
padding: var(--space-3xs) var(--space-3xs);
border-radius: 2px;
color: var(--text-primary);
}
.log-line + .log-line { border-top: 1px solid var(--border-primary); }
.log-crit { color: var(--sys-syntax-crit); background: var(--error-muted-bg); }
.log-error { color: var(--error); }
.log-warn { color: var(--warning); }
.log-notice { color: var(--sys-syntax-notice); }
.log-line::before {
content: attr(data-n);
display: inline-block;
min-width: 4ch;
margin-right: var(--space-xs);
opacity: .3;
text-align: right;
user-select: none;
}
.log-count-badge {
background: var(--bg-secondary);
border: 1px solid var(--border-primary);
border-radius: 3px;
font-size: var(--step--2);
padding: var(--space-3xs) var(--space-2xs);
color: var(--text-secondary);
font-family: ui-monospace, monospace;
}
.log-copy-btn {
position: absolute;
top: var(--space-2xs);
right: var(--space-2xs);
background: var(--bg-primary);
border: 1px solid var(--border-primary);
color: var(--text-secondary);
border-radius: 4px;
font-size: var(--step--2);
padding: var(--space-3xs) var(--space-2xs);
cursor: pointer;
font-family: inherit;
transition: color .15s, border-color .15s;
z-index: 2;
}
.log-copy-btn:hover {
color: var(--text-primary);
border-color: var(--accent-primary);
}
.log-copy-btn.copied {
color: var(--accent-green);
border-color: var(--accent-green);
}
.sys-refresh-note {
font-size: var(--step--2);
color: var(--text-secondary);
margin-bottom: var(--space-m);
}
.sys-refresh-note a {
color: var(--accent-primary);
text-decoration: none;
}
.sys-refresh-note a:hover { text-decoration: underline; }
/* ── Cache freshness badges ────────────────────────────────────────────── */
.sys-cache-badge {
display: inline-block;
font-size: var(--step--2);
font-weight: 400;
font-family: ui-monospace, monospace;
padding: var(--space-3xs) var(--space-3xs);
border-radius: 3px;
margin-left: var(--space-xs);
vertical-align: middle;
line-height: 1.6;
}
.sys-cache-badge--hit {
background: var(--warning-muted-bg);
color: var(--warning);
border: 1px solid var(--warning-muted-border);
}
.sys-cache-badge--miss {
background: var(--success-muted-bg);
color: var(--success);
border: 1px solid var(--success-muted-border);
}
/* ── Nginx config viewer ───────────────────────────────────────────────── */
.nginx-source-badge {
display: inline-block;
font-size: var(--step--2);
font-family: ui-monospace, monospace;
padding: var(--space-3xs) var(--space-2xs);
border-radius: 3px;
margin-left: var(--space-2xs);
vertical-align: middle;
}
.nginx-source-badge--live {
background: var(--success-muted-bg);
color: var(--success);
border: 1px solid var(--success-muted-border);
}
.nginx-source-badge--local {
background: var(--warning-muted-bg);
color: var(--warning);
border: 1px solid var(--warning-muted-border);
}
/* Nginx syntax highlight layers inside .log-output */
.nginx-comment { color: var(--sys-syntax-comment); font-style: italic; }
.nginx-directive { color: var(--sys-syntax-directive); }
.nginx-block { color: var(--sys-syntax-block); font-weight: 600; }
.nginx-value { color: var(--sys-syntax-value); }
.nginx-location { color: var(--sys-syntax-location); }
+195
View File
@@ -0,0 +1,195 @@
/* ============================================================
TFE INDIVIDUAL PAGE (tfe.php)
============================================================ */
@import url("./variables.css");
.tfe-body {
display: flex;
flex-direction: column;
min-height: 100vh;
background: var(--bg-primary);
}
.tfe-main {
flex: 1;
padding: var(--space-l) var(--space-m) var(--space-xl);
}
/* Two-column article layout */
.tfe-layout {
display: grid;
grid-template-columns: 1fr 1.4fr;
gap: var(--space-xl);
width: 100%;
max-width: 1200px;
align-items: start;
}
/* Left column — article header */
.tfe-left {
display: flex;
flex-direction: column;
gap: var(--space-m);
}
/* Author (p) — above title */
.tfe-author {
font-family: var(--font-display);
font-size: var(--step-1);
font-weight: 400;
color: var(--text-primary);
margin: 0;
line-height: 1.3;
}
/* Title (h1) — primary heading, very large */
.tfe-title {
font-family: var(--font-display);
font-size: var(--step-3);
font-weight: 400;
color: var(--text-primary);
margin: 0;
line-height: 1.15;
letter-spacing: -0.01em;
}
/* Metadata description list — target <dl> directly inside article > header */
article dl {
display: flex;
flex-direction: column;
gap: var(--space-3xs);
font-size: var(--step--1);
line-height: 1.4;
margin: 0;
}
/* Each dt/dd pair grouped in a <div> inside <dl> */
article dl > div {
display: flex;
gap: var(--space-3xs);
flex-wrap: wrap;
}
article dl dt {
color: var(--text-primary);
font-weight: 400;
flex-shrink: 0;
}
article dl dd {
color: var(--text-primary);
font-weight: 700;
margin: 0;
}
article dl dd a {
color: inherit;
text-decoration: underline;
text-underline-offset: 2px;
}
/* Note field: align dt/dd to top, value in italics */
.tfe-meta-note {
align-items: start;
}
.tfe-note-value {
font-style: italic;
}
/* Synopsis paragraph */
.tfe-synopsis-text {
font-size: var(--step--1);
line-height: 1.7;
color: var(--text-primary);
margin: 0;
}
/* Right column — aside (supplementary media) */
.tfe-right {
display: flex;
flex-direction: column;
gap: var(--space-m);
}
/* Each file display unit — target <figure> directly inside <aside> */
aside figure {
overflow: hidden;
margin: 0;
border-radius: 8px;
}
aside figure img {
width: 100%;
height: auto;
display: block;
border-radius: 8px;
}
aside figure embed,
aside figure video {
width: 100%;
display: block;
border: none;
}
aside figure video {
max-height: 500px;
}
aside figure embed {
height: clamp(300px, 80vh, 700px);
}
/* figcaption under media — target <figcaption> inside <aside> */
aside figcaption {
font-size: var(--step--2);
color: var(--text-secondary);
margin: var(--space-3xs) 0 0;
font-style: italic;
}
/* PDF fallback download link */
.tfe-pdf-fallback {
font-size: var(--step--1);
margin: var(--space-3xs) 0 0;
}
.tfe-pdf-fallback a {
color: var(--text-primary);
text-decoration: underline;
text-underline-offset: 2px;
}
/* "Not available" and "no files" notices */
.tfe-restricted,
.tfe-no-files {
font-size: var(--step--1);
color: var(--text-secondary);
font-style: italic;
padding: var(--space-s) 0;
margin: 0;
}
/* Responsive */
@media (max-width: 900px) {
.tfe-layout {
grid-template-columns: 1fr;
gap: var(--space-l);
}
.tfe-title {
font-size: var(--step-2);
}
}
@media (max-width: 600px) {
.tfe-main {
padding: var(--space-m) var(--space-s) var(--space-l);
}
.tfe-title {
font-size: var(--step-1);
}
}
+121
View File
@@ -0,0 +1,121 @@
/* ============================================================
CSS VARIABLES (CUSTOM PROPERTIES)
============================================================ */
/* @link https://utopia.fyi/type/calculator?c=360,18,1.2,1240,20,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
:root {
--step--2: clamp(0.7813rem, 0.7736rem + 0.0341vw, 0.8rem);
--step--1: clamp(0.9375rem, 0.9119rem + 0.1136vw, 1rem);
--step-0: clamp(1.125rem, 1.0739rem + 0.2273vw, 1.25rem);
--step-1: clamp(1.35rem, 1.2631rem + 0.3864vw, 1.5625rem);
--step-2: clamp(1.62rem, 1.4837rem + 0.6057vw, 1.9531rem);
--step-3: clamp(1.944rem, 1.7405rem + 0.9044vw, 2.4414rem);
--step-4: clamp(2.3328rem, 2.0387rem + 1.3072vw, 3.0518rem);
--step-5: clamp(2.7994rem, 2.384rem + 1.8461vw, 3.8147rem);
}
/* @link https://utopia.fyi/space/calculator?c=360,18,1.2,1240,20,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
:root {
--space-3xs: clamp(0.3125rem, 0.3125rem + 0vw, 0.3125rem);
--space-2xs: clamp(0.5625rem, 0.5369rem + 0.1136vw, 0.625rem);
--space-xs: clamp(0.875rem, 0.8494rem + 0.1136vw, 0.9375rem);
--space-s: clamp(1.125rem, 1.0739rem + 0.2273vw, 1.25rem);
--space-m: clamp(1.6875rem, 1.6108rem + 0.3409vw, 1.875rem);
--space-l: clamp(2.25rem, 2.1477rem + 0.4545vw, 2.5rem);
--space-xl: clamp(3.375rem, 3.2216rem + 0.6818vw, 3.75rem);
--space-2xl: clamp(4.5rem, 4.2955rem + 0.9091vw, 5rem);
--space-3xl: clamp(6.75rem, 6.4432rem + 1.3636vw, 7.5rem);
/* One-up pairs */
--space-3xs-2xs: clamp(0.3125rem, 0.1847rem + 0.5682vw, 0.625rem);
--space-2xs-xs: clamp(0.5625rem, 0.4091rem + 0.6818vw, 0.9375rem);
--space-xs-s: clamp(0.875rem, 0.7216rem + 0.6818vw, 1.25rem);
--space-s-m: clamp(1.125rem, 0.8182rem + 1.3636vw, 1.875rem);
--space-m-l: clamp(1.6875rem, 1.3551rem + 1.4773vw, 2.5rem);
--space-l-xl: clamp(2.25rem, 1.6364rem + 2.7273vw, 3.75rem);
--space-xl-2xl: clamp(3.375rem, 2.7102rem + 2.9545vw, 5rem);
--space-2xl-3xl: clamp(4.5rem, 3.2727rem + 5.4545vw, 7.5rem);
/* Custom pairs */
--space-s-l: clamp(1.125rem, 0.5625rem + 2.5vw, 2.5rem);
}
:root {
/* Fonts */
--font-body: "BBBDMSans", sans-serif;
--font-display: "Ductus", sans-serif;
/* Backgrounds */
--bg-primary: #ffffff;
--bg-secondary: #f5f5f5;
--bg-tertiary: #e8e8e8;
--bg-active: #d0d0d0;
/* Text */
--text-primary: #111111;
--text-secondary: #666666;
--text-tertiary: #999999;
/* Borders */
--border-primary: #dddddd;
--border-secondary: #cccccc;
/* Status */
--success: #5cd69d;
--error: #f25a5a;
--warning: #fbca51;
/* Accent */
--accent-primary: #9557b5;
--accent-secondary: #683d7f;
--accent-foreground: #ffffff;
--accent-muted: rgba(149, 87, 181, 0.12);
--accent-blue: #41adff;
--accent-green: #4caf50;
--accent-yellow: #f39c12;
--accent-red: #f25a5a;
/* Gradient (header) */
--gradient-1: #3c856c;
--gradient-2: #60ecb4;
--gradient-3: #e390ff;
--gradient-4: #9557b5;
/* Header decorative */
--header-gradient-fade: rgba(149, 87, 181, 0);
--header-shadow-strong: rgba(119, 70, 145, 1);
--header-shadow-soft: rgba(119, 70, 145, 0.8);
--header-nav-active-border: rgba(255, 255, 255, 0.6);
/* Search error block */
--search-error-bg: #fff0f0;
--search-error-border: #cc0000;
--search-error-color: #cc0000;
/* System page — log/config syntax highlight */
--sys-syntax-comment: #999999;
--sys-syntax-directive: #1a6fb5;
--sys-syntax-block: #7a2fa0;
--sys-syntax-value: #a05c00;
--sys-syntax-location: #1a7a6b;
--sys-syntax-notice: #3a6ea8;
--sys-syntax-crit: #c0392b;
/* Muted alpha overlays — derived from semantic tokens */
--success-muted-bg: rgba(92, 214, 157, 0.12);
--success-muted-border: rgba(92, 214, 157, 0.35);
--warning-muted-bg: rgba(251, 202, 81, 0.12);
--warning-muted-border: rgba(251, 202, 81, 0.35);
--error-muted-bg: rgba(242, 90, 90, 0.12);
--error-muted-border: rgba(242, 90, 90, 0.35);
--blue-muted-bg: rgba(65, 173, 255, 0.12);
--blue-muted-border: rgba(65, 173, 255, 0.30);
--blue-muted-bg-hover: rgba(65, 173, 255, 0.22);
--yellow-muted-bg: rgba(243, 156, 18, 0.12);
--yellow-muted-border: rgba(243, 156, 18, 0.30);
--yellow-muted-bg-hover: rgba(243, 156, 18, 0.22);
--green-muted-bg: rgba(76, 175, 80, 0.12);
--green-muted-border: rgba(76, 175, 80, 0.30);
--green-muted-bg-hover: rgba(76, 175, 80, 0.22);
--danger-border-muted: rgba(242, 90, 90, 0.35);
}
+27
View File
@@ -0,0 +1,27 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 283.5 283.5">
<!-- Generator: Adobe Illustrator 30.0.0, SVG Export Plug-In . SVG Version: 2.1.1 Build 123) -->
<defs>
<style>
.st0 {
fill: #009992;
}
.st1 {
fill: #bb59ff;
}
</style>
</defs>
<g>
<path class="st1" d="M86.6,135.9c-1.5,0-2.8-.3-4-1-1.3-.7-2.4-1.7-3-3l-23.5-39.1c-.3.8-.7,1.5-1.3,2.1l-30.3,38s0,0-.1.1c-1.3,1.5-3.1,2.4-5.2,2.7-.5,0-.9,0-1.3,0-1.9,0-3.5-.6-4.9-1.9-1.7-1.5-2.7-3.4-2.8-5.4-.2-2.3.4-4.3,1.8-5.9l29.9-37.4c0-.2.2-.3.3-.5,1.3-1.9,3.3-2.9,5.6-3.1.2,0,.5,0,.7,0,.3,0,.7,0,1,0L11.1,17.9c-1.1-1.9-1.4-3.8-.9-6.1.5-2.2,1.8-4,3.8-5.1,1.2-.7,2.5-1,3.9-1s1.3,0,2,.2c2,.5,3.8,1.7,5,3.6l23.6,39.3c.3-.7.7-1.4,1.3-2.1l30.3-38c1.5-1.8,3.4-2.8,5.5-3,.3,0,.5,0,.8,0,1.9,0,3.6.6,5.1,1.7,1.8,1.4,2.8,3.3,3,5.5.2,2.9-.9,4.7-1.9,5.8l-29.7,37.2c0,.2-.2.5-.4.7-1.3,1.9-3.3,2.9-5.6,3.1-.2,0-.5,0-.7,0s-.7,0-1,0l38.4,63.9c1.1,1.9,1.4,3.9.9,6-.5,2-1.7,3.7-3.5,4.9-1.2.8-2.6,1.2-4.2,1.2Z"/>
<path class="st0" d="M17.8,8.7c.4,0,.9,0,1.3.2,1.3.3,2.3,1.1,3.1,2.2l68.5,114.1c.7,1.2.8,2.4.5,3.8-.3,1.3-1.1,2.3-2.2,3.1-.7.5-1.5.7-2.4.7s-1.8-.2-2.5-.6c-.8-.4-1.4-1-1.7-1.7L13.7,16.3c-.7-1.2-.8-2.4-.5-3.9.3-1.4,1.1-2.4,2.2-3.1.8-.5,1.6-.7,2.4-.7M86.3,8.8c1.2,0,2.3.3,3.2,1,1,.8,1.7,1.9,1.8,3.4.1,1.4-.2,2.7-1.1,3.6l-30.4,38h.1c-.8,1.2-1.9,1.8-3.4,1.9-.2,0-.3,0-.5,0-1.2,0-2.3-.3-3.2-1-1-.8-1.6-1.9-1.8-3.4-.2-1.4.1-2.7,1-3.7l30.4-38c.9-1.1,2-1.7,3.4-1.8.2,0,.3,0,.5,0M48.5,84.8c1.2,0,2.3.3,3.2,1.1,1,.9,1.6,2,1.8,3.4.2,1.4-.1,2.7-1,3.7l-30.4,38c-.9,1-2,1.5-3.4,1.7-.3,0-.6,0-.8,0-1.1,0-2-.3-2.9-1.1-1-.9-1.7-2-1.8-3.4-.1-1.4.2-2.7,1.1-3.7l30.4-38h-.1c.8-1.1,1.9-1.7,3.4-1.8.2,0,.3,0,.5,0M17.8,2.6h0c-1.9,0-3.7.5-5.4,1.5-2.7,1.5-4.6,4-5.2,7.1-.6,3-.2,5.8,1.2,8.2,0,0,0,0,0,0l36,59.8c-1.9.7-3.6,2-4.8,3.7-.1.2-.3.4-.4.6l-29.7,37.1c-1.3,1.6-2.8,4.2-2.5,8,.2,2.8,1.5,5.4,3.8,7.5,1.9,1.7,4.3,2.7,6.9,2.7s1.1,0,1.7-.1c0,0,0,0,0,0,2.8-.4,5.2-1.7,7-3.7,0,0,.2-.2.2-.3l29.1-36.4,21,35c.9,1.8,2.4,3.3,4.2,4.2,1.6.9,3.5,1.3,5.4,1.3s4.2-.6,5.9-1.8c2.5-1.6,4.2-4,4.8-6.8.7-2.9.3-5.7-1.2-8.2,0,0,0,0,0,0l-36-59.9c1.9-.7,3.6-2,4.8-3.7.2-.3.4-.6.5-.9l29.4-36.8c1.4-1.5,2.9-4.1,2.6-8-.2-3-1.7-5.8-4.1-7.7-1.9-1.6-4.4-2.4-7-2.4s-.6,0-1,0c-3,.2-5.7,1.6-7.7,4.1,0,0,0,0,0,0l-29,36.3L27.5,8s0,0,0-.1c-1.6-2.5-4-4.3-6.8-4.9-.9-.2-1.8-.3-2.7-.3h0Z"/>
</g>
<g>
<path class="st1" d="M105.1,199.1c-.5,0-.9,0-1.4-.1,0,0-.1,0-.2,0-2.2-.5-3.9-1.7-5-3.7-1-1.8-1.4-3.7-1.1-5.8,0,0,0-.2,0-.3l26.6-114.1s0,0,0-.1c.6-2.1,1.8-3.7,3.6-4.9,0,0,0,0,.1,0,1.3-.8,2.7-1.2,4.1-1.2s1.2,0,1.9.2c2,.5,3.8,1.7,5,3.6,0,0,0,0,0,.1.3.5.5,1,.7,1.4.2-.6.5-1.1.8-1.6,1.2-1.9,2.9-3.1,5-3.6.6-.1,1.2-.2,1.9-.2,1.4,0,2.8.4,4.1,1.2,1.8,1,3.1,2.7,3.7,4.9,0,0,0,.1,0,.2l26.6,114.1c.3,1.4.3,2.7,0,4-.4,1.5-1.2,2.7-2,3.5-1.2,1.4-2.8,1.9-3.8,2.2,0,0,0,0,0,0-.6.1-1.2.2-1.7.2-1.1,0-2.1-.2-3.2-.7-.4,0-.7-.2-1-.4-1.9-1.1-3.2-2.9-3.7-5.1l-7.7-32.6c-1.1.5-2.3.8-3.6.8h-30.4c-1.3,0-2.5-.3-3.6-.8l-7.7,32.6c-.5,2.2-1.7,4-3.7,5.1-1.4.8-2.8,1.2-4.4,1.2ZM154.7,144.7l-15.2-64.9-15.2,64.9h30.4Z"/>
<path class="st0" d="M147.1,71.7c.9,0,1.7.2,2.6.7,1.2.7,1.9,1.8,2.3,3.2l26.6,114.1c.2.9.2,1.7,0,2.5-.2.8-.7,1.5-1.3,2.2-.6.7-1.4,1-2.2,1.2-.4,0-.7.1-1.1.1-1,0-1.9-.3-2.8-.8v.2c-1.1-.7-1.8-1.8-2.1-3.2l-9.2-39.1c0,1.3-.5,2.5-1.5,3.5-1,1-2.1,1.4-3.6,1.4h-30.4c-1.4,0-2.5-.5-3.6-1.4-1-.9-1.4-2.1-1.5-3.5l-9.2,39.1c-.3,1.4-1,2.4-2.2,3.2-.9.5-1.9.8-2.8.8s-.6,0-.9,0c-1.3-.3-2.3-1-3.1-2.2-.7-1.2-.9-2.4-.7-3.9l26.6-114.1c.4-1.4,1.2-2.4,2.3-3.2.9-.5,1.7-.7,2.6-.7s.8,0,1.2.1c1.3.3,2.3,1.1,3.1,2.2.7,1.2.9,2.4.7,3.7l-17,72.6c0,0,0,.2,0,.2v-.2c0,0,0,0,.1,0,.4-.8,1-1.4,1.8-1.8.8-.4,1.6-.7,2.5-.7h30.4c1.4,0,2.5.5,3.6,1.4,1,.9.7.8.9,1.2l-17-72.7c-.3-1.3,0-2.5.7-3.7.7-1.1,1.7-1.9,3.1-2.2.4,0,.8-.1,1.2-.1M147.1,65.6c-.8,0-1.7,0-2.5.3-1.9.4-3.7,1.4-5.1,2.8-1.4-1.3-3.1-2.2-5-2.7-.8-.2-1.7-.3-2.5-.3-2,0-3.9.5-5.7,1.6,0,0-.1,0-.2.1-2.4,1.6-4.1,3.8-4.9,6.6,0,0,0,.2,0,.3l-26.6,114.1c0,.2,0,.3,0,.5-.4,2.8,0,5.4,1.5,7.8,1.6,2.7,4,4.4,7,5.1.1,0,.3,0,.4,0,.6,0,1.3.1,1.9.1,2.1,0,4.1-.5,5.9-1.6,2.7-1.6,4.5-4,5.1-7.1l6.9-29.5c.5,0,.9,0,1.4,0h30.4c.5,0,.9,0,1.4,0l6.9,29.5c.7,3,2.5,5.5,5.1,7,.5.3,1.1.5,1.7.7,1.3.5,2.7.8,4.1.8s1.6,0,2.4-.3c0,0,.1,0,.2,0,.8-.2,3.4-.9,5.4-3.2.9-1.1,2.1-2.6,2.6-4.7.4-1.8.4-3.5,0-5.4,0,0,0,0,0,0l-26.6-114.1c0-.1,0-.3-.1-.4-1.1-3.7-3.4-5.7-5.1-6.6-1.8-1.1-3.7-1.6-5.7-1.6h0ZM128.2,141.7l11.3-48.4,11.3,48.4h-22.7Z"/>
</g>
<g>
<path class="st1" d="M266.3,279.3c-1.1,0-2.5,0-3.9-.7-1.1-.6-2.1-1.3-3-2.4-1.2-1.4-1.5-3-1.6-4.2l-11-111.3s-7.2,28.8-7.3,28.8c-.8,2.7-2.6,4.7-5.2,5.6,0,0,0,0-.1,0-.8.2-1.7.4-2.5.4s-1.3,0-1.9-.2c-1.3-.3-2.5-1-3.6-1.9-1.2-1-2-2.4-2.3-4.1l-7.3-28.9-11.1,111.4c0,2.2-1.1,4.1-2.9,5.6-1.5,1.2-3.3,1.8-5.2,1.8s-.4,0-.6,0c-2.2-.2-4.1-1.1-5.5-2.8-1.4-1.6-2.1-3.6-1.9-5.8l11.5-114.1c0-2.2,1.1-4.1,2.9-5.6,1.5-1.3,3.3-1.9,5.2-1.9s.3,0,.5,0c2.2,0,4.2,1.1,5.6,2.9.6.8,1.1,1.6,1.4,2.5.2-.5.4-1,.7-1.6,1.2-2.1,3.1-3.4,5.2-3.7.5,0,1-.1,1.4-.1,1.4,0,2.8.3,4.2,1,0,0,.1,0,.2,0,1.6,1,2.8,2.3,3.4,4,.8-2.2,2.3-3.5,3.5-4.1,1.3-.7,2.7-1.1,4.1-1.1s1.2,0,1.9.2c2.2.5,3.9,1.8,5,3.7.3.4.5.9.7,1.4.3-.9.8-1.7,1.5-2.5,1.5-1.6,3.3-2.6,5.4-2.7,0,0,.2,0,.2,0,1,0,2.1,0,3.4.5.2,0,.4.1.6.2,1.4.7,2.4,1.5,3.2,2.6.9,1.2,1.4,2.6,1.4,4.2l11.5,114c0,.1,0,.2,0,.3,0,1.5-.2,3.6-2,5.6-1.4,1.6-3.1,2.5-5.2,2.8-.2,0-.3,0-.5,0Z"/>
<path class="st0" d="M239.2,152.1c.4,0,.8,0,1.2.1,1.3.3,2.3,1,3.1,2.2.7,1.2.9,2.4.7,3.8l-7.6,30.4c-.5,1.7-1.5,3-3.3,3.6-.6.2-1.1.2-1.6.2s-.8,0-1.2-.1c-.8-.2-1.6-.6-2.3-1.2-.7-.6-1.1-1.4-1.3-2.4l-7.6-30.4c-.3-1.3,0-2.5.7-3.8.7-1.2,1.7-2,3.1-2.2.3,0,.7,0,1,0,1,0,1.9.2,2.8.7,1.2.7,1.9,1.7,2.2,3.1l2.7,10.7v.2c0,0,0,0,0,0v-.2c0,0,2.7-10.7,2.7-10.7.3-1.4,1-2.4,2.2-3.1.9-.5,1.7-.7,2.6-.7M209,152.1c.1,0,.3,0,.4,0,1.4,0,2.5.7,3.4,1.7.8,1,1.2,2.3,1,3.7l-11.3,114.1c0,1.4-.7,2.5-1.7,3.4-.9.7-2.1,1.1-3.3,1.1s-.3,0-.4,0c-1.4-.1-2.5-.7-3.4-1.7-.9-1-1.3-2.2-1.2-3.6l11.5-114.1c0-1.4.7-2.5,1.7-3.4,1-.8,2.1-1.2,3.3-1.2M253.9,152.1c.9,0,1.7,0,2.5.4h.1c.8.4,1.5.9,2,1.6.5.7.8,1.5.8,2.5l11.5,114.1c0,1.4-.3,2.5-1.2,3.6-.9,1-2,1.6-3.4,1.8-.9,0-1.7,0-2.5-.4-.8-.4-1.4-.9-2-1.6-.6-.7-.8-1.5-.9-2.5l-11.3-114.1c-.2-1.4.1-2.7,1-3.7.9-1,2-1.6,3.4-1.7M239.2,145.9h0c-1.9,0-3.8.5-5.5,1.5-.7.3-1.4.8-2.1,1.4-.6-.5-1.2-.9-1.8-1.3-.1,0-.2-.1-.3-.2-1.8-.9-3.6-1.3-5.5-1.3s-1.3,0-1.9.1c-2.1.3-4,1.3-5.5,2.7-1.9-1.8-4.3-2.9-6.9-2.9-.2,0-.4,0-.6,0-2.6,0-5,.9-7.1,2.6-2.5,2-3.9,4.7-4,7.7l-11.5,113.9s0,0,0,.1c-.2,2.9.7,5.8,2.7,8,1.9,2.3,4.6,3.7,7.6,3.9.3,0,.5,0,.8,0,2.6,0,5.1-.9,7.1-2.5,2.5-2,3.9-4.7,4-7.8l9.3-93.9,3,11.9c.5,2.3,1.6,4.3,3.3,5.7,1.4,1.2,3.1,2.1,4.8,2.5.9.2,1.8.3,2.6.3s2.2-.2,3.4-.5c0,0,.2,0,.3,0,3.5-1.2,6-3.9,7.1-7.6,0,0,0-.2,0-.2l2.9-11.7,9.3,93.8c.2,1.5.6,3.8,2.4,5.9,1.2,1.4,2.4,2.4,3.9,3.1,2.1,1.1,4,1.1,5.3,1.1s.6,0,.9,0c2.7-.4,5.1-1.7,7-3.8,1.9-2.1,2.8-4.6,2.8-7.7s0-.4,0-.6l-11.5-113.9c0-2.1-.7-4-1.9-5.7-1.1-1.5-2.5-2.6-4.3-3.5-.3-.2-.7-.3-1-.4-1.7-.7-3.3-.7-4.4-.7s-.3,0-.5,0c-2.5.2-4.7,1.2-6.6,2.9-1.4-1.3-3.1-2.2-5-2.6-.8-.2-1.7-.3-2.5-.3h0Z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 6.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 114 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 849 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

@@ -0,0 +1,10 @@
<!-- Favicon and icon links - add to your <head> section -->
<link rel="apple-touch-icon" sizes="152x152" href="/favicon/apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" sizes="167x167" href="/favicon/apple-touch-icon-167x167.png">
<link rel="apple-touch-icon" sizes="180x180" href="/favicon/apple-touch-icon-180x180.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon/favicon-16x16.png">
<link rel="manifest" href="/favicon/site.webmanifest">
<link rel="shortcut icon" href="/favicon/favicon.ico">
<meta name="msapplication-TileColor" content="\#ffffff">
<meta name="theme-color" content="\#ffffff">
@@ -0,0 +1,19 @@
{
"name": "",
"short_name": "",
"icons": [
{
"src": "/favicon/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/favicon/android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"theme_color": "#ffffff",
"background_color": "#ffffff",
"display": "standalone"
}
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long