feat(editor): F4.6e the e-mail program and e-mail server on a computer's desktop

The oracle MailWindowRun uses Java's e-mail windows as a person does and
answers their dialogs. The core sets and saves the program's account,
deletes a mail, checks a form as Java's window does, and gives the server
its domain, new and removed accounts and the window's own line; the room
sends both programs' views and takes their actions; the editor has both
windows. Better than Java: a name field for a new account, a user name the
server has is refused, deleting hits the folder shown, a new domain goes
into the accounts file at once.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
2026-10-03 16:44:36 +00:00
co-authored by Claude Opus 5.5
parent aa54e5400e
commit 11f13bca84
33 changed files with 2841 additions and 52 deletions
+273
View File
@@ -536,3 +536,276 @@
overflow-wrap: anywhere;
user-select: text;
}
/* The e-mail program and server (GUIApplicationEmailAnwendungWindow,
* GUIApplicationEmailServerWindow): buttons above, Java's tabs as a row,
* a list, below the mail chosen or the page's form; writing and the account
* as a window over the program (Java's showModularWindow), Java's dialogs as
* a notice with its buttons. */
.mail-client,
.mail-server {
position: relative;
flex: 1;
min-height: 0;
display: flex;
flex-direction: column;
gap: 5px;
padding: 5px;
background: #eeeeee;
color: #000000;
font: 13px Dialog, sans-serif;
}
.mail-toolbar,
.mail-server-bar,
.mail-dialog-buttons {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 5px 10px;
flex: none;
}
.mail-toolbar button,
.mail-server-bar button,
.mail-dialog button,
.mail-question button,
.mail-form button,
.mail-accounts > button {
min-width: 44px;
min-height: 40px;
padding: 0 12px;
border: 1px solid #a0a0a0;
border-radius: 6px;
background: #f8f8f8;
color: #000000;
font: 13px Dialog, sans-serif;
cursor: pointer;
}
.mail-toolbar img {
display: block;
width: 32px;
height: 32px;
}
.mail-server-bar label {
flex: 1;
display: flex;
align-items: center;
gap: 6px;
min-width: 200px;
}
.mail-server-bar input,
.mail-form input,
.mail-dialog input,
.mail-dialog select {
flex: 1;
min-width: 0;
min-height: 32px;
padding: 0 6px;
border: 1px solid #a0a0a0;
background: #ffffff;
color: #000000;
font: 16px Dialog, sans-serif;
}
.mail-client [aria-invalid='true'],
.mail-server [aria-invalid='true'] {
border-color: #ff0000;
color: #ff0000;
}
.mail-tabs {
display: flex;
gap: 2px;
flex: none;
border-bottom: 1px solid #a0a0a0;
}
.mail-tabs button {
display: flex;
align-items: center;
gap: 6px;
min-height: 40px;
padding: 0 12px;
border: 1px solid #a0a0a0;
border-bottom: none;
border-radius: 6px 6px 0 0;
background: #e0e0e0;
color: #000000;
font: 13px Dialog, sans-serif;
cursor: pointer;
}
.mail-tabs button[aria-selected='true'] {
background: #ffffff;
}
.mail-list,
.mail-accounts {
flex: 1;
min-height: 80px;
overflow: auto;
background: #ffffff;
border: 1px solid #a0a0a0;
}
.mail-accounts {
display: flex;
flex-direction: column;
gap: 5px;
padding-bottom: 5px;
}
.mail-accounts > button {
align-self: flex-start;
margin-left: 5px;
}
.mail-list table,
.mail-accounts table {
width: 100%;
border-collapse: collapse;
table-layout: fixed;
}
.mail-list th,
.mail-accounts th {
padding: 4px 6px;
border-bottom: 1px solid #a0a0a0;
background: #e4e4e4;
font-weight: normal;
text-align: left;
}
.mail-list td,
.mail-accounts td {
height: 30px;
padding: 0 6px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
cursor: pointer;
}
.mail-list tr[aria-selected='true'] td,
.mail-accounts tr[aria-selected='true'] td {
background: rgb(184 207 229);
}
.mail-preview {
flex: 1;
min-height: 80px;
overflow: auto;
padding: 4px;
border: 1px solid #a0a0a0;
background: #ffffff;
}
.mail-preview pre,
.mail-log {
margin: 0;
font: 12px ui-monospace, Menlo, Consolas, monospace;
white-space: pre-wrap;
overflow-wrap: anywhere;
user-select: text;
}
.mail-welcome {
display: flex;
align-items: flex-start;
gap: 8px;
margin: 0;
font-family: Arial, sans-serif;
}
.mail-log {
flex: 1;
min-height: 80px;
overflow: auto;
padding: 4px;
border: 1px solid #a0a0a0;
background: #ffffff;
}
.mail-form {
display: flex;
flex-direction: column;
align-items: stretch;
gap: 6px;
max-width: 420px;
}
.mail-form label,
.mail-dialog label {
display: flex;
align-items: center;
gap: 6px;
}
.mail-form label span,
.mail-dialog label span {
flex: none;
width: 140px;
}
.mail-form > button {
align-self: flex-start;
}
.mail-notice {
margin: 0;
}
.mail-dialog {
position: absolute;
inset: 0;
z-index: 2;
display: flex;
flex-direction: column;
gap: 6px;
overflow: auto;
padding: 0 8px 8px;
background: #eeeeee;
}
.mail-dialog h4 {
margin: 0 -8px;
padding: 6px;
background: rgb(100 100 100);
color: rgb(250 250 250);
font: 13px Dialog, sans-serif;
text-align: center;
}
.mail-dialog textarea {
flex: 1;
min-height: 120px;
padding: 4px;
border: 1px solid #a0a0a0;
font: 16px ui-monospace, Menlo, Consolas, monospace;
}
.mail-question {
position: absolute;
left: 50%;
top: 30%;
z-index: 3;
transform: translateX(-50%);
width: min(90%, 380px);
padding: 12px;
border: 1px solid #808080;
border-radius: 6px;
background: #ffffff;
box-shadow: 0 4px 16px rgb(0 0 0 / 30%);
}
.mail-question p {
margin: 0 0 10px;
}
.mail-question button + button {
margin-left: 8px;
}