diff options
| author | boasting-squirrel <boasting.squirrel@gmail.com> | 2019-02-20 09:01:14 +0000 |
|---|---|---|
| committer | boasting-squirrel <boasting.squirrel@gmail.com> | 2019-02-20 09:01:14 +0000 |
| commit | 3a617a204e11370d2f96c15d5bfec774a42abfb6 (patch) | |
| tree | 7a71078c968e2a55f9096da5faf736b1068e0764 | |
| parent | Merge pull request #38 from boastful-squirrel/date (diff) | |
| download | miniserve-3a617a204e11370d2f96c15d5bfec774a42abfb6.tar.gz miniserve-3a617a204e11370d2f96c15d5bfec774a42abfb6.zip | |
Improved mobile view
| -rw-r--r-- | src/listing.rs | 65 |
1 files changed, 61 insertions, 4 deletions
diff --git a/src/listing.rs b/src/listing.rs index 21aebec..629a117 100644 --- a/src/listing.rs +++ b/src/listing.rs @@ -197,19 +197,60 @@ pub fn directory_listing<S>( EntryType::Directory => { let _ = write!( body, - "<tr><td><a class=\"directory\" href=\"{}\">{}/</a></td><td></td><td class=\"date-cell\"><span>{}</span><span>{}</span><span>{}</span></td></tr>", - entry.link, entry.name, modification_date, modification_time, humanize_systemtime(entry.last_modification_date) + "<tr>\ + <td>\ + <a class=\"directory\" href=\"{}\">{}/</a>\ + <span class=\"mobile-info\">\ + <strong>Last modification:</strong> {} {}\ + </span>\ + </td>\ + <td></td>\ + <td class=\"date-cell\">\ + <span>{}</span>\ + <span>{}</span>\ + <span>{}</span>\ + </td>\ + </tr>", + entry.link, + entry.name, + modification_date, + modification_time, + modification_date, + modification_time, + humanize_systemtime(entry.last_modification_date) ); } EntryType::File => { let _ = write!( body, - "<tr><td><a class=\"file\" href=\"{}\">{}</a></td><td>{}</td><td class=\"date-cell\"><span>{}</span><span>{}</span><span>{}</span></td></tr>", + "<tr>\ + <td>\ + <a class=\"file\" href=\"{}\">{}</a>\ + <span class=\"mobile-info\">\ + <strong>Size:</strong> {}\ + </span>\ + <span class=\"mobile-info\">\ + <strong>Last modification:</strong> {} {} <span class=\"history\">({})</span>\ + </span>\ + </td>\ + <td>\ + {}\ + </td>\ + <td class=\"date-cell\">\ + <span>{}</span>\ + <span>{}</span>\ + <span>{}</span>\ + </td>\ + </tr>", entry.link, entry.name, entry.size.unwrap(), modification_date, modification_time, + humanize_systemtime(entry.last_modification_date), + entry.size.unwrap(), + modification_date, + modification_time, humanize_systemtime(entry.last_modification_date) ); } @@ -220,6 +261,7 @@ pub fn directory_listing<S>( "<html>\ <head>\ <title>{}</title>\ + <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\ <style>\ body {{\ margin: 0;\ @@ -279,13 +321,28 @@ pub fn directory_listing<S>( td.date-cell span:nth-of-type(2) {{\ flex-basis:4.5rem;\ }}\ - td.date-cell span:nth-of-type(3) {{\ + td.date-cell span:nth-of-type(3), .history {{\ color: #c5c5c5;\ }}\ + .file, .directory {{\ + display: block;\ + }}\ + .mobile-info {{\ + display: none;\ + }}\ @media (max-width: 600px) {{\ h1 {{\ font-size: 1.375em;\ }}\ + td:not(:nth-child(1)), th:not(:nth-child(1)){{\ + display: none;\ + }}\ + .mobile-info {{\ + display: block;\ + }}\ + .file, .directory{{\ + padding-bottom: 0.5rem;\ + }}\ }}\ @media (max-width: 400px) {{\ h1 {{\ |