switch webapp to using 98.css

This commit is contained in:
Elijah R 2024-07-02 21:42:58 -04:00
parent 3955d05a59
commit 0c7fece5b6
4 changed files with 16 additions and 41 deletions

View file

@ -13,5 +13,6 @@
"parcel": "^2.12.0", "parcel": "^2.12.0",
"run-script-os": "^1.1.6", "run-script-os": "^1.1.6",
"typescript": "^5.5.3" "typescript": "^5.5.3"
} },
"type": "module"
} }

View file

@ -1,10 +1,4 @@
@font-face {
font-family: "MS Sans Serif";
src: url("../../assets/fonts/micross.ttf") format("truetype")
}
body { body {
font-family: "MS Sans Serif", sans-serif;
background-color: #3A6EA5; background-color: #3A6EA5;
font-size: 8pt; font-size: 8pt;
} }
@ -17,21 +11,11 @@ body {
display: none; display: none;
} }
.ms-window { .window {
display: none; display: none;
background-color: #d4d0c8;
position: fixed; position: fixed;
.ms-window-titlebar { .title-bar {
background-image: linear-gradient(to right, #0a246a, #a6caf0);
margin: 4px;
color: #ffffff;
user-select: none; user-select: none;
font-weight: bold;
font-size: 12pt;
}
.ms-window-body {
margin-right: 4px;
margin-left: 4px;
} }
} }
@ -44,6 +28,7 @@ body {
border-image: linear-gradient(to right, #013755, #9ec0da, #013755) 4; border-image: linear-gradient(to right, #013755, #9ec0da, #013755) 4;
* { * {
margin: 0; margin: 0;
font-size: 24pt;
} }
} }
@ -72,22 +57,6 @@ body {
margin-right: 90px; margin-right: 90px;
} }
button, input {
border-radius: 0;
}
button {
background-color: #d4d0c8;
}
input[type="text"] {
background-color: #ffffff;
}
input[type="text"]:focus-visible {
outline: none;
}
#chatBar { #chatBar {
margin: 0; margin: 0;
padding: 0; padding: 0;

View file

@ -7,15 +7,20 @@
<meta property="og:title" content="MSAgent Chat" /> <meta property="og:title" content="MSAgent Chat" />
<meta property="og:type" content="website" /> <meta property="og:type" content="website" />
<meta property="og:site_name" content="Computernewb's Internet Pub Hub" /> <meta property="og:site_name" content="Computernewb's Internet Pub Hub" />
<link rel="stylesheet" href="https://unpkg.com/98.css" />
<link type="text/css" rel="stylesheet" href="../css/style.css" /> <link type="text/css" rel="stylesheet" href="../css/style.css" />
</head> </head>
<body> <body>
<div id="logonView"> <div id="logonView">
<div class="ms-window" id="logonWindow"> <div class="window" id="logonWindow">
<div class="ms-window-titlebar">Log on to MSAgent Chat</div> <div class="title-bar">
<div class="ms-window-body"> <div class="title-bar-text">
Log on to MSAgent Chat
</div>
</div>
<div class="window-body">
<div id="logonWindowLogo"> <div id="logonWindowLogo">
<center><h1>MSAgent Chat Placeholder Logo</h1></center> <center><p>MSAgent Chat Placeholder Logo</p></center>
</div> </div>
<form id="logonForm"> <form id="logonForm">
<div id="logonUsernameContainer"> <div id="logonUsernameContainer">

View file

@ -25,8 +25,8 @@ export class MSWindow {
this.config = config; this.config = config;
this.wnd.style.width = config.width + "px"; this.wnd.style.width = config.width + "px";
this.wnd.style.height = config.height + "px"; this.wnd.style.height = config.height + "px";
let titlebar = this.wnd.querySelector("div.ms-window-titlebar"); let titlebar = this.wnd.querySelector("div.title-bar");
let body = this.wnd.querySelector("div.ms-window-body"); let body = this.wnd.querySelector("div.window-body");
if (!titlebar || !body) if (!titlebar || !body)
throw new Error("MSWindow is missing titlebar or body element."); throw new Error("MSWindow is missing titlebar or body element.");
this.titlebar = titlebar as HTMLDivElement; this.titlebar = titlebar as HTMLDivElement;