Showing
2 changed files
with
28 additions
and
7 deletions
@@ -30,10 +30,28 @@ | @@ -30,10 +30,28 @@ | ||
30 | display: flex; | 30 | display: flex; |
31 | border: 1px solid black; | 31 | border: 1px solid black; |
32 | width: fit-content; | 32 | width: fit-content; |
33 | + margin-bottom: .15em; | ||
34 | +} | ||
35 | + | ||
36 | +.upload > ul > li:last-child { | ||
37 | + margin-bottom: 0; | ||
38 | +} | ||
39 | + | ||
40 | +.upload > ul > li > ul { | ||
41 | + display: table; | ||
33 | } | 42 | } |
34 | 43 | ||
35 | .upload > ul > li > ul > li { | 44 | .upload > ul > li > ul > li { |
36 | - display: block; | 45 | + display: table-row; |
46 | +} | ||
47 | + | ||
48 | +.upload > ul > li > ul > li > span { | ||
49 | + display: table-cell; | ||
50 | +} | ||
51 | + | ||
52 | +.upload > ul > li > ul > li > span:first-child:after { | ||
53 | + content: ":"; | ||
54 | + margin-right: .15em; | ||
37 | } | 55 | } |
38 | 56 | ||
39 | .markdown { | 57 | .markdown { |
1 | use mogwai::prelude::*; | 1 | use mogwai::prelude::*; |
2 | +use chrono::prelude::*; | ||
2 | 3 | ||
3 | use crate::component::upload::logic::UploadLogic; | 4 | use crate::component::upload::logic::UploadLogic; |
4 | 5 | ||
@@ -13,17 +14,19 @@ pub(super) fn upload_preview_view( tx_canvas :broadcast::Sender<Dom> | @@ -13,17 +14,19 @@ pub(super) fn upload_preview_view( tx_canvas :broadcast::Sender<Dom> | ||
13 | tx_canvas.try_broadcast(dom.clone()).unwrap(); | 14 | tx_canvas.try_broadcast(dom.clone()).unwrap(); |
14 | }; | 15 | }; |
15 | 16 | ||
17 | + let size = format!("{}", size); | ||
18 | + let mtime = format!("{}", Utc.timestamp_millis(mtime as i64)); | ||
19 | + | ||
16 | builder! { | 20 | builder! { |
17 | - <li style:display="flex" | ||
18 | - on:click=tx_click.sink()> | 21 | + <li on:click=tx_click.sink()> |
19 | <canvas width="75px" | 22 | <canvas width="75px" |
20 | height="75px" | 23 | height="75px" |
21 | post:build=post_build /> | 24 | post:build=post_build /> |
22 | <ul> | 25 | <ul> |
23 | - <li>{format!("filename: {}", filename)}</li> | ||
24 | - <li>{format!("size: {}", size)}</li> | ||
25 | - <li>{format!("mime type: {}", mime_type)}</li> | ||
26 | - <li>{format!("modification time: {}", mtime)}</li> | 26 | + <li><span>"Name"</span><span>{filename}</span></li> |
27 | + <li><span>"Size"</span><span>{size}</span></li> | ||
28 | + <li><span>"Mime-Type"</span><span>{mime_type}</span></li> | ||
29 | + <li><span>"Date"</span><span>{mtime}</span></li> | ||
27 | </ul> | 30 | </ul> |
28 | </li> | 31 | </li> |
29 | } | 32 | } |
Please
register
or
login
to post a comment