feat: ordre naturel des sections Configurations et avatar utilisateur #113
This commit is contained in:
@@ -2616,6 +2616,60 @@ select {
|
||||
}
|
||||
.profile-hint { display: block; font-size: 0.65rem; color: var(--text-muted); margin-top: 4px; }
|
||||
.profile-saved { font-size: 0.7rem; color: var(--accent-green); margin-left: 10px; }
|
||||
/* Profile picture picker (#113) */
|
||||
.profile-avatar-field { margin-bottom: 18px; }
|
||||
.profile-avatar-label { display: block; font-size: 0.75rem; font-weight: 600; color: var(--text-primary); margin-bottom: 8px; }
|
||||
.profile-avatar-row { display: flex; align-items: center; gap: 16px; }
|
||||
.profile-avatar-preview {
|
||||
position: relative;
|
||||
width: 88px;
|
||||
height: 88px;
|
||||
border-radius: 50%;
|
||||
flex-shrink: 0;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 55%, #7c3aed));
|
||||
border: 2px solid var(--border);
|
||||
cursor: pointer;
|
||||
transition: border-color 0.15s ease, box-shadow 0.15s ease;
|
||||
}
|
||||
.profile-avatar-preview:hover,
|
||||
.profile-avatar-preview:focus-within {
|
||||
border-color: var(--accent);
|
||||
box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
|
||||
}
|
||||
.profile-avatar-preview img { width: 100%; height: 100%; object-fit: cover; display: block; }
|
||||
.profile-avatar-initials {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.02em;
|
||||
color: #fff;
|
||||
user-select: none;
|
||||
}
|
||||
.profile-avatar-overlay {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
background: rgba(0, 0, 0, 0.45);
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
transition: opacity 0.15s ease;
|
||||
}
|
||||
.profile-avatar-preview:hover .profile-avatar-overlay,
|
||||
.profile-avatar-overlay:focus-visible { opacity: 1; }
|
||||
.profile-avatar-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-width: 0; }
|
||||
.profile-avatar-actions .config-btn-secondary { font-size: 0.75rem; padding: 6px 14px; }
|
||||
.profile-avatar-remove-btn { background: var(--danger-bg) !important; color: var(--danger) !important; border-color: var(--danger) !important; }
|
||||
.profile-avatar-error { font-size: 0.7rem; color: var(--danger); margin-top: 8px; }
|
||||
.profile-avatar-error.hidden { display: none; }
|
||||
.config-save-btn {
|
||||
padding: 6px 18px; font-size: 0.75rem; font-weight: 600;
|
||||
background: var(--accent); color: #fff;
|
||||
@@ -6086,6 +6140,14 @@ body.resizing-v {
|
||||
color: #fff;
|
||||
background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 55%, #7c3aed));
|
||||
}
|
||||
/* #113 — custom avatar image fills the circle; initials stay the fallback */
|
||||
.sidebar-user-avatar-img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
border-radius: 50%;
|
||||
display: block;
|
||||
}
|
||||
.sidebar-user-meta {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
Reference in New Issue
Block a user