(READ ONLY) Margin is an open annotation layer for the internet. Powered by the AT Protocol.
Something went wrong. Try again.
CSS
at ui-refactor
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768.notifications-page { max-width: 680px; margin: 0 auto;}
.notifications-list { display: flex; flex-direction: column; gap: 12px;}
.notification-item { display: flex; gap: 16px; align-items: flex-start; text-decoration: none; color: inherit;}
.notification-item:hover { background: var(--bg-hover);}
.notification-icon { width: 36px; height: 36px; border-radius: var(--radius-full); display: flex; align-items: center; justify-content: center; background: var(--bg-tertiary); color: var(--text-secondary); flex-shrink: 0;}
.notification-icon[data-type="like"] { color: #ef4444; background: rgba(239, 68, 68, 0.1);}
.notification-icon[data-type="reply"] { color: #3b82f6; background: rgba(59, 130, 246, 0.1);}
.notification-content { flex: 1; min-width: 0;}
.notification-text { font-size: 0.95rem; margin-bottom: 4px; line-height: 1.4; color: var(--text-primary); overflow-wrap: break-word; word-break: break-word;}
.notification-text strong { font-weight: 600;}
.notification-time { font-size: 0.85rem; color: var(--text-tertiary);}