msg-reader/index.html at main · nordnet/msg-reader · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="robots" content="noindex" />
    <title>msgReader</title>
    <link
      rel="icon"
      type="image/svg+xml"
      href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='%233b82f6' class='size-6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M21.75 6.75v10.5a2.25 2.25 0 0 1-2.25 2.25h-15a2.25 2.25 0 0 1-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25m19.5 0v.243a2.25 2.25 0 0 1-1.07 1.916l-7.5 4.615a2.25 2.25 0 0 1-2.36 0L3.32 8.91a2.25 2.25 0 0 1-1.07-1.916V6.75'/%3E%3C/svg%3E"
    />
    <script src="dist/bundle.js"></script>
    <link href="dist/styles.css" rel="stylesheet" />
  </head>

  <body>
    <!-- Drop Overlay -->
    <div class="drop-overlay">
      <div class="drop-message">drop .msg/.eml files here</div>
    </div>

    <!-- Welcome Screen -->
    <div id="welcomeScreen" class="welcome-screen">
      <div class="welcome-logo">
        <svg
          xmlns="http://www.w3.org/2000/svg"
          fill="none"
          viewBox="0 0 24 24"
          stroke-width="1.5"
          stroke="currentColor"
        >
          <path
            stroke-linecap="round"
            stroke-linejoin="round"
            d="M21.75 6.75v10.5a2.25 2.25 0 0 1-2.25 2.25h-15a2.25 2.25 0 0 1-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25m19.5 0v.243a2.25 2.25 0 0 1-1.07 1.916l-7.5 4.615a2.25 2.25 0 0 1-2.36 0L3.32 8.91a2.25 2.25 0 0 1-1.07-1.916V6.75"
          />
        </svg>
        msgReader
      </div>
      <div class="welcome-content">
        drop .msg/.eml files here or
        <label class="browse-button"
          >pick files<input
            type="file"
            id="fileInput"
            class="hidden"
            accept=".msg,.eml"
            multiple
        /></label>
      </div>
      <div class="info-text">
        <p>
          This application is hosted on Nordnet's Github repository. You can
          safely use this tool to read old emails that have been saved in the
          file formats .msg and .eml.
        </p>

        <p>
          The email is not uploaded to a server when you use this tool. It is
          opened in your local Internet browser and can't be read by anyone but
          you.
        </p>

        <p>
          You can read more about this tool
          <a href="https://daily.pilen.nordnet.se/2025/09/msg/">here</a>.
        </p>
      </div>
      <a
        href="https://github.com/Rasalas/msg-reader"
        class="read-more-link"
        target="_blank"
        rel="noopener noreferrer"
      >
        <span>made with ❤️ by Torben Buck</span>
        learn more
      </a>
    </div>

    <!-- Main App -->
    <div id="appContainer" class="app-container" style="display: none">
      <div class="message-list">
        <div class="app-logo">
          <svg
            xmlns="http://www.w3.org/2000/svg"
            fill="none"
            viewBox="0 0 24 24"
            stroke-width="1.5"
            stroke="currentColor"
          >
            <path
              stroke-linecap="round"
              stroke-linejoin="round"
              d="M21.75 6.75v10.5a2.25 2.25 0 0 1-2.25 2.25h-15a2.25 2.25 0 0 1-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25m19.5 0v.243a2.25 2.25 0 0 1-1.07 1.916l-7.5 4.615a2.25 2.25 0 0 1-2.36 0L3.32 8.91a2.25 2.25 0 0 1-1.07-1.916V6.75"
            />
          </svg>
          msgReader
        </div>
        <div class="upload-area rounded-2xl border-2 border-slate-300">
          <label>
            drop .msg/.eml files here or click to upload
            <input
              type="file"
              id="fileInputInApp"
              class="hidden"
              accept=".msg,.eml"
              multiple
            />
          </label>
        </div>
        <div id="messageItems" class="message-items">
          <!-- Message items will be inserted here -->
        </div>
      </div>
      <div id="messageViewer" class="message-viewer">
        <!-- Message content will be shown here -->
      </div>
    </div>
  </body>
</html>