commit

assets/css/style.css

@@ -0,0 +1,165 @@
+/* 后台样式 */
+.flm-admin-container {
+    display: flex;
+    gap: 2rem;
+    margin-top: 20px;
+}
+
+.flm-add-form {
+    flex: 1;
+    max-width: 400px;
+    background: #fff;
+    padding: 20px;
+    border-radius: 4px;
+    box-shadow: 0 1px 1px rgba(0,0,0,0.04);
+}
+
+.flm-links-list {
+    flex: 2;
+    background: #fff;
+    padding: 20px;
+    border-radius: 4px;
+    box-shadow: 0 1px 1px rgba(0,0,0,0.04);
+}
+
+.form-group {
+    margin-bottom: 15px;
+}
+
+.form-group label {
+    display: block;
+    margin-bottom: 5px;
+    font-weight: 600;
+}
+
+.form-group input[type="text"],
+.form-group input[type="url"] {
+    width: 100%;
+    padding: 8px;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+}
+
+#flm-sortable-links {
+    list-style: none;
+    padding: 0;
+    margin: 20px 0;
+}
+
+.flm-link-item {
+    display: flex;
+    align-items: center;
+    gap: 15px;
+    padding: 15px;
+    margin-bottom: 15px;
+    background: #f9f9f9;
+    border-radius: 4px;
+    border-left: 4px solid #6667ab;
+}
+
+.flm-link-preview {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    min-width: 200px;
+}
+
+.flm-link-icon {
+    width: 32px;
+    height: 32px;
+    border-radius: 50%;
+    object-fit: cover;
+}
+
+.flm-link-fields {
+    flex: 1;
+}
+
+.flm-link-actions {
+    min-width: 100px;
+}
+
+.flm-import-export {
+    margin-top: 30px;
+    padding-top: 20px;
+    border-top: 1px solid #eee;
+}
+
+.flm-import-export h3 {
+    margin-bottom: 15px;
+}
+
+.flm-export, .flm-import {
+    margin-bottom: 15px;
+}
+
+/* 前端展示样式 */
+.flm-links-container {
+    display: grid;
+    grid-template-columns: repeat(3, 1fr);
+    gap: 20px;
+    margin: 20px 0;
+}
+
+.flm-link-card {
+    border: 1px solid #6667ab;
+    border-radius: 14px;
+    padding: 20px;
+    text-align: center;
+    transition: all 0.3s ease;
+}
+
+.flm-link-card:hover {
+    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
+    transform: translateY(-2px);
+}
+
+.flm-link-icon-container {
+    margin-bottom: 10px;
+}
+
+.flm-link-icon-container img {
+    width: 64px;
+    height: 64px;
+    border-radius: 50%;
+    object-fit: cover;
+    border: 1px solid #eee;
+}
+
+.flm-link-name {
+    font-weight: bold;
+    color: inherit; /* 使用主题默认颜色 */
+    margin-top: 10px;
+}
+
+.flm-link-card a {
+    text-decoration: none;
+    color: inherit;
+    display: block;
+}
+
+/* 响应式设计 */
+@media (max-width: 1024px) {
+    .flm-links-container {
+        grid-template-columns: repeat(2, 1fr);
+    }
+}
+
+@media (max-width: 600px) {
+    .flm-admin-container {
+        flex-direction: column;
+    }
+    
+    .flm-add-form {
+        max-width: 100%;
+    }
+    
+    .flm-links-container {
+        grid-template-columns: 1fr;
+    }
+    
+    .flm-link-item {
+        flex-direction: column;
+        align-items: flex-start;
+    }
+}

assets/js/admin.js

@@ -0,0 +1,45 @@
+jQuery(document).ready(function($) {
+    // 使链接可排序
+    $('#flm-sortable-links').sortable({
+        handle: '.flm-link-preview',
+        placeholder: 'flm-link-item-placeholder',
+        axis: 'y',
+        update: function() {
+            // 更新排序后可以在这里添加AJAX保存逻辑
+        }
+    });
+    
+    // 删除链接
+    $('.flm-delete-link').on('click', function(e) {
+        e.preventDefault();
+        
+        if (!confirm('确定要删除这个链接吗？')) {
+            return;
+        }
+        
+        var $button = $(this);
+        var linkId = $button.data('link-id');
+        
+        $.ajax({
+            url: flm_vars.ajax_url,
+            type: 'POST',
+            data: {
+                action: 'flm_delete_link',
+                link_id: linkId,
+                nonce: flm_vars.nonce
+            },
+            beforeSend: function() {
+                $button.prop('disabled', true).text('删除中...');
+            },
+            success: function() {
+                $button.closest('.flm-link-item').fadeOut(300, function() {
+                    $(this).remove();
+                });
+            },
+            error: function() {
+                alert('删除失败，请重试');
+                $button.prop('disabled', false).text('删除');
+            }
+        });
+    });
+});