diff --git a/DiscordChatExporter.Domain/Discord/Models/Common/FileSize.cs b/DiscordChatExporter.Domain/Discord/Models/Common/FileSize.cs index 18504434..dc568d4b 100644 --- a/DiscordChatExporter.Domain/Discord/Models/Common/FileSize.cs +++ b/DiscordChatExporter.Domain/Discord/Models/Common/FileSize.cs @@ -52,7 +52,7 @@ namespace DiscordChatExporter.Domain.Discord.Models.Common if (Math.Abs(TotalKiloBytes) >= 1) return "KB"; - return "B"; + return "bytes"; } public override string ToString() => $"{GetLargestWholeNumberValue():0.##} {GetLargestWholeNumberSymbol()}"; diff --git a/DiscordChatExporter.Domain/Exporting/Writers/Html/Core.css b/DiscordChatExporter.Domain/Exporting/Writers/Html/Core.css index f0609060..d1567a5c 100644 --- a/DiscordChatExporter.Domain/Exporting/Writers/Html/Core.css +++ b/DiscordChatExporter.Domain/Exporting/Writers/Html/Core.css @@ -266,6 +266,53 @@ img { border-radius: 3px; } +.chatlog__attachment-container { + height: 40px; + width: 100%; + max-width: 520px; + padding: 10px; + border: 1px solid; + border-radius: 3px; + overflow: hidden; +} + +.chatlog__attachment-icon { + float: left; + height: 100%; + margin-right: 10px; +} + +.chatlog__attachment-icon > .a { + fill: #f4f5fb; + d: path("M50,935a25,25,0,0,1-25-25V50A25,25,0,0,1,50,25H519.6L695,201.32V910a25,25,0,0,1-25,25Z"); +} + +.chatlog__attachment-icon > .b { + fill: #7789c4; + d: path("M509.21,50,670,211.63V910H50V50H509.21M530,0H50A50,50,0,0,0,0,50V910a50,50,0,0,0,50,50H670a50,50,0,0,0,50-50h0V191Z"); +} + +.chatlog__attachment-icon > .c { + fill: #f4f5fb; + d: path("M530,215a25,25,0,0,1-25-25V50a25,25,0,0,1,16.23-23.41L693.41,198.77A25,25,0,0,1,670,215Z"); +} + +.chatlog__attachment-icon > .d { + fill: #7789c4; + d: path("M530,70.71,649.29,190H530V70.71M530,0a50,50,0,0,0-50,50V190a50,50,0,0,0,50,50H670a50,50,0,0,0,50-50Z"); +} + +.chatlog__attachment-filesize { + color: #72767d; + font-size: 12px; +} + +.chatlog__attachment-filename { + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; +} + .chatlog__embed { display: flex; margin-top: 0.3em; diff --git a/DiscordChatExporter.Domain/Exporting/Writers/Html/Dark.css b/DiscordChatExporter.Domain/Exporting/Writers/Html/Dark.css index 82dca9ee..29cbf792 100644 --- a/DiscordChatExporter.Domain/Exporting/Writers/Html/Dark.css +++ b/DiscordChatExporter.Domain/Exporting/Writers/Html/Dark.css @@ -62,6 +62,11 @@ a { background-color: rgba(249, 168, 37, 0.05); } +.chatlog__attachment-container { + background-color: #2f3136; + border-color: #292b2f; +} + .chatlog__edited-timestamp { color: rgba(255, 255, 255, 0.2); } diff --git a/DiscordChatExporter.Domain/Exporting/Writers/Html/Light.css b/DiscordChatExporter.Domain/Exporting/Writers/Html/Light.css index 8f5ed6e8..e5db91e5 100644 --- a/DiscordChatExporter.Domain/Exporting/Writers/Html/Light.css +++ b/DiscordChatExporter.Domain/Exporting/Writers/Html/Light.css @@ -64,6 +64,11 @@ a { background-color: rgba(249, 168, 37, 0.05); } +.chatlog__attachment-container { + background-color: #f2f3f5; + border-color: #ebedef; +} + .chatlog__edited-timestamp { color: #747f8d; } diff --git a/DiscordChatExporter.Domain/Exporting/Writers/Html/MessageGroupTemplate.cshtml b/DiscordChatExporter.Domain/Exporting/Writers/Html/MessageGroupTemplate.cshtml index 5b0939a1..936e60ac 100644 --- a/DiscordChatExporter.Domain/Exporting/Writers/Html/MessageGroupTemplate.cshtml +++ b/DiscordChatExporter.Domain/Exporting/Writers/Html/MessageGroupTemplate.cshtml @@ -79,9 +79,22 @@ } else { - - @($"Attachment: {attachment.FileName} ({attachment.FileSize})") - +
}