whatisthis 1.0.0

A tool to identify file types based on their content
Documentation
<!DOCTYPE html>
<html lang="en">
    <head>
        <link data-trunk rel="copy-dir" href="public/" data-target-path="." />
        <meta charset="utf-8" />
        <link rel="icon" href="favicon.ico" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <title>whatisthis</title>
        <base data-trunk-public-url />
        <link data-trunk rel="rust" href="Cargo.toml" data-wasm-opt="z" data-bin="whatisthis" />
        <style>
            body {
                margin: 0;
            }
            #dropHandler {
                min-height: 50vh;
                background-color: #f0f0f0;
                display: flex;
                justify-content: center;
                flex-direction: column;
                padding: 10px;
            }
            #dropHandler .startDiv {
                text-align: center;
                margin: auto;
            }
            #dropHandler .startDiv ul {
                text-align: initial;
            }
            #dropHandler .startDiv .start {
                font-size: 2em;
            }
            details {
                margin-bottom: 5px;
            }
            summary {
                cursor: pointer;
            }
            details > details {
                margin-left: 10px;
            }
            details > span {
                margin-left: 20px;
                background: aqua;
                cursor: copy;
                line-break: anywhere;
            }
            .links {
                text-align: center;
            }
            .success {
                background-color: lightgreen;
            }
            .error {
                white-space: pre;
                background-color: orangered;
            }
            #string {
                white-space: pre;
                background: lightblue;
                overflow: auto;
            }
            #binary {
                white-space: pre-wrap;
                overflow: auto;
                background: lightcoral;
                word-break: break-word;
            }
            #hex {
                white-space: pre-wrap;
                overflow: auto;
                background: lightgoldenrodyellow;
            }
            #infos {
                white-space: pre;
                overflow: auto;
            }
            audio,
            video,
            img {
                width: 100%;
            }
        </style>
    </head>
    <body>
        <div class="links">
            <a href="https://github.com/Its-Just-Nans/whatisthis" target="_blank"
                >https://github.com/Its-Just-Nans/whatisthis</a
            >
        </div>
        <div id="dropHandler">
            <div class="startDiv">
                <input type="file" id="file-input" />
                <div class="start">Drop file here</div>
                <div>
                    <p>Features</p>
                    <ul>
                        <li>Image, Music, Video</li>
                        <li>Exif</li>
                        <li>Font</li>
                        <li>Zip</li>
                    </ul>
                </div>
            </div>
        </div>
    </body>

    <script src="./whatisthis.js" type="module"></script>
</html>