lukas.uptmoor/webgis-lohne
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

colapsable fotos and comments section in contribution popup, comment count in popup and sidebar

Browse Source
This commit was merged in pull request #11.
This commit is contained in:
patrickzerhusen
2026-04-27 14:48:05 +02:00
parent c39667e368
commit f23897018c
2 changed files with 116 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
public/styles.css
View File

@@ -630,8 +630,47 @@ select.form-input { cursor: pointer; }
/* -----------------------------------------------------------------
4.8 Popup Comments
4.8 Popup Photo and Comments
----------------------------------------------------------------- */
/* Photo Toggle Button */
.popup-photo-toggle {
margin: var(--space-sm) 0;
}
.popup-photo-btn {
display: inline-flex;
align-items: center;
gap: 4px;
padding: 4px 12px;
border: 1px solid var(--color-border);
border-radius: 16px;
background: var(--color-surface);
cursor: pointer;
font-size: 0.78rem;
color: var(--color-text-secondary);
font-family: var(--font-body);
transition: all var(--transition-fast);
}
.popup-photo-btn:hover {
border-color: var(--color-primary);
color: var(--color-primary);
}
/* Photo Container */
.popup-photo-container { margin-bottom: var(--space-sm); }
.popup-photo-img {
max-width: 100%;
max-height: 180px;
object-fit: cover;
border-radius: 6px;
cursor: pointer;
border: 1px solid var(--color-border);
}
/* Comments Section */
.popup-comments {
margin-top: var(--space-sm);
padding-top: var(--space-sm);
@@ -642,12 +681,26 @@ select.form-input { cursor: pointer; }
font-size: 0.8rem;
font-weight: 600;
color: var(--color-text-secondary);
margin-bottom: var(--space-sm);
cursor: pointer;
display: flex;
align-items: center;
gap: 4px;
padding: 4px 0;
transition: color var(--transition-fast);
}
.popup-comments-header:hover { color: var(--color-primary); }
.popup-comments-toggle {
font-size: 0.65rem;
margin-left: auto;
transition: transform 200ms ease;
}
.popup-comments-list {
max-height: 150px;
overflow-y: auto;
margin-top: var(--space-sm);
}
.popup-comment {
@@ -669,10 +722,7 @@ select.form-input { cursor: pointer; }
line-height: 1.4;
}
.popup-comment-delete {
color: var(--color-error);
font-size: 0.7rem;
}
.popup-comment-delete { color: var(--color-error); font-size: 0.7rem; }
.popup-comment-empty {
font-size: 0.8rem;
@@ -697,9 +747,7 @@ select.form-input { cursor: pointer; }
outline: none;
}
.popup-comment-input:focus {
border-color: var(--color-primary);
}
.popup-comment-input:focus { border-color: var(--color-primary); }
.popup-comment-submit {
border: none;