17 lines
3.6 KiB
CSS
17 lines
3.6 KiB
CSS
:root{color-scheme:dark;font-family:Inter,system-ui,-apple-system,'Segoe UI',sans-serif;color:#f0f6fd;background:#0c1521}*{box-sizing:border-box}
|
|
body{min-height:100vh;margin:0;background:linear-gradient(180deg,rgba(5,15,26,.77),rgba(5,15,26,.62)),url('/static/img/alfred-ambience.webp') center/cover fixed no-repeat;}
|
|
button,a,input,select{font:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer}
|
|
.lg-header{display:flex;justify-content:space-between;align-items:center;gap:22px;padding:24px clamp(20px,3vw,45px);background:rgba(5,14,24,.55);backdrop-filter:blur(16px);border-bottom:1px solid #ffffff19;}
|
|
.lg-brand{display:flex;align-items:center;gap:14px}.lg-letter{font-size:46px;font-weight:900;line-height:1;background:linear-gradient(145deg,#70cfff,#006cff);color:transparent;background-clip:text;}
|
|
.lg-brand strong{font-size:25px;display:block;line-height:1}.lg-brand small{color:#bccde2;font-size:12px;display:block;margin-top:6px}
|
|
.lg-nav{display:flex;gap:7px;flex-wrap:wrap}.lg-nav a{padding:10px 14px;border-radius:11px;color:#d1e2f2}.lg-nav a:hover,.lg-nav a.active{background:rgba(35,113,233,.67);color:#fff}
|
|
.lg-shell{max-width:1600px;margin:auto;padding:26px clamp(14px,3vw,45px) 40px;}
|
|
.lg-title{display:flex;align-items:flex-end;justify-content:space-between;gap:25px;margin-bottom:23px}.lg-title h1{font-size:clamp(27px,3vw,44px);margin:4px 0}.lg-title p{margin:8px 0;color:#c8d9eb;font-size:14px}.lg-eyebrow{color:#70b6ff!important;letter-spacing:.12em;font-size:11px!important;font-weight:800}
|
|
.lg-actions{display:flex;gap:10px;flex-wrap:wrap}button{background:rgba(19,77,145,.8);border:1px solid #8ebfe858;color:#fff;border-radius:11px;padding:11px 15px}button:hover{background:rgba(25,111,217,.92)}
|
|
.lg-filters,.lg-table-wrap{border:1px solid rgba(195,220,252,.22);background:rgba(9,21,36,.57);backdrop-filter:blur(18px);border-radius:19px;box-shadow:0 18px 60px #0003;}
|
|
.lg-filters{display:flex;align-items:end;flex-wrap:wrap;gap:15px;padding:18px;margin-bottom:18px}.lg-filters label{display:flex;flex-direction:column;gap:7px;color:#c9daed;font-size:12px;font-weight:650}.lg-filters input[type=search]{width:min(360px,70vw)}.lg-filters input,.lg-filters select{background:rgba(3,14,29,.72);color:white;border:1px solid #87acd04e;border-radius:10px;min-height:40px;padding:8px 11px}.lg-filters .lg-check{flex-direction:row;align-items:center;min-height:40px}.lg-check input{min-height:0;width:16px;height:16px}
|
|
.lg-table-wrap{padding:16px}.lg-table-top{display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid #c3d9ef26;padding:4px 6px 14px;color:#bbdefd;font-size:13px}.lg-events{max-height:62vh;min-height:260px;overflow:auto;scrollbar-color:#6995b3 transparent}.lg-event{display:grid;grid-template-columns:180px 94px 106px minmax(0,1fr);gap:12px;padding:12px 7px;border-bottom:1px solid #a9c7df18;align-items:start;font-size:13px}.lg-event time{color:#a6bcd0;font-variant-numeric:tabular-nums}.lg-component{font-weight:700;color:#8cc2ff}.lg-level{color:#afd6f5}.lg-event[data-level='Erreur'] .lg-level{color:#ff9898}.lg-event[data-level='Avertissement'] .lg-level{color:#ffd18a}.lg-message{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.5;color:#e5eff9}.lg-note{color:#adbfd0;font-size:12px;line-height:1.6;padding:12px 6px 0}.lg-note code{color:#c8e6ff}.lg-empty{padding:30px;color:#adc6dc;text-align:center}
|
|
:focus-visible{outline:2px solid #98d2ff;outline-offset:3px}
|
|
@media(max-width:850px){.lg-header,.lg-title{flex-wrap:wrap}.lg-event{grid-template-columns:95px 65px 1fr;gap:6px}.lg-event .lg-message{grid-column:1/-1;padding-left:2px}}
|
|
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
|