TRM-coding | d1cbf67 | 2025-06-18 15:15:08 +0800 | [diff] [blame] | 1 | /* src/style/CreatePost.css */ |
2 | .create-post { | ||||
3 | max-width: 600px; | ||||
4 | margin: 0 auto; | ||||
5 | padding: 20px; | ||||
6 | background: #fff; | ||||
7 | border-radius: 8px; | ||||
8 | } | ||||
9 | |||||
10 | /* 预览区 */ | ||||
11 | .preview-media { | ||||
12 | display: flex; | ||||
13 | gap: 12px; | ||||
14 | flex-wrap: wrap; | ||||
15 | margin-bottom: 20px; | ||||
16 | } | ||||
17 | .preview-item { | ||||
18 | width: 100px; | ||||
19 | height: 100px; | ||||
20 | overflow: hidden; | ||||
21 | border: 1px solid #eee; | ||||
22 | border-radius: 4px; | ||||
23 | } | ||||
24 | .preview-item img, | ||||
25 | .preview-item video { | ||||
26 | width: 100%; | ||||
27 | height: 100%; | ||||
28 | object-fit: cover; | ||||
29 | } | ||||
30 | |||||
31 | /* 表单项 */ | ||||
32 | label { | ||||
33 | display: block; | ||||
34 | margin-bottom: 16px; | ||||
35 | font-size: 14px; | ||||
36 | color: #333; | ||||
37 | } | ||||
38 | label input[type="text"], | ||||
39 | label textarea, | ||||
40 | label select { | ||||
41 | width: 100%; | ||||
42 | padding: 8px; | ||||
43 | margin-top: 6px; | ||||
44 | border: 1px solid #ddd; | ||||
45 | border-radius: 4px; | ||||
46 | font-size: 14px; | ||||
47 | box-sizing: border-box; | ||||
48 | } | ||||
49 | label textarea { | ||||
50 | min-height: 120px; | ||||
51 | resize: vertical; | ||||
52 | } | ||||
53 | .char-count { | ||||
54 | float: right; | ||||
55 | font-size: 12px; | ||||
56 | color: #999; | ||||
57 | } | ||||
58 | |||||
59 | /* 发布状态 */ | ||||
60 | .status-group { | ||||
61 | display: flex; | ||||
62 | gap: 20px; | ||||
63 | margin-bottom: 20px; | ||||
64 | } | ||||
65 | .status-group label { | ||||
66 | display: flex; | ||||
67 | align-items: center; | ||||
68 | gap: 6px; | ||||
69 | font-size: 14px; | ||||
70 | } | ||||
71 | |||||
72 | /* 按钮组 */ | ||||
73 | .btn-group { | ||||
74 | display: flex; | ||||
75 | gap: 12px; | ||||
76 | justify-content: flex-end; | ||||
77 | } | ||||
78 | .btn { | ||||
79 | padding: 8px 16px; | ||||
80 | border-radius: 4px; | ||||
81 | border: none; | ||||
82 | cursor: pointer; | ||||
83 | font-size: 14px; | ||||
84 | } | ||||
85 | .btn-primary { | ||||
86 | background: #ff4757; | ||||
87 | color: #fff; | ||||
88 | } | ||||
89 | .btn-secondary { | ||||
90 | background: #f0f0f0; | ||||
91 | color: #333; | ||||
92 | } | ||||
93 | |||||
94 | /* 错误信息 */ | ||||
95 | .error { | ||||
96 | color: #d9534f; | ||||
97 | margin-bottom: 12px; | ||||
98 | } |