Migration complete

resources/css/layout/content.css

@@ -53,6 +53,155 @@
     }
 }
 
+.topbar-more-container {
+    display: none;
+}
+
+.topbar-more-menu {
+    position: fixed;
+    top: 60px;
+    right: 0;
+    background-color: var(--bg2);
+    border: 1px solid var(--border);
+    border-top: none;
+    border-right: none;
+    z-index: 2000;
+    min-width: 180px;
+    max-height: calc(100vh - 60px);
+    overflow-y: auto;
+}
+
+.topbar-more-item {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    padding: 10px 12px;
+    color: var(--text2);
+    text-decoration: none;
+    font-size: 0.9rem;
+    border-bottom: 1px solid var(--border);
+    transition: all 0.15s;
+
+    &:last-child {
+        border-bottom: none;
+    }
+
+    &:hover {
+        background-color: var(--bg3);
+        color: var(--text);
+    }
+
+    i {
+        width: 16px;
+        height: 16px;
+        flex-shrink: 0;
+    }
+
+    span {
+        flex-grow: 1;
+        text-align: left;
+    }
+}
+
+@media (min-width: 769px) {
+    .topbar-more-container {
+        display: none !important;
+    }
+
+    .topbar-admin-btn,
+    .topbar-mod-btn {
+        display: flex !important;
+    }
+}
+@media (max-width: 768px) {
+    .topbar-more-container {
+        display: block;
+    }
+
+    .topbar-admin-btn,
+    .topbar-mod-btn {
+        display: none !important;
+    }
+
+    #topbar {
+        padding: 0 10px;
+    }
+
+    .search-bar {
+        display: none !important;
+    }
+
+    .topbar-actions {
+        gap: 8px !important;
+    }
+
+    .topbar-actions .btn {
+        padding: 8px 6px;
+        font-size: 0.85rem;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+
+    .topbar-actions i {
+        width: 16px !important;
+        height: 16px !important;
+    }
+
+    .topbar-badge {
+        font-size: 0.65rem;
+        width: 18px;
+        height: 18px;
+    }
+}
+
+@media (max-width: 600px) {
+    #topbar {
+        padding: 0 8px;
+    }
+
+    .topbar-actions {
+        gap: 8px !important;
+    }
+
+    .topbar-actions .btn {
+        padding: 6px 4px;
+        font-size: 0.75rem;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+
+    .topbar-actions i {
+        width: 14px !important;
+        height: 14px !important;
+    }
+
+    .topbar-badge {
+        font-size: 0.6rem;
+        width: 16px;
+        height: 16px;
+    }
+}
+
+.search-scope-select {
+    background-color: var(--bg2);
+    border: none;
+    border-right: 1px solid var(--border);
+    color: var(--text2);
+    font-size: 0.8rem;
+    padding: 8px 10px;
+    cursor: pointer;
+    outline: none;
+    appearance: none;
+    transition: color 0.15s;
+}
+
+.search-scope-select:hover,
+.search-scope-select:focus {
+    color: var(--text);
+}
+
 #content {
     flex-grow: 1;
     padding: 30px;