| .forum-page { | |
| color: #fff; | |
| background-color: #2d2d2d; | |
| min-height: 100vh; | |
| font-family: Arial, sans-serif; | |
| } | |
| .header { | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: center; | |
| background: #1f1f1f; | |
| padding: 10px 20px; | |
| } | |
| .logo { | |
| height: 40px; | |
| } | |
| .site-name { | |
| margin-left: 10px; | |
| font-size: 24px; | |
| } | |
| .user-avatar { | |
| height: 40px; | |
| border-radius: 50%; | |
| } | |
| .nav { | |
| display: flex; | |
| background: #333; | |
| padding: 10px 0; | |
| } | |
| .nav-item { | |
| color: #ccc; | |
| margin: 0 15px; | |
| text-decoration: none; | |
| } | |
| .nav-item.active { | |
| color: #fff; | |
| border-bottom: 2px solid #fff; | |
| } | |
| .forum-content { | |
| padding: 20px; | |
| } | |
| .post-list { | |
| display: flex; | |
| flex-direction: column; | |
| gap: 20px; | |
| } | |
| .post-card { | |
| background-color: #4A3B34; | |
| padding: 15px; | |
| border-radius: 10px; | |
| position: relative; | |
| } | |
| .post-card-top { | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: center; | |
| } | |
| .user-info { | |
| display: flex; | |
| align-items: center; | |
| } | |
| .avatar { | |
| width: 36px; | |
| height: 36px; | |
| border-radius: 50%; | |
| margin-right: 10px; | |
| } | |
| .nickname { | |
| font-weight: bold; | |
| } | |
| .cover-image { | |
| max-height: 80px; | |
| max-width: 120px; | |
| object-fit: cover; | |
| border-radius: 6px; | |
| } | |
| .post-meta { | |
| font-size: 12px; | |
| margin-top: 5px; | |
| color: #ddd; | |
| } | |
| .post-actions { | |
| display: flex; | |
| gap: 15px; | |
| margin: 10px 0; | |
| } | |
| .icon-btn { | |
| display: flex; | |
| align-items: center; | |
| gap: 5px; | |
| background: none; | |
| border: none; | |
| color: #fff; | |
| cursor: pointer; | |
| } | |
| .btn-secondary { | |
| display: inline-block; | |
| background: #888; | |
| color: #fff; | |
| padding: 6px 12px; | |
| text-decoration: none; | |
| border-radius: 5px; | |
| margin-top: 10px; | |
| } | |
| .pagination { | |
| margin-top: 20px; | |
| display: flex; | |
| justify-content: center; | |
| gap: 10px; | |
| } | |
| .error-text { | |
| color: red; | |
| } | |