vue-chat-kit 0.1.1 → 0.1.3

package/dist/vue-chat-kit.css

@@ -0,0 +1 @@
+@tailwind base;@tailwind components;@tailwind utilities;.avatar-crop-container[data-v-4e4a992b]{display:flex;flex-direction:column;gap:20px}.crop-area[data-v-4e4a992b]{position:relative;width:100%;height:300px;overflow:hidden;background:#f5f5f5;border-radius:8px}.crop-image[data-v-4e4a992b]{position:absolute;cursor:move;-webkit-user-select:none;user-select:none;max-width:none}.crop-overlay[data-v-4e4a992b]{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.crop-box[data-v-4e4a992b]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:200px;height:200px}.crop-border[data-v-4e4a992b]{width:100%;height:100%;border:2px solid #fff;box-shadow:0 0 0 9999px #00000080;border-radius:8px}.crop-mask[data-v-4e4a992b]{position:absolute;top:0;right:0;bottom:0;left:0;cursor:move}.zoom-controls[data-v-4e4a992b]{padding:0 20px}.chat-dialog[data-v-a76a4ef3] .el-dialog{padding:0;border-radius:12px;overflow:hidden}.chat-dialog[data-v-a76a4ef3] .el-dialog__header{display:none}.chat-dialog[data-v-a76a4ef3] .el-dialog__body{padding:0}.bubble-self[data-v-a76a4ef3]{position:relative;background-color:#95ec69!important}.bubble-self[data-v-a76a4ef3]:after{content:"";position:absolute;right:-5px;top:10px;width:10px;height:10px;background-color:#95ec69;transform:rotate(45deg);box-shadow:2px -2px 2px #0000000d}.bubble-other[data-v-a76a4ef3]{position:relative;background-color:#fff!important}.bubble-other[data-v-a76a4ef3]:after{content:"";position:absolute;left:-5px;top:10px;width:10px;height:10px;background-color:#fff;transform:rotate(45deg);box-shadow:-2px 2px 2px #0000000d}.messages-container[data-v-a76a4ef3]::-webkit-scrollbar{width:6px}.messages-container[data-v-a76a4ef3]::-webkit-scrollbar-thumb{background:#ccc;border-radius:3px}.messages-container[data-v-a76a4ef3]::-webkit-scrollbar-track{background:transparent}.settings-dialog[data-v-a76a4ef3] .el-dialog{border-radius:16px;overflow:hidden}.settings-dialog[data-v-a76a4ef3] .el-dialog__header{padding:24px 24px 0;margin:0}.settings-dialog[data-v-a76a4ef3] .el-dialog__title{font-size:20px;font-weight:600;color:#1f2937}.chat-container[data-v-a76a4ef3]{display:flex;height:680px;background-color:#fff;overflow:hidden}.sidebar-nav[data-v-a76a4ef3]{width:64px;display:flex;flex-direction:column;align-items:center;gap:8px;background-color:#f9fafb;border-right:1px solid #e5e7eb}.sidebar-avatar[data-v-a76a4ef3]{margin-top:16px;margin-bottom:16px;cursor:pointer}.avatar-img[data-v-a76a4ef3]{width:40px;height:40px;border-radius:50%;border:2px solid #e5e7eb}.nav-item[data-v-a76a4ef3]{width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:8px;transition:all .2s;position:relative}.nav-item-active[data-v-a76a4ef3]{background-color:#f0fdf4;color:#16a34a}.nav-item-inactive[data-v-a76a4ef3]{color:#6b7280}.nav-item-inactive[data-v-a76a4ef3]:hover{background-color:#f3f4f6}.nav-badge[data-v-a76a4ef3]{position:absolute;top:-4px;right:-4px;width:16px;height:16px;background-color:#ef4444;border-radius:50%;font-size:10px;color:#fff;display:flex;align-items:center;justify-content:center}.nav-spacer[data-v-a76a4ef3]{flex:1}.content-panel[data-v-a76a4ef3]{width:288px;background-color:#f5f5f5;border-right:1px solid #e5e7eb;display:flex;flex-direction:column}.search-bar[data-v-a76a4ef3]{padding:12px}.content-scroll[data-v-a76a4ef3]{flex:1;overflow-y:auto;min-height:0}.chat-item[data-v-a76a4ef3]{display:flex;align-items:center;padding:12px;cursor:pointer;transition:background-color .2s}.chat-item[data-v-a76a4ef3]:hover{background-color:#e5e5e5}.chat-item-active[data-v-a76a4ef3]{background-color:#d6d6d6}.friend-avatar-wrapper[data-v-a76a4ef3]{position:relative;flex-shrink:0}.friend-avatar[data-v-a76a4ef3]{width:44px;height:44px;border-radius:50%;object-fit:cover}.online-indicator[data-v-a76a4ef3]{position:absolute;bottom:0;right:0;width:12px;height:12px;background-color:#22c55e;border-radius:50%;border:2px solid white}.online-indicator.offline[data-v-a76a4ef3]{background-color:#9ca3af}.friend-info[data-v-a76a4ef3]{margin-left:12px;flex:1;overflow:hidden}.friend-header[data-v-a76a4ef3]{display:flex;justify-content:space-between;align-items:center}.friend-name[data-v-a76a4ef3]{font-weight:500;color:#1f2937;font-size:14px}.last-time[data-v-a76a4ef3]{font-size:12px;color:#9ca3af}.friend-preview[data-v-a76a4ef3]{display:flex;justify-content:space-between;align-items:center;margin-top:4px}.last-msg[data-v-a76a4ef3]{font-size:12px;color:#6b7280;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:8px;flex:1}.unread-badge[data-v-a76a4ef3]{background-color:#ef4444;color:#fff;font-size:10px;border-radius:9999px;padding:2px 6px;min-width:18px;text-align:center}.add-friend-section[data-v-a76a4ef3]{padding:12px}.add-friend-btn[data-v-a76a4ef3]{display:flex;align-items:center;gap:8px;padding:8px;border-radius:8px;cursor:pointer}.add-friend-btn[data-v-a76a4ef3]:hover{background-color:#e5e5e5}.add-friend-icon[data-v-a76a4ef3]{width:44px;height:44px;background-color:#22c55e;border-radius:8px;display:flex;align-items:center;justify-content:center}.add-friend-text[data-v-a76a4ef3]{font-size:14px;color:#1f2937}.friend-request-item[data-v-a76a4ef3]{display:flex;align-items:center;justify-content:space-between;padding:12px}.friend-request-item[data-v-a76a4ef3]:hover{background-color:#e5e5e5}.request-info[data-v-a76a4ef3]{display:flex;align-items:center}.request-avatar[data-v-a76a4ef3]{width:44px;height:44px;border-radius:50%;object-fit:cover}.request-details[data-v-a76a4ef3]{margin-left:12px}.request-username[data-v-a76a4ef3]{font-weight:500;color:#1f2937;font-size:14px}.request-desc[data-v-a76a4ef3]{font-size:12px;color:#6b7280;margin-top:4px}.chat-area[data-v-a76a4ef3]{flex:1;display:flex;flex-direction:column;min-width:0;background-color:#fff}.friend-profile[data-v-a76a4ef3]{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px;background-color:#f5f5f5}.profile-avatar[data-v-a76a4ef3]{width:96px;height:96px;border-radius:50%;object-fit:cover;margin-bottom:24px}.profile-name[data-v-a76a4ef3]{font-size:20px;font-weight:500;color:#1f2937;margin-bottom:8px}.profile-status[data-v-a76a4ef3]{display:flex;align-items:center;gap:8px;margin-bottom:32px}.status-dot[data-v-a76a4ef3]{width:8px;height:8px;border-radius:50%}.status-online[data-v-a76a4ef3]{background-color:#22c55e}.status-offline[data-v-a76a4ef3]{background-color:#9ca3af}.start-chat-btn[data-v-a76a4ef3]{width:160px}.chat-window[data-v-a76a4ef3]{flex:1;display:flex;flex-direction:column;min-height:0}.chat-header[data-v-a76a4ef3]{height:56px;border-bottom:1px solid #e5e7eb;display:flex;align-items:center;justify-content:space-between;padding:0 16px;background-color:#fff}.chat-title[data-v-a76a4ef3]{display:flex;align-items:center;gap:12px}.chat-name[data-v-a76a4ef3]{font-weight:500;color:#1f2937}.status-badge[data-v-a76a4ef3]{font-size:12px;padding:2px 8px;border-radius:4px}.status-badge-online[data-v-a76a4ef3]{background-color:#dcfce7;color:#16a34a}.status-badge-offline[data-v-a76a4ef3]{background-color:#f3f4f6;color:#6b7280}.chat-actions[data-v-a76a4ef3]{display:flex;align-items:center;gap:12px;color:#6b7280}.action-icon[data-v-a76a4ef3]{cursor:pointer}.action-icon[data-v-a76a4ef3]:hover{color:#374151}.messages-container[data-v-a76a4ef3]{flex:1;overflow-y:auto;padding:16px;background-color:#f5f5f5;min-height:0}.message-wrapper[data-v-a76a4ef3]{display:flex;margin-bottom:24px;align-items:flex-start}.message-self[data-v-a76a4ef3]{flex-direction:row-reverse}.message-other[data-v-a76a4ef3]{flex-direction:row}.message-avatar[data-v-a76a4ef3]{flex-shrink:0}.avatar-sm[data-v-a76a4ef3]{width:40px;height:40px;border-radius:8px;object-fit:cover}.message-content-wrapper[data-v-a76a4ef3]{display:flex;flex-direction:column;max-width:75%}.content-self[data-v-a76a4ef3]{margin-right:12px;align-items:flex-end}.content-other[data-v-a76a4ef3]{margin-left:12px;align-items:flex-start}.sender-name[data-v-a76a4ef3]{font-size:12px;color:#6b7280;margin-bottom:4px;margin-left:4px}.message-bubble-wrapper[data-v-a76a4ef3]{position:relative}.message-bubble[data-v-a76a4ef3]{padding:8px 12px;font-size:14px;word-break:break-all;white-space:pre-wrap;border-radius:8px;box-shadow:0 1px 2px #0000000d}.image-bubble[data-v-a76a4ef3]{border-radius:8px;position:relative;box-shadow:0 1px 2px #0000000d;cursor:pointer;overflow:hidden;max-width:300px}.message-image[data-v-a76a4ef3]{width:100%;height:auto;display:block}.image-size[data-v-a76a4ef3]{position:absolute;left:4px;bottom:0;color:#fff;font-size:10px}.file-bubble[data-v-a76a4ef3]{border-radius:8px;box-shadow:0 1px 2px #0000000d;cursor:pointer;overflow:hidden;min-width:200px}.file-content[data-v-a76a4ef3]{display:flex;align-items:center;gap:12px;padding:12px 16px}.file-icon[data-v-a76a4ef3]{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:8px;flex-shrink:0}.bubble-self .file-icon[data-v-a76a4ef3]{color:#374151}.bubble-other .file-icon[data-v-a76a4ef3]{color:#6b7280}.file-info[data-v-a76a4ef3]{flex:1;min-width:0}.file-name[data-v-a76a4ef3]{overflow:hidden;text-overflow:ellipsis;font-size:14px;font-weight:500;line-height:1.2}.bubble-self .file-name[data-v-a76a4ef3],.bubble-other .file-name[data-v-a76a4ef3]{color:#1f2937}.file-meta[data-v-a76a4ef3]{font-size:12px;margin-top:4px;display:flex;align-items:center;gap:8px}.bubble-self .file-meta[data-v-a76a4ef3]{color:#4b5563}.bubble-other .file-meta[data-v-a76a4ef3]{color:#6b7280}.message-time[data-v-a76a4ef3]{font-size:10px;color:#9ca3af;margin-top:4px}.time-right[data-v-a76a4ef3]{text-align:right}.time-left[data-v-a76a4ef3]{text-align:left}.input-area[data-v-a76a4ef3]{background-color:#fff;border-top:1px solid #e5e7eb}.pending-files[data-v-a76a4ef3]{padding:8px 12px;border-bottom:1px solid #f3f4f6;display:flex;flex-wrap:wrap;gap:8px}.pending-file[data-v-a76a4ef3]{position:relative}.pending-image-wrapper[data-v-a76a4ef3]{position:relative;width:80px;height:80px;border-radius:8px;overflow:hidden;border:1px solid #e5e7eb}.pending-image[data-v-a76a4ef3]{width:100%;height:100%;object-fit:cover}.pending-file-wrapper[data-v-a76a4ef3]{position:relative;width:96px;height:80px;border-radius:8px;border:1px solid #e5e7eb;background-color:#f9fafb;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4px}.pending-file-icon[data-v-a76a4ef3]{color:#9ca3af;font-size:28px;margin-bottom:4px}.pending-file-name[data-v-a76a4ef3]{font-size:10px;color:#6b7280;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;text-align:center;padding:0 4px}.remove-file-btn[data-v-a76a4ef3]{position:absolute;top:4px;right:4px;width:20px;height:20px;background-color:#00000080;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s;font-size:14px;border:none}.remove-file-btn[data-v-a76a4ef3]:hover{background-color:#000000b3}.input-actions[data-v-a76a4ef3]{display:flex;align-items:center;padding:12px;gap:8px}.input-wrapper[data-v-a76a4ef3]{padding:0 12px 12px}.message-input[data-v-a76a4ef3]{width:100%;resize:none;border:none;outline:none;font-size:14px;height:80px}.send-btn-wrapper[data-v-a76a4ef3]{display:flex;justify-content:flex-end;padding:0 12px 12px}.send-btn[data-v-a76a4ef3]{background-color:#07c160;border:none;font-size:14px;padding:8px 24px}.send-btn[data-v-a76a4ef3]:hover{background-color:#06ad56}.hidden-file-input[data-v-a76a4ef3]{display:none}.empty-state[data-v-a76a4ef3]{flex:1;display:flex;align-items:center;justify-content:center;flex-direction:column;background-color:#f5f5f5}.empty-icon[data-v-a76a4ef3]{color:#d1d5db;margin-bottom:8px}.empty-text[data-v-a76a4ef3]{color:#9ca3af}.detail-panel[data-v-a76a4ef3]{width:256px;background-color:#f5f5f5;border-left:1px solid #e5e7eb;display:flex;flex-direction:column}.detail-header[data-v-a76a4ef3]{height:56px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid #e5e7eb;font-weight:500;color:#374151}.detail-content[data-v-a76a4ef3]{flex:1;padding:16px}.detail-profile[data-v-a76a4ef3]{display:flex;flex-direction:column;align-items:center}.detail-avatar[data-v-a76a4ef3]{width:80px;height:80px;border-radius:50%;object-fit:cover}.detail-name[data-v-a76a4ef3]{margin-top:12px;font-weight:500;color:#1f2937;font-size:18px}.detail-actions[data-v-a76a4ef3]{margin-top:24px;width:100%}.detail-action-item[data-v-a76a4ef3]{padding:12px;border-bottom:1px solid #f3f4f6;cursor:pointer;background-color:#fff}.detail-action-item[data-v-a76a4ef3]:hover{background-color:#f9fafb}.detail-action-item[data-v-a76a4ef3]:first-child{border-radius:8px 8px 0 0}.detail-action-item[data-v-a76a4ef3]:last-child{border-bottom:none;border-radius:0 0 8px 8px}.search-users-wrapper[data-v-a76a4ef3]{margin-bottom:16px}.search-users-input[data-v-a76a4ef3]{position:relative}.users-list-scroll[data-v-a76a4ef3]{max-height:400px;overflow-y:auto}.available-user-item[data-v-a76a4ef3]{display:flex;align-items:center;justify-content:space-between;padding:12px;margin-bottom:8px;border-radius:8px;transition:background-color .2s}.available-user-item[data-v-a76a4ef3]:hover{background-color:#f9fafb}.available-user-info[data-v-a76a4ef3]{display:flex;align-items:center}.available-user-avatar[data-v-a76a4ef3]{width:40px;height:40px;border-radius:50%;object-fit:cover}.available-user-name[data-v-a76a4ef3]{margin-left:12px;font-weight:500;color:#1f2937}.settings-container[data-v-a76a4ef3]{display:flex;flex-direction:column}.settings-avatar-section[data-v-a76a4ef3]{display:flex;flex-direction:column;align-items:center;margin-bottom:32px;padding-bottom:24px;border-bottom:1px solid #f3f4f6}.settings-avatar-wrapper[data-v-a76a4ef3]{position:relative;margin-bottom:16px}.settings-avatar[data-v-a76a4ef3]{width:112px;height:112px;border-radius:50%;object-fit:cover;border:4px solid white;box-shadow:0 10px 15px -3px #0000001a}.settings-avatar-edit[data-v-a76a4ef3]{position:absolute;bottom:-4px;right:-4px;width:40px;height:40px;background-color:#22c55e;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s;box-shadow:0 4px 6px -1px #0000001a}.settings-avatar-edit[data-v-a76a4ef3]:hover{background-color:#16a34a}.settings-avatar-icon[data-v-a76a4ef3]{color:#fff}.hidden-avatar-input[data-v-a76a4ef3]{display:none}.settings-user-display[data-v-a76a4ef3]{text-align:center}.settings-nickname[data-v-a76a4ef3]{font-weight:600;color:#1f2937;font-size:20px}.settings-username[data-v-a76a4ef3]{font-size:14px;color:#6b7280;margin-top:4px}.settings-form-section[data-v-a76a4ef3]{gap:20px}.settings-form-header[data-v-a76a4ef3]{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.settings-form-title[data-v-a76a4ef3]{color:#374151;font-weight:600;display:flex;align-items:center;gap:8px}.settings-edit-btn[data-v-a76a4ef3]{border-radius:9999px}.settings-form[data-v-a76a4ef3]{background-color:#f9fafb;border-radius:16px;padding:24px;gap:20px;display:flex;flex-direction:column}.settings-form-item[data-v-a76a4ef3]{display:flex;flex-direction:column}.settings-form-label[data-v-a76a4ef3]{display:block;font-size:14px;color:#4b5563;margin-bottom:8px;font-weight:500}.settings-form-value[data-v-a76a4ef3]{color:#1f2937;background-color:#fff;border-radius:8px;padding:12px 16px;border:1px solid #e5e7eb}.bio-value[data-v-a76a4ef3]{min-height:80px}.settings-form-actions[data-v-a76a4ef3]{display:flex;gap:12px;justify-content:flex-end;padding-top:8px}.context-menu[data-v-a76a4ef3]{position:fixed;background-color:#fff;border-radius:8px;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;border:1px solid #e5e7eb;padding:4px 0;z-index:1000}.context-menu-item[data-v-a76a4ef3]{padding:8px 16px;cursor:pointer;font-size:14px}.context-menu-item[data-v-a76a4ef3]:hover{background-color:#f3f4f6}